/* NOCLO v7: mega-menu, hero z animacja aplikacji, opinie, zakladki funkcji, karty pastelowe, akordeon obiektow */

/* ---------- logo ---------- */
.logo .lg{height:26px;width:auto;display:block}
.pre .lg{height:34px;width:auto}
.pre svg text{opacity:0;animation:preText .6s ease .2s forwards}
.pre svg circle{stroke-dasharray:70;stroke-dashoffset:70;animation:preDraw .9s cubic-bezier(.4,0,.2,1) .1s forwards}
.pre svg path{stroke-dasharray:40;stroke-dashoffset:40;animation:preDraw .5s cubic-bezier(.4,0,.2,1) .7s forwards}
@keyframes preText{to{opacity:1}}

/* ---------- naglowek z mega-menu ---------- */
.nav.mm .in{display:flex;align-items:center;gap:1.5rem;height:74px}
.nav.mm .links{flex:1;display:flex;justify-content:center}
.nav.mm .links ul{list-style:none;margin:0;padding:0;display:flex;gap:.2rem}
.nav.mm .links li{position:relative}
.nav.mm .links .nl{display:inline-flex;align-items:center;gap:.15rem;padding:.6rem .8rem;font-weight:600;font-size:.95rem;color:var(--ink2);border-radius:8px;transition:color .2s,background .2s}
.nav.mm .links .nl .ms{font-size:18px;color:var(--mute);transition:transform .25s}
.nav.mm .links li:hover>.nl,.nav.mm .links li.open>.nl,.nav.mm .links .nl.on{color:var(--p-d)}
.nav.mm .links li:hover>.nl .ms,.nav.mm .links li.open>.nl .ms{transform:rotate(180deg);color:var(--p)}
.nav.mm .links a::after{display:none}
.nav.mm .mega{position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%,10px);background:#fff;border-radius:16px;box-shadow:0 24px 70px rgba(20,24,29,.16),0 2px 8px rgba(20,24,29,.06);padding:.6rem;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease,transform .22s cubic-bezier(.2,.65,.2,1),visibility .22s;z-index:120}
.nav.mm .mega::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.nav.mm .mega::after{content:"";position:absolute;top:-6px;left:50%;width:12px;height:12px;background:#fff;transform:translateX(-50%) rotate(45deg);border-radius:2px}
.nav.mm .links li:hover>.mega,.nav.mm .links li.open>.mega{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.nav.mm .mega .cols{display:flex;gap:.4rem}
.nav.mm .mega .col{display:flex;flex-direction:column;min-width:230px}
.nav.mm .mega.sm .col{min-width:210px}
.nav.mm .mega.lg .col{min-width:250px}
.nav.mm .mega a{display:flex;align-items:center;gap:.7rem;padding:.65rem .8rem;border-radius:10px;font-weight:600;font-size:.92rem;color:var(--ink);transition:background .18s,color .18s,transform .18s}
.nav.mm .mega a:hover{background:var(--p-s);color:var(--p-d);transform:translateX(2px)}
.nav.mm .mega a .ic{width:32px;height:32px;border-radius:8px;background:var(--bg2);display:inline-flex;align-items:center;justify-content:center;flex:none;transition:background .18s,color .18s}
.nav.mm .mega a .ic .ms{font-size:19px;color:var(--ink2)}
.nav.mm .mega a:hover .ic{background:var(--p);color:#fff}
.nav.mm .mega a:hover .ic .ms{color:#fff}
.nav.mm .cta{display:flex;align-items:center;gap:1rem}
.nav.mm .cta .login{display:inline-flex;align-items:center;gap:.3rem;font-weight:600;color:var(--p-d)}
.nav.mm .cta .login .ms{font-size:18px}
.btn.pill{border-radius:999px;padding:.8rem 1.5rem}
.btn.p.pill{box-shadow:0 8px 24px rgba(216,111,69,.28)}
@media (max-width:1100px){.nav.mm .links{display:none}.nav.mm .cta .login{display:none}}
@media (max-width:640px){.nav.mm .cta .btn{padding:.6rem 1rem;font-size:.85rem}}
/* menu mobilne */
.nav.mm .links.openm{display:block;position:fixed;inset:74px 0 0 0;background:#fff;overflow:auto;padding:1rem 1.2rem 3rem;z-index:110}
.nav.mm .links.openm ul{flex-direction:column;gap:0}
.nav.mm .links.openm .nl{width:100%;justify-content:space-between;padding:.9rem .4rem;border-bottom:1px solid var(--line);border-radius:0;font-size:1.05rem}
.nav.mm .links.openm .mega{position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;box-shadow:none;padding:.2rem 0 .8rem;display:none}
.nav.mm .links.openm li.open>.mega{display:block}
.nav.mm .links.openm .mega::after,.nav.mm .links.openm .mega::before{display:none}
.nav.mm .links.openm .mega .cols{flex-direction:column;gap:0}

/* ---------- hero jak mobile-calendar: wysrodkowany, aplikacja ponizej ---------- */
.hero.mc{padding:64px 0 0;text-align:center;position:relative;overflow:hidden;background:#fff}
.hero.mc .wrap{position:relative;z-index:1}
.hero.mc .eyebrow{justify-content:center}
.hero.mc .eyebrow::before{display:none}
.hero.mc h1{max-width:18ch;margin:1rem auto .9rem;font-size:clamp(2.2rem,4.8vw,3.6rem)}
.hero.mc h1 span{color:var(--p)}
.hero.mc .lead{max-width:66ch;margin:0 auto;font-size:1.15rem}
.hero.mc .ctas{display:flex;justify-content:center;gap:1.2rem;margin:2.2rem 0 3rem;align-items:center;flex-wrap:wrap}
.hero.mc .play{display:inline-flex;align-items:center;gap:.7rem;font-weight:700;color:var(--ink)}
.hero.mc .play i{width:46px;height:46px;border-radius:50%;background:var(--p);color:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(216,111,69,.35);transition:transform .25s}
.hero.mc .play:hover i{transform:scale(1.08)}
.hero.mc .play .ms{font-size:24px}

.hero.mc .dark-tail{position:absolute;left:0;right:0;bottom:0;height:24%;background:#14181D;background-image:radial-gradient(rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px}
/* mock aplikacji */
.appx{position:relative;max-width:980px;margin:0 auto;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 40px 100px rgba(20,24,29,.28),0 0 0 1px rgba(20,24,29,.06);display:grid;grid-template-columns:168px minmax(0,1fr);text-align:left;font-size:11px;aspect-ratio:980/560}
.appx .sb{background:#14181D;color:#fff;padding:14px 12px;display:flex;flex-direction:column;gap:6px}
.appx .sb .brand{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.appx .sb .brand .lg{height:18px}
.appx .sb .usr{display:flex;flex-direction:column;align-items:center;gap:4px;margin:6px 0 12px;font-size:10px;color:rgba(255,255,255,.7)}
.appx .sb .usr i{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#F3C9B5,#D86F45);display:block;border:2px solid rgba(255,255,255,.2)}
.appx .sb .usr b{color:#fff;font-size:11px}
.appx .sb small{font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--p-l);margin:6px 0 2px}
.appx .sb a{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:7px;color:rgba(255,255,255,.75);font-weight:600;font-size:10.5px}
.appx .sb a .ms{font-size:15px;color:rgba(255,255,255,.6)}
.appx .sb a.on{background:rgba(255,255,255,.1);color:#fff}
.appx .sb a .bd{margin-left:auto;background:#E4463C;color:#fff;font-size:8px;border-radius:999px;padding:1px 5px}
.appx .mn{display:flex;flex-direction:column;min-width:0;position:relative}
.appx .tb{height:38px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:0 14px;color:var(--mute)}
.appx .tb .ms{font-size:16px}
.appx .tb .r{margin-left:auto;display:flex;gap:10px;align-items:center}
.appx .tb .r i{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#F3C9B5,#D86F45);display:block}
.appx h4{margin:12px 14px 6px;font-size:15px;font-weight:800}
.appx .mo{display:flex;align-items:center;gap:6px;padding:0 14px 8px;font-size:9.5px;color:var(--mute);font-weight:600}
.appx .mo span{padding:2px 5px;border-radius:4px}
.appx .mo span.on{background:var(--p);color:#fff}
.appx .cal{display:grid;grid-template-columns:96px repeat(14,1fr);border-top:1px solid var(--line);flex:1;position:relative}
.appx .cal>div{border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:23px;font-size:9px;position:relative}
.appx .cal .h{text-align:center;color:var(--mute);font-weight:700;padding:3px 0 2px;line-height:1.1;background:#FAFAF8}
.appx .cal .h b{display:block;font-size:10px;color:var(--ink)}
.appx .cal .h.td{color:var(--p)}.appx .cal .h.td b{color:var(--p)}
.appx .cal .h.we{background:#F3F3F0}
.appx .cal .rm{background:#14181D;color:#fff;padding:3px 6px;font-weight:700;font-size:9px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:1px solid rgba(255,255,255,.1)}
.appx .cal .rm small{display:flex;gap:4px;align-items:center;color:rgba(255,255,255,.55);font-weight:500;font-size:8px}
.appx .cal .rm small i{width:9px;height:9px;border-radius:2px;background:#1A4FA0;color:#fff;font-style:normal;font-size:7px;display:inline-flex;align-items:center;justify-content:center;font-weight:900}
.appx .cal .we{background:#FAFAF8}
.appx .cal .bar{position:absolute;top:4px;height:15px;border-radius:999px;color:#fff;font-size:8.5px;font-weight:700;display:flex;align-items:center;gap:4px;padding:0 8px;white-space:nowrap;overflow:hidden;z-index:2;opacity:0;transform:scaleX(.6);transform-origin:left;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.9,.3,1.2)}
.appx .cal .bar.in{opacity:1;transform:none}
.appx .cal .bar i{width:11px;height:11px;border-radius:50%;background:#fff;color:#1A4FA0;font-style:normal;font-size:7px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;flex:none}
.appx .cal .bar.a{background:var(--p)}.appx .cal .bar.b{background:#1A4FA0}.appx .cal .bar.c{background:#FF385C}.appx .cal .bar.c i{color:#FF385C}.appx .cal .bar.e{background:#E0B93A;color:#3b2a05}.appx .cal .bar.e i{color:#8a6d00}.appx .cal .bar.x{background:repeating-linear-gradient(135deg,#eee 0 4px,#f7f7f5 4px 8px);color:var(--mute)}
.appx .cur{position:absolute;width:20px;height:26px;z-index:6;pointer-events:none;opacity:0;transition:left .8s cubic-bezier(.2,.7,.2,1),top .8s cubic-bezier(.2,.7,.2,1),opacity .3s;filter:drop-shadow(0 3px 6px rgba(0,0,0,.35))}
.appx .cur.on{opacity:1}
.appx .qv{position:absolute;z-index:5;background:#fff;border-radius:10px;box-shadow:0 18px 44px rgba(20,24,29,.22);padding:10px 12px;width:210px;font-size:10px;opacity:0;transform:translateY(8px) scale(.96);transition:opacity .3s,transform .35s cubic-bezier(.2,.65,.2,1)}
.appx .qv.on{opacity:1;transform:none}
.appx .qv b{font-size:11px;display:block}
.appx .qv .row{display:flex;justify-content:space-between;padding:4px 0;border-top:1px solid var(--line);color:var(--ink2)}
.appx .qv .row:first-of-type{border-top:0}
.appx .qv .tag{display:inline-block;background:var(--ok-s);color:var(--ok);font-weight:700;font-size:9px;padding:1px 6px;border-radius:4px}
.appx .nt{position:absolute;right:14px;top:46px;z-index:7;background:#fff;border-radius:12px;box-shadow:0 18px 44px rgba(20,24,29,.22);padding:10px 12px;width:230px;font-size:10px;display:flex;gap:8px;opacity:0;transform:translateX(24px);transition:opacity .35s,transform .45s cubic-bezier(.2,.65,.2,1)}
.appx .nt.on{opacity:1;transform:none}
.appx .nt .ic{width:26px;height:26px;border-radius:50%;background:var(--p-s);color:var(--p);display:inline-flex;align-items:center;justify-content:center;flex:none}
.appx .nt .ic .ms{font-size:15px}
.appx .nt b{display:block;font-size:10.5px}
.appx .nt small{color:var(--mute);display:block}
.appx .nt .lnk{color:var(--p);font-weight:700;margin-top:3px;display:block}
.appx .nt.shake{animation:ntShake .6s ease}
@keyframes ntShake{0%,100%{transform:none}20%{transform:rotate(-2deg)}40%{transform:rotate(2deg)}60%{transform:rotate(-1deg)}80%{transform:rotate(1deg)}}
@media (max-width:760px){.appx{grid-template-columns:1fr;aspect-ratio:auto}.appx .sb{display:none}.appx .cal{grid-template-columns:70px repeat(7,1fr)}.appx .cal>div:nth-child(n+9):nth-child(-n+15){display:none}.appx .nt{display:none}}

/* ---------- opinie na ciemnym ---------- */
.rev{background:#14181D;color:#fff;padding:96px 0 80px;background-image:radial-gradient(60% 50% at 85% 10%,rgba(216,111,69,.18),transparent 65%)}
.rev h2{color:#fff;text-align:center;font-weight:600;font-size:1.6rem;margin-bottom:3rem}
.rev .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.rev .q{text-align:center;display:flex;flex-direction:column;align-items:center;gap:.9rem;padding:0 1rem}
.rev .q .qm{color:var(--p);font-size:3rem;line-height:.6;font-weight:800;font-family:Georgia,serif}
.rev .q h3{color:#fff;font-size:1.35rem}
.rev .q .stars{color:#F5B301;letter-spacing:.15em;font-size:1.1rem}
.rev .q p{color:rgba(255,255,255,.82);max-width:34ch}
.rev .q .who{display:flex;align-items:center;gap:.7rem;margin-top:.6rem;font-weight:700}
.rev .q .who i{width:44px;height:44px;border-radius:50%;display:block;background:linear-gradient(135deg,#F3C9B5,#D86F45)}
.rev .q .who i.b{background:linear-gradient(135deg,#c9d6cf,#4a6a5d)}.rev .q .who i.c{background:linear-gradient(135deg,#9fb3dd,#22397a)}
@media (max-width:900px){.rev .grid{grid-template-columns:1fr}}

/* ---------- zakladki funkcji ---------- */
.ftabs{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;max-width:1080px;margin:0 auto 1.6rem}
.ftabs button{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.3rem;border:1px solid var(--line);border-radius:12px;background:#fff;font-weight:700;font-size:1rem;color:var(--ink);transition:background .2s,color .2s,border-color .2s,transform .2s,box-shadow .2s}
.ftabs button .ms{font-size:22px;color:var(--ink2)}
.ftabs button:hover{border-color:var(--p-l);transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,24,29,.08)}
.ftabs button.on{background:var(--p);border-color:var(--p);color:#fff;box-shadow:0 12px 30px rgba(216,111,69,.3)}
.ftabs button.on .ms{color:#fff}
.fpanel{background:var(--p-s);border-radius:24px;padding:3rem 3.5rem;display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;min-height:440px}
.fpanel .fp{display:none}
.fpanel .fp.on{display:contents}
.fpanel .fp.on>*{animation:cmpIn .55s cubic-bezier(.2,.65,.2,1) both}
.fpanel .fp.on>*:nth-child(2){animation-delay:.1s}
.fpanel h3{font-size:1.9rem;margin-bottom:1rem}
.fpanel p{color:var(--ink2);font-size:1.08rem}
.fpanel .link{margin-top:1.2rem;display:inline-flex}
.fpanel .cmp{max-width:520px}
.fpanel .cmp .blob{display:none}
@media (max-width:900px){.fpanel{grid-template-columns:1fr;padding:2rem 1.4rem}.ftabs button{font-size:.9rem;padding:.7rem 1rem}}

/* ---------- karty pastelowe ---------- */
.pastel{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.pastel div{border-radius:20px;padding:3rem 3rem 2.6rem;display:flex;flex-direction:column;gap:.9rem;min-height:320px;transition:transform .28s cubic-bezier(.2,.65,.2,1),box-shadow .28s}
.pastel div:hover{transform:translateY(-4px);box-shadow:0 22px 50px rgba(20,24,29,.10)}
.pastel div:nth-child(1),.pastel div:nth-child(3){background:#FBE7DC}
.pastel div:nth-child(2){background:#E4EAF8}
.pastel h3{font-size:1.35rem}
.pastel p{color:var(--ink2);font-size:.98rem;flex:1}
.pastel .btn{align-self:flex-start;background:transparent;border-color:var(--p);color:var(--p-d);font-size:.9rem}
.pastel .btn:hover{background:var(--p);color:#fff}
@media (max-width:900px){.pastel{grid-template-columns:1fr}}

/* ---------- akordeon obiektow ---------- */
.acc{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.acc .list{background:var(--bg2);border-radius:20px;padding:1rem 1.6rem}
.acc details{border-bottom:1px solid var(--line)}
.acc details:last-child{border-bottom:0}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:1rem 0;font-size:1.4rem;font-weight:700;letter-spacing:-.01em}
.acc summary::-webkit-details-marker{display:none}
.acc summary .ms{width:36px;height:36px;border-radius:50%;background:#fff;display:inline-flex;align-items:center;justify-content:center;color:var(--ink2);transition:transform .25s,background .2s,color .2s}
.acc details[open] summary{color:var(--p-d)}
.acc details[open] summary .ms{transform:rotate(45deg);background:var(--p);color:#fff}
.acc details p{color:var(--ink2);padding:0 0 1.2rem;max-width:56ch;animation:cmpIn .4s ease}
.acc .pic{position:relative}
@media (max-width:900px){.acc{grid-template-columns:1fr}.acc .pic{order:-1}}
.appx .cal>div{height:24px;min-height:0}
.appx .cal .h{height:26px}
.appx .cal .rm{height:24px;display:flex;flex-direction:column;justify-content:center}
.nav .logo .lg,.foot .logo .lg{width:126px;height:28px;max-width:none}
.foot .logo .lg{width:119px}
.appx .mn{overflow:hidden}
@media (max-width:760px){.appx .mn{overflow-x:auto}.appx .cal{min-width:680px}.appx h4,.appx .mo{position:sticky;left:0}.appx .mo span:nth-child(n+8){display:none}}

@media (max-width:1100px){.nav.mm .burger{display:inline-flex}.nav.mm .cta{display:flex}}
.nav.mm .links.openm{display:block!important;height:calc(100vh - 74px)}