/* NovaStrona — arkusz stron klienta (renderer). Motyw przez zmienne CSS z lib/themes.js. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.site{margin:0;font-family:var(--font-body);background:var(--bg);color:var(--ink);line-height:1.55}
body.site h1,body.site h2,body.site h3{font-family:var(--font-head);line-height:1.15}
.sr{position:absolute;left:-9999px}
.site .wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.demo-strip{background:var(--accent);color:var(--accentInk);text-align:center;font-size:.85rem;padding:6px}
.demo-strip a{color:inherit;font-weight:700}
/* header */
.site-header{position:sticky;top:0;z-index:40;background:var(--inv);color:var(--invInk)}
.site-header .wrap{display:flex;align-items:center;gap:18px;padding:10px 20px}
.brand{font-weight:700;color:inherit;text-decoration:none;font-size:1rem}
.site-header nav{display:flex;gap:16px;margin-left:auto}
.site-header nav a{color:inherit;opacity:.8;text-decoration:none;font-size:.9rem}
.site-header nav a:hover{opacity:1}
.hdr-tel{color:inherit;text-decoration:none;font-weight:700;font-size:.92rem;opacity:.95}
.hdr-tel span{opacity:.65;font-weight:400}
/* elementy */
.btn{display:inline-block;background:var(--accent);color:var(--accentInk);padding:11px 20px;border-radius:calc(var(--r-btn, var(--radius)));font-weight:700;text-decoration:none;border:0;cursor:pointer;font-family:inherit;font-size:.95rem}
.btn-ghost{display:inline-block;border:1.5px solid currentColor;color:inherit;padding:10px 18px;border-radius:calc(var(--r-btn, var(--radius)));font-weight:600;text-decoration:none;background:transparent}
.fine{color:var(--mute);font-size:.85rem}
.kicker{text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;color:var(--mute);margin:0 0 6px}
.lbl{color:var(--mute);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;margin:0 0 6px}
/* hero */
.hero{position:relative;overflow:hidden}
.hero.split .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:34px;align-items:center;padding:56px 20px}
.hero h1{font-size:clamp(1.8rem,4.4vw,3rem);margin:0 0 12px}
.hero .lead{font-size:1.05rem;color:var(--mute);margin:0 0 18px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.rating{display:inline-block;margin:4px 0 12px;font-weight:700;color:inherit;text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-size:.85rem;background:var(--surface)}
.badges{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.badges li{font-size:.8rem;color:var(--mute);border:1px dashed var(--line);border-radius:999px;padding:3px 10px}
.hero-ph{border-radius:var(--r-card, var(--radius));overflow:hidden;aspect-ratio:4/3;background:var(--surface)}
.s-ph{position:relative;display:grid;gap:12px}
.s-ph .hero-ph:nth-child(2){position:absolute;right:-8px;bottom:-18px;width:55%;box-shadow:0 20px 50px rgba(0,0,0,.18);border:4px solid var(--bg)}
.hero-full .hero-bg{position:absolute;inset:0;display:flex;overflow:hidden;filter:saturate(.9)}
.hero-full .hero-bg .hero-ph{flex:1;border-radius:0;aspect-ratio:auto}
.hero-full .hero-center{position:relative;padding:110px 20px 70px;color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.45);max-width:1080px;margin:0 auto}
.hero-full .hero-bg .ph svg{height:100%}
.hero-full .lead{color:#e8eaee}
.hero-full .rating{background:rgba(0,0,0,.35);border-color:rgba(255,255,255,.3);color:#fff}
.hero-full .badges li{color:#e8eaee;border-color:rgba(255,255,255,.35)}
.hero-full .btn-ghost{color:#fff}
.bento{display:grid;grid-template-columns:1.2fr .8fr;grid-template-rows:auto auto;gap:14px;padding:46px 20px}
.b-main{grid-row:1/3;border-radius:var(--r-card, var(--radius));overflow:hidden;aspect-ratio:16/11;background:var(--surface)}
.b-tile{background:var(--surface);border-radius:var(--r-card, var(--radius));padding:18px}
.b-tile h1{font-size:clamp(1.5rem,3vw,2.2rem);margin:0 0 10px}
.b-tile .lead{color:var(--mute)}
.b-tile.small{display:flex;flex-direction:column;justify-content:center}
.app-hero{padding-top:0}
.app-cover{height:220px;border-radius:0 0 var(--radius) var(--radius);overflow:hidden;margin:0 -20px}
.app-cover .hero-ph{display:flex;height:100%}
.app-card{background:var(--surface);border-radius:var(--r-card, var(--radius));margin-top:-60px;position:relative;padding:22px;box-shadow:0 24px 60px rgba(0,0,0,.14)}
.app-card h1{font-size:clamp(1.5rem,3vw,2.1rem);margin:0 0 10px}
.tabs{display:flex;gap:4px;margin:16px 0 10px;border-bottom:1px solid var(--line)}
.tabs button{all:unset;cursor:pointer;padding:8px 14px;font-size:.88rem;color:var(--mute);border-bottom:2px solid transparent}
.tabs button[aria-selected="true"]{color:var(--ink);border-color:var(--accent);font-weight:600}
.menu-row{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:.92rem;border-bottom:1px dashed var(--line)}
/* sekcje */
.sec{padding:56px 0} .sec-alt{background:var(--alt)}
.sec h2{font-size:clamp(1.4rem,3vw,2rem);margin:0 0 18px}
.cat h3{margin:22px 0 8px;font-size:1.05rem}
.offer{list-style:none;padding:0;margin:0}
.offer li{display:flex;justify-content:space-between;gap:16px;padding:10px 2px;border-bottom:1px solid var(--line)}
.offer .o-n small{color:var(--mute);display:block;font-size:.82rem}
.offer .o-p{font-weight:700;white-space:nowrap}
/* rezerwacja */
.book{display:grid;gap:12px;max-width:640px}
.book select{width:100%;padding:11px;border-radius:calc(var(--r-btn, var(--radius)));border:1px solid var(--line);background:var(--bg);color:var(--ink);font-family:inherit;font-size:.95rem}
.days{display:flex;gap:8px;overflow-x:auto;padding:4px 0}
.days .chip{flex:0 0 auto;border:1px solid var(--line);background:transparent;color:var(--ink);padding:8px 12px;border-radius:calc(var(--r-btn, var(--radius)));cursor:pointer;font-family:inherit;text-align:center}
.days .chip small{display:block;color:var(--mute);font-size:.72rem}
.days .chip.on{background:var(--accent);color:var(--accentInk);border-color:var(--accent)} .days .chip.on small{color:var(--accentInk)}
.slots{display:flex;gap:8px}
.chip.s{border:1px solid var(--line);background:transparent;color:var(--ink);padding:9px 16px;border-radius:999px;cursor:pointer;font-family:inherit}
.chip.s.on{background:var(--accent);color:var(--accentInk);border-color:var(--accent)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.row input,.row select{padding:11px;border-radius:calc(var(--r-btn, var(--radius)));border:1px solid var(--line);background:var(--bg);color:var(--ink);font-family:inherit}
.book .row input{flex:1;min-width:150px}
/* opinia */
.review{margin:0;text-align:center;max-width:640px;margin-inline:auto}
.review div{color:var(--accent);letter-spacing:.2em;font-size:1.1rem}
.review blockquote{font-size:1.15rem;font-style:italic;margin:12px 0 6px}
.review figcaption{color:var(--mute);font-size:.85rem}
/* galeria */
.gal{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.gal-i{border-radius:var(--r-card, var(--radius));overflow:hidden;aspect-ratio:4/3;background:var(--surface)}
.ph{height:100%;width:100%} .ph svg{width:100%;height:100%;display:block}
.hero-ph .ph{height:100%}
/* pasek CTA */
.band{background:var(--accent);color:var(--accentInk)}
.band-in{display:grid;gap:18px;padding:34px 20px;grid-template-columns:1fr 1fr;align-items:center}
.band .btn-big{font-size:1.05rem;font-weight:800;color:var(--accentInk);text-decoration:none;border:2px solid currentColor;padding:12px 18px;border-radius:calc(var(--r-btn, var(--radius)));display:inline-block}
.band .btn-ghost{color:var(--accentInk)}
.band .callback{grid-column:1/-1}
.band .callback label{display:block;font-size:.85rem;margin-bottom:6px}
.band .row input,.band .row select{border-color:rgba(0,0,0,.25);background:rgba(255,255,255,.92);color:#20242a;padding:9px 10px;border-radius:8px}
.band .row .btn{background:#101418;color:#fff}
.band .row{margin:0}
/* o nas / newsletter / kontakt */
.about{max-width:720px}
.about p{color:var(--mute)}
.newsletter .nl{display:flex;gap:10px;max-width:480px;flex-wrap:wrap}
.newsletter input{flex:1;min-width:200px;padding:11px;border-radius:calc(var(--r-btn, var(--radius)));border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:34px}
.big-tel{font-size:1.5rem;font-weight:800;color:inherit;text-decoration:none}
.hours{border-collapse:collapse;margin:12px 0}
.hours th,.hours td{text-align:left;padding:5px 14px 5px 0;font-weight:400;color:var(--mute)}
.hours tr.today th,.hours tr.today td{color:var(--ink);font-weight:700}
.hours tr.today th span{font-size:.75rem;background:var(--accent);color:var(--accentInk);border-radius:999px;padding:1px 8px;margin-left:6px}
.form{background:var(--surface);border-radius:var(--r-card, var(--radius));padding:20px}
.form label{display:block;margin:10px 0;font-size:.85rem;color:var(--mute)}
.form input,.form textarea{width:100%;margin-top:4px;padding:10px;border-radius:calc(var(--r-btn, var(--radius)));border:1px solid var(--line);background:var(--bg);color:var(--ink);font-family:inherit}
.form .btn{margin-top:12px}
/* stopka */
.site-footer{background:var(--inv);color:var(--invInk)}
.foot{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;padding:36px 20px 10px}
.foot .brand{font-size:1.05rem}
.foot a{color:inherit} .foot .lbl{color:var(--invInk);opacity:.6}
.foot p{margin:4px 0;font-size:.9rem;opacity:.9}
.legal{opacity:.65;font-size:.8rem;padding:10px 20px 26px}
/* pasek mobilny + czat */
.mobile-bar{position:fixed;left:0;right:0;bottom:0;display:none;grid-template-columns:1fr 1fr 1fr;background:var(--inv);z-index:50}
.mobile-bar a{color:var(--invInk);text-decoration:none;text-align:center;padding:13px 4px;font-weight:700;font-size:.9rem;border-left:1px solid rgba(255,255,255,.12)}
.mobile-bar a:first-child{border:0}
.chat-fab{position:fixed;right:16px;bottom:76px;z-index:55;background:var(--accent);color:var(--accentInk);border:0;border-radius:999px;padding:12px 18px;font-weight:700;cursor:pointer;font-family:inherit;box-shadow:0 12px 30px rgba(0,0,0,.22)}
.chat{position:fixed;right:16px;bottom:130px;width:min(340px,calc(100vw - 32px));background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:14px;z-index:56;padding:0;box-shadow:0 24px 60px rgba(0,0,0,.3)}
.chat::backdrop{background:transparent}
.chat .chat-x{position:absolute;top:6px;right:6px}
.chat .chat-x button{all:unset;cursor:pointer;color:var(--mute);padding:4px 8px}
.chat-log{max-height:260px;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:8px}
.chat-log p{margin:0;padding:8px 12px;border-radius:12px;font-size:.9rem;max-width:85%}
.chat-log p.bot{background:var(--surface);align-self:flex-start}
.chat-log p.user{background:var(--accent);color:var(--accentInk);align-self:flex-end}
.chat-in{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line)}
.chat-in input{flex:1;padding:9px 12px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-family:inherit}
.chat-in .btn{padding:9px 14px}
.open-now{font-weight:700}
.open-now.closed{color:#c0563f}
@media(max-width:860px){
.hero.split .wrap{grid-template-columns:1fr;padding:36px 20px}
.bento{grid-template-columns:1fr;padding:26px 20px}
.band-in{grid-template-columns:1fr}
.contact{grid-template-columns:1fr}
.mobile-bar{display:grid}
.site-header .hdr-tel span{display:none}
body.site{padding-bottom:52px}
.chat-fab{bottom:64px}
.chat{bottom:120px}
}
.social-links{display:flex;gap:8px;flex-wrap:wrap}
.social-links a{color:var(--accent);text-decoration:none;font-weight:600;font-size:.9rem}
/* moduły branżowe: wycena / jak działamy / metamorfozy / wolne terminy */
.wycena-form textarea{width:100%;padding:10px;border-radius:calc(var(--r-btn,8px));border:1px solid var(--line);background:var(--bg);color:var(--ink);font-family:inherit}
.jd-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.jd-steps li{display:flex;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card,12px);padding:16px}
.jd-steps i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--accent);color:var(--accentInk);font-style:normal;font-weight:700;flex:none}
.jd-steps b{display:block;margin-bottom:4px}
.jd-steps p{margin:0;color:var(--mute);font-size:.88rem}
.mm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-top:14px}
.mm{margin:0}
.mm-cmp{position:relative;height:240px;border-radius:var(--r-img,12px);overflow:hidden}
.mm-b,.mm-a{position:absolute;inset:0}
.mm-a{clip-path:inset(0 0 0 50%)}
.mm-cmp input[type=range]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.mm-cmp::after{content:"◂ przed | po ▸";position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.55);color:#fff;font-size:.68rem;padding:3px 10px;border-radius:999px;pointer-events:none}
.mm figcaption{text-align:center;color:var(--mute);font-size:.85rem;margin-top:8px}
.slots-cards{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.slot-chip{display:inline-block;border:1px solid var(--accent);color:var(--ink);background:var(--surface);border-radius:999px;padding:10px 18px;font-weight:700;text-decoration:none;font-size:.92rem}
.slot-chip:hover{background:var(--accent);color:var(--accentInk)}