:root{
  --teal:#1F6F78;--teal-d:#165860;--teal-l:#2a8a94;--coral:#F28C6B;--coral-d:#e0704c;--cream:#F7F5F0;--ink:#24282b;
  --mist:#E8F1F2;--sun:#FFD58A;--line:#e6e1d6;--muted:#596166;--r:22px;--sh:0 14px 40px rgba(31,111,120,.14);--sh2:0 24px 60px rgba(36,40,43,.18)
}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font:400 17px/1.65 Nunito,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;height:auto;display:block}
a{color:var(--teal)}
h1,h2,h3{font-family:Fredoka,Nunito,system-ui,sans-serif;font-weight:600;line-height:1.12;margin:0 0 .45em;letter-spacing:-.005em}
h1{font-size:clamp(38px,5.6vw,64px)}
h2{font-size:clamp(28px,3.6vw,42px);color:var(--teal)}
h3{font-size:20px}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}.narrow{max-width:800px;margin-left:auto;margin-right:auto}.center{text-align:center}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:10px;z-index:99}.skip:focus{left:10px}
.kicker{font:700 14px/1 Nunito,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--coral-d);margin:0 0 12px}.kicker.light{color:var(--sun)}
.pill{display:inline-block;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:8px 16px;font-weight:700;font-size:14px;margin:0 0 20px;box-shadow:0 4px 14px rgba(0,0,0,.04)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 17px/1 Fredoka,sans-serif;padding:16px 28px;border-radius:999px;text-decoration:none;border:2.5px solid transparent;transition:transform .18s cubic-bezier(.3,1.6,.6,1),background .15s,box-shadow .15s,color .15s;cursor:pointer;white-space:nowrap}
.btn:hover{transform:translateY(-3px) scale(1.02)}.btn:active{transform:translateY(0) scale(.98)}
.btn-coral{background:var(--coral);color:#fff;box-shadow:0 6px 0 var(--coral-d),0 14px 24px rgba(242,140,107,.35)}.btn-coral:hover{background:#f49a7c}
.btn-teal{background:var(--teal);color:#fff;box-shadow:0 4px 0 var(--teal-d)}.btn-teal:hover{background:var(--teal-l)}
.btn-ghost{border-color:var(--teal);color:var(--teal);background:#fff}.btn-ghost:hover{background:var(--teal);color:#fff}
.btn-light{background:#fff;color:var(--teal);box-shadow:0 6px 0 rgba(0,0,0,.12)}
.btn-sm{padding:10px 16px;font-size:15px}.btn-lg{padding:20px 34px;font-size:20px}
.badge{display:inline-block;background:var(--sun);color:var(--ink);font:700 12px/1 Nunito,sans-serif;letter-spacing:.04em;padding:7px 12px;border-radius:999px;margin-bottom:10px}
/* top */
.sale{background:var(--ink);color:#fff;text-align:center;font-size:14px;padding:9px 16px;font-weight:600}.sale a{color:var(--sun);text-decoration:none;margin-left:6px}
.nav{position:sticky;top:0;z-index:20;background:rgba(247,245,240,.88);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;gap:26px;height:72px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font:700 24px/1 Fredoka,sans-serif}.logo img{border-radius:12px;transition:transform .3s}.logo:hover img{transform:rotate(-8deg) scale(1.06)}
.logo b{color:var(--teal);font-weight:700}.logo i{font-style:normal;color:var(--coral)}
.links{display:flex;gap:28px;margin-left:auto}.links a{text-decoration:none;color:var(--ink);font:600 16px Nunito,sans-serif;position:relative}
.links a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:3px;border-radius:3px;background:var(--coral);transform:scaleX(0);transition:transform .2s}.links a:hover::after{transform:scaleX(1)}
/* hero */
.hero{position:relative;padding:70px 0 80px;overflow:hidden}
.blob{position:absolute;border-radius:50%;filter:blur(2px);opacity:.55;z-index:-1}
.b1{width:520px;height:520px;background:radial-gradient(circle at 30% 30%,#cfe6e8,transparent 70%);right:-120px;top:-120px}
.b2{width:380px;height:380px;background:radial-gradient(circle at 50% 50%,#ffe0d3,transparent 70%);left:-140px;bottom:-160px}
.hero-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:center}
.hl{color:var(--teal);position:relative;white-space:nowrap}
.hl::after{content:"";position:absolute;left:-4px;right:-4px;bottom:.06em;height:.32em;background:var(--sun);z-index:-1;border-radius:6px;transform:rotate(-1.5deg)}
.lead{font-size:20px;color:var(--muted);max-width:560px}
.ctas{display:flex;flex-wrap:wrap;gap:16px;margin:30px 0 24px}.center-ctas{justify-content:center}
.ticks{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px 22px;font-size:15px;color:var(--muted);font-weight:600}
.ticks li::before{content:"✓";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--mist);color:var(--teal);font-size:12px;font-weight:800;margin-right:8px}
.hero-stage{position:relative;padding:20px}
.device{border-radius:28px;background:#fff;padding:12px;box-shadow:var(--sh2);transform:rotate(2deg);transition:transform .4s}
.device:hover{transform:rotate(0) scale(1.01)}
.device video{border-radius:18px;width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--mist)}
.panda-buddy{position:absolute;left:-18px;bottom:-14px;display:flex;align-items:flex-end;gap:6px;animation:bob 3.2s ease-in-out infinite}
.panda-buddy img{border-radius:24px;box-shadow:var(--sh);width:96px;height:96px}
.bubble{background:#fff;font:600 15px Fredoka,sans-serif;padding:10px 14px;border-radius:16px 16px 16px 4px;box-shadow:var(--sh);margin-bottom:62px;white-space:nowrap}
.float-card{position:absolute;background:#fff;border-radius:16px;padding:12px 16px;box-shadow:var(--sh);display:flex;flex-direction:column;line-height:1.2}
.float-card b{font:700 20px Fredoka,sans-serif;color:var(--teal)}.float-card small{color:var(--muted);font-weight:600}
.fc1{right:-6px;top:6%;animation:bob 4s ease-in-out infinite .5s}.fc2{right:8%;bottom:-10px;animation:bob 3.6s ease-in-out infinite 1s}
.fc2 b{color:var(--coral-d)}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
/* marquee */
.marquee-wrap{overflow:hidden;padding:12px 0}.marquee{background:var(--teal);color:#fff;overflow:hidden;padding:14px 0;transform:rotate(-1deg) scale(1.02);box-shadow:0 8px 20px rgba(31,111,120,.18)}
.marquee-in{display:flex;gap:48px;width:max-content;animation:scroll 32s linear infinite;font:600 20px Fredoka,sans-serif}
.marquee-in span::before{content:"🐼";margin-right:14px;font-size:18px}
@keyframes scroll{to{transform:translateX(-50%)}}
/* goals */
.goals{padding:96px 0 40px}
.sec-head{text-align:center;max-width:700px;margin:0 auto 40px}.sec-head p{color:var(--muted)}
.goal-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.goal{background:#fff;border:2px solid var(--line);border-radius:var(--r);padding:26px 22px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:12px;transition:transform .2s,border-color .2s,box-shadow .2s}
.goal:hover{transform:translateY(-6px) rotate(-.6deg);border-color:var(--coral);box-shadow:var(--sh)}
.goal span:not(.goal-ico){font:600 20px/1.25 Fredoka,sans-serif}.goal b{color:var(--teal);font-size:15px;margin-top:auto}
.goal-ico{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:26px}
.g-budget{background:#e2f0f1}.g-budget::before{content:"📊"}.g-debt{background:#ffe6dc}.g-debt::before{content:"💳"}
.g-saving{background:#fff2d6}.g-saving::before{content:"🐷"}.g-wedding{background:#f3e8f7}.g-wedding::before{content:"💍"}
/* free band */
.free-band{position:relative;background:var(--teal);color:#fff;padding:90px 0 80px;margin-top:70px}
.wave{position:absolute;top:-79px;left:0;width:100%;height:80px;fill:var(--teal)}
.free-in{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:60px;align-items:center}
.free-art{position:relative}.free-art img{border-radius:var(--r);box-shadow:0 24px 50px rgba(0,0,0,.28);transform:rotate(-3deg);border:8px solid #fff}
.sticker{position:absolute;right:-18px;top:-18px;background:var(--sun);color:var(--ink);font:700 22px Fredoka,sans-serif;width:92px;height:92px;border-radius:50%;display:grid;place-items:center;transform:rotate(12deg);box-shadow:0 10px 20px rgba(0,0,0,.2);animation:wiggle 4s ease-in-out infinite}
@keyframes wiggle{0%,90%,100%{transform:rotate(12deg)}94%{transform:rotate(-4deg)}97%{transform:rotate(18deg)}}
.free-band h2{color:#fff}.free-band p{color:#d9ecee;font-size:18px;max-width:560px}
/* shop */
.shop{padding:100px 0}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:38px}
.chip{font:600 15px Nunito,sans-serif;border:2px solid var(--line);background:#fff;color:var(--ink);padding:10px 20px;border-radius:999px;cursor:pointer;transition:all .15s}
.chip.on,.chip:hover{background:var(--teal);border-color:var(--teal);color:#fff}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:26px;margin-bottom:44px}
.grid>*{min-width:0}
.card{background:#fff;border-radius:var(--r);overflow:hidden;border:1.5px solid var(--line);display:flex;flex-direction:column;transition:transform .25s cubic-bezier(.3,1.4,.6,1),box-shadow .25s}
.card:hover{transform:translateY(-6px);box-shadow:var(--sh)}
.card[hidden]{display:none}
.card-media{position:relative;display:block;aspect-ratio:1/1;background:var(--mist);overflow:hidden}
.card-media img,.card-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .3s,transform .5s}
.card-media video{opacity:0}.card-media.playing video{opacity:1}.card-media:hover img{transform:scale(1.03)}
.play{position:absolute;right:12px;bottom:12px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--teal);display:grid;place-items:center;font-size:14px;box-shadow:0 4px 12px rgba(0,0,0,.15);transition:opacity .2s}
.card-media.playing .play{opacity:0}
@media (hover:none){.play{display:none}}
.card-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.card-body .badge{align-self:flex-start}
.card-body h3{margin-bottom:6px}.card-body h3 a{color:var(--ink);text-decoration:none}.card-body h3 a:hover{color:var(--teal)}
.card-body p{font-size:15px;color:var(--muted);margin:0 0 18px;flex:1}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:10px}
.price{font:700 26px Fredoka,sans-serif;color:var(--ink)}
.direct{display:block;margin-top:12px;font-size:14px;color:var(--muted);text-decoration:none;font-weight:600}.direct:hover{color:var(--teal)}
/* how */
.how{background:var(--mist);padding:96px 0}
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;counter-reset:s}
.steps li{background:#fff;border-radius:var(--r);padding:34px 28px;position:relative;box-shadow:0 2px 0 var(--line)}
.num{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--coral);color:#fff;font:700 24px Fredoka,sans-serif;margin-bottom:18px;transform:rotate(-6deg);box-shadow:0 4px 0 var(--coral-d)}
.steps li:nth-child(2) .num{background:var(--teal);box-shadow:0 4px 0 var(--teal-d);transform:rotate(5deg)}
.steps li:nth-child(3) .num{background:var(--sun);color:var(--ink);box-shadow:0 4px 0 #e9b95c}
.steps p{margin:0;color:var(--muted)}
/* why */
.why{padding:100px 0}.why-in{display:grid;grid-template-columns:260px minmax(0,1fr);gap:64px;align-items:center;max-width:1000px}
.why-art img{border-radius:56px;box-shadow:var(--sh2);transform:rotate(-6deg);animation:bob 4s ease-in-out infinite}
.why p{color:var(--muted)}
.why-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}
.why-grid div{background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:16px 18px;display:flex;flex-direction:column}
.why-grid b{font:600 17px Fredoka,sans-serif}.why-grid span{color:var(--muted);font-size:15px}
/* faq */
.faq{padding:30px 0 96px}
details{background:#fff;border-radius:16px;margin-bottom:12px;padding:0 24px;border:1.5px solid var(--line);transition:box-shadow .2s}
details[open]{box-shadow:var(--sh)}
summary{cursor:pointer;list-style:none;font:600 18px Fredoka,sans-serif;padding:20px 36px 20px 0;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:0;top:14px;width:30px;height:30px;border-radius:50%;background:var(--mist);color:var(--teal);display:grid;place-items:center;font-size:22px;transition:transform .25s}
details[open] summary::after{transform:rotate(45deg);background:var(--coral);color:#fff}
details p{margin:0 0 20px;color:var(--muted)}
.cta-band{background:linear-gradient(135deg,var(--teal),var(--teal-l));color:#fff;padding:84px 0;position:relative;overflow:hidden}
.cta-band::before,.cta-band::after{content:"🐼";position:absolute;font-size:120px;opacity:.08}.cta-band::before{left:4%;top:10%;transform:rotate(-14deg)}.cta-band::after{right:5%;bottom:-10%;transform:rotate(12deg)}
.cta-band h2{color:#fff}.cta-band p{color:#d9ecee;font-size:18px}
/* footer */
.foot{background:var(--ink);color:#c8cbcc;padding:60px 0 28px;font-size:15px}
.foot-in{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:40px}
.foot h3{color:#fff;font-size:17px;margin-bottom:14px}
.foot-col{display:flex;flex-direction:column;gap:8px}.foot a{color:#e9ecec;text-decoration:none}.foot a:hover{color:var(--coral)}
.logo-light b{color:#8fd0d6}
.social{display:flex;gap:16px;font-weight:700}
.fine{margin-top:36px;padding-top:20px;border-top:1px solid #3a3f42;font-size:13px;color:#8d9194}
/* product page */
.pd{padding:26px 0 40px}
.crumbs{font-size:14px;color:var(--muted);margin-bottom:22px}.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--teal)}
.pd-top{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:54px;align-items:start}
.gallery{position:sticky;top:96px}
.stage{position:relative;aspect-ratio:1/1;border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--sh)}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .35s}.slide.on{opacity:1;z-index:1}
.slide img,.slide video{width:100%;height:100%;object-fit:cover}
.thumbs{display:flex;gap:10px;margin-top:14px;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:thin}
.thumb{flex:0 0 76px;height:76px;border-radius:12px;overflow:hidden;border:2.5px solid transparent;padding:0;cursor:pointer;background:#fff;position:relative;opacity:.75;transition:all .15s}
.thumb.on,.thumb:hover{border-color:var(--coral);opacity:1}
.thumb img{width:100%;height:100%;object-fit:cover}
.vthumb span{position:absolute;inset:0;display:grid;place-items:center;color:#fff;background:rgba(31,111,120,.55);font-size:20px}
.pd-buy h1{font-size:clamp(32px,4vw,48px)}
.pd-tag{font-size:19px;color:var(--muted);margin-top:0}
.pd-price{font:700 40px Fredoka,sans-serif;margin:14px 0}.pd-price small{font:600 15px Nunito,sans-serif;color:var(--muted)}
.buy-btns{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:16px}
.sale-note{background:#fff3cf;border-radius:12px;padding:10px 14px;font-weight:700;font-size:15px;display:inline-block}
.pd-buy .ticks{margin:16px 0 20px}
.pd-intro{font-size:17px}.who{background:#fff;border:1.5px dashed var(--teal);border-radius:14px;padding:14px 18px}
.pd-details{max-width:820px;margin:60px auto 0}
.pd-sec{background:#fff;border-radius:var(--r);padding:28px 30px;margin-bottom:18px;border:1.5px solid var(--line)}
.pd-sec h2{font-size:26px}
.ticks-list,.num-list{margin:0;padding-left:0;list-style:none}
.ticks-list li,.num-list li{position:relative;padding:6px 0 6px 34px}
.ticks-list li::before{content:"✓";position:absolute;left:0;top:8px;width:22px;height:22px;border-radius:50%;background:var(--mist);color:var(--teal);display:grid;place-items:center;font-size:12px;font-weight:800}
.num-list{counter-reset:n}.num-list li{counter-increment:n}.num-list li::before{content:counter(n);position:absolute;left:0;top:7px;width:24px;height:24px;border-radius:8px;background:var(--coral);color:#fff;display:grid;place-items:center;font:700 13px Fredoka,sans-serif}
.fine-note{font-size:13px;color:var(--muted);text-align:center}
.pd-faq{margin-top:50px;padding-bottom:30px}.pd-faq h2{text-align:center}
.related{margin-top:40px}.related h2{text-align:center;margin-bottom:30px}
/* free page */
.free-hero{padding-bottom:60px}.small-print{font-size:14px;color:var(--muted)}
.free-stage{min-height:420px}
.tilt{border-radius:var(--r);overflow:hidden;box-shadow:var(--sh2);border:8px solid #fff;transform:rotate(-3deg);background:#fff}
.tilt.t2{position:absolute;width:52%;right:-10px;bottom:-30px;transform:rotate(5deg)}
.legal{padding:60px 20px 90px}.legal h2{font-size:24px;margin-top:1.4em}
.notfound{padding:80px 20px}.notfound img{margin:0 auto 20px;border-radius:36px;animation:bob 3s ease-in-out infinite}
/* motion */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1)}.reveal.in{opacity:1;transform:none}
:focus-visible{outline:3px solid var(--coral);outline-offset:3px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}
/* responsive */
@media (max-width:980px){.goal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.foot-in{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}
@media (max-width:900px){
  .hero{padding:40px 0 56px}.hero-in,.free-in,.why-in,.pd-top{grid-template-columns:minmax(0,1fr);gap:40px}
  .hero-stage{max-width:520px;margin:0 auto;width:100%}
  .free-art{max-width:320px;margin:0 auto}
  .why-in{text-align:center}.why-art img{width:170px;margin:0 auto}.why-grid{text-align:left}
  .steps{grid-template-columns:minmax(0,1fr)}
  .links{display:none}.nav-cta{margin-left:auto}
  .gallery{position:static}
  .free-stage{min-height:0}
}
@media (max-width:560px){
  body{font-size:16px}.lead{font-size:18px}
  .goal-grid,.why-grid{grid-template-columns:minmax(0,1fr)}
  .ctas .btn{width:100%}.nav-cta{padding:9px 14px;font-size:14px}.logo{font-size:20px}.logo img{width:36px;height:36px}
  .nav-cta{font-size:0}.nav-cta::after{content:"Free budget";font-size:14px}
  .float-card{display:none}.panda-buddy img{width:70px;height:70px}.bubble{margin-bottom:44px;font-size:13px}
  .foot-in{grid-template-columns:minmax(0,1fr)}
  .grid{grid-template-columns:minmax(0,1fr)}
  .pd-sec{padding:22px 20px}
  .hl{white-space:normal}
}