@font-face{font-family:'Baloo 2';src:url(fonts/Baloo2_600SemiBold.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Baloo 2';src:url(fonts/Baloo2_700Bold.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url(fonts/Manrope_400Regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url(fonts/Manrope_500Medium.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url(fonts/Manrope_600SemiBold.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url(fonts/Manrope_700Bold.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
:root{--font-display:'Baloo 2',system-ui,sans-serif;--font-body:Manrope,system-ui,sans-serif}
body{margin:0}
a{color:#000}a:hover{color:#176B52}
.f-pg{container-type:inline-size;container-name:fpg}
.f-pg *{box-sizing:border-box}
.f-wrap{width:100%;max-width:1120px;margin:0 auto;padding:0 32px}
.f-h1{font:700 72px/1.05 var(--font-display);letter-spacing:-0.01em;margin:0;color:#000}
.f-h2{font:700 50px/1.08 var(--font-display);letter-spacing:-0.01em;margin:0;color:#000}
.f-h3{font:700 40px/1.1 var(--font-display);letter-spacing:-0.01em;margin:0;color:#000}
.f-sub{font:400 21px/1.35 var(--font-body);letter-spacing:-0.02em;color:#666;margin:0}
.f-p{font:400 16px/1.5 var(--font-body);color:#6B6B6B;margin:0}
.f-eye{display:inline-flex;align-items:center;gap:8px;font:500 14px/1 var(--font-body);color:#000}
.f-eye::before{content:"";width:14px;height:14px;border-radius:50%;background:#FFD21C;box-shadow:inset 0 0 0 4px #FFF1A8}
.f-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 22px;border-radius:999px;background:#FFD21C;color:#000;font:600 15px/1 var(--font-body);text-decoration:none;transition:transform .25s ease, box-shadow .25s ease;box-shadow:inset 0 -2px 0 rgba(0,0,0,.08)}
.f-btn:hover{transform:translateY(-2px);color:#000;box-shadow:0 10px 24px -10px rgba(160,120,0,.6)}
.f-btn-k{background:#000;color:#FFF;padding:0 6px 0 20px;box-shadow:none}
.f-btn-k:hover{color:#FFF;box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
.f-btn-k i{width:36px;height:36px;border-radius:50%;background:#FFD21C;display:grid;place-items:center}
.f-store{display:inline-flex;align-items:center;gap:10px;height:54px;padding:0 18px;border-radius:14px;text-decoration:none;transition:transform .25s ease}
.f-store:hover{transform:translateY(-2px)}
.f-card{background:#FFFFFF;border-radius:24px;box-shadow:0 0 0 1px #EFEFEF}
.f-rise{animation:fRise 1s cubic-bezier(.2,.7,.2,1) both}
.f-rise2{animation:fRise 1s .12s cubic-bezier(.2,.7,.2,1) both}
.f-rise3{animation:fRise 1s .24s cubic-bezier(.2,.7,.2,1) both}
@keyframes fRise{from{opacity:0;transform:translateY(18px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.f-bob{animation:fBob 5s ease-in-out infinite}
.f-lanes{display:flex;flex-direction:column;gap:14px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.f-lane{overflow:hidden}
.f-track{display:flex;gap:12px;width:max-content;white-space:nowrap}
.f-track>span,.f-track .f-dup>span{flex:none}
.f-ltr{animation:fLane 38s linear infinite}
.f-rtl{animation:fLane 38s linear infinite reverse}
.f-lanes:hover .f-track{animation-play-state:paused}
@keyframes fLane{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 6px))}}
@media (prefers-reduced-motion:reduce){.f-track{animation:none}}
@keyframes fBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.f-obj{width:120px;height:120px;object-fit:contain;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.f-obj:hover{transform:translateY(-6px) rotate(-4deg)}
.f-faq{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px;border:0;border-radius:16px;background:#F7F7F7;font:500 16px/1.3 var(--font-body);letter-spacing:-0.01em;color:#000;cursor:pointer;text-align:left}
.f-faq:hover{background:#F0F0F0}
.f-navl{display:flex}
.f-tiles{display:flex;gap:44px;justify-content:center}
.f-feat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:64px;align-items:center}
.f-why{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.f-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto;gap:20px}
.f-tall{grid-column:3;grid-row:1 / span 2}
.f-qs{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 32px 8px}
.f-qs > *{scroll-snap-align:start}
.f-price{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:end}
.f-tips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.f-cta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:40px;align-items:end}
.f-foot{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:40px}
@container fpg (max-width: 760px){
  .f-wrap{padding:0 20px !important}
  .f-navl,.f-hide{display:none !important}
  .f-h1{font-size:46px !important}
  .f-h2{font-size:34px !important}
  .f-h3{font-size:30px !important}
  .f-sub{font-size:18px !important}
  .f-hands{width:110% !important;margin-left:-5% !important}
  .f-tiles{gap:16px !important;flex-wrap:wrap !important}
  .f-obj{width:72px !important;height:72px !important}
  .f-conn{display:none !important}
  .f-why{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .f-feat,.f-cta,.f-price,.f-tips{grid-template-columns:1fr !important;gap:28px !important}
  .f-flip > :first-child{order:2}
  .f-tools{grid-template-columns:1fr !important}
  .f-tall{grid-column:auto !important;grid-row:auto !important}
  .f-foot{grid-template-columns:1fr 1fr !important}
  .f-qs{padding:0 20px 8px !important}
  .f-stag{margin-top:0 !important}
  .f-panel{height:400px !important}
  .f-panel-chk{height:460px !important}
  .f-chk{width:255px !important}
}
/* Benefits bento */
.b-bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.b-card{display:flex;flex-direction:column;gap:22px;padding:24px;border-radius:28px;background:#FFFFFF;box-shadow:0 0 0 1px #EDE7D6}
.b-wide{grid-column:span 2;flex-direction:row;align-items:center;gap:32px;background:#FFF8E1;box-shadow:0 0 0 1px #F6EBC4}
.b-wide>.b-ui{flex:1.1}
.b-wide>.b-copy{flex:1}
.b-ui{border-radius:20px;background:#F5EFDD;padding:20px;min-height:170px;display:flex;flex-direction:column;justify-content:center}
.b-t{font:700 22px/1.2 var(--font-display);color:#000;margin-bottom:8px}
.b-plan{background:#FFFFFF;box-shadow:0 0 0 1px #EDE7D6,0 18px 36px -24px rgba(0,0,0,.25);gap:10px}
.b-plan-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.b-plan-k{font:700 20px/1.2 var(--font-display);color:#000}
.b-streak{padding:6px 10px;border-radius:999px;background:#FFF3C2;font:600 12px/1 var(--font-body);color:#3A3100}
.b-plan-sub{font:500 14px/1.3 var(--font-body);color:#6B6357}
.b-bar{height:10px;border-radius:999px;background:#F5EFDD;overflow:hidden}
.b-bar i{display:block;height:100%;border-radius:inherit;background:#176B52}
.b-plan-next{margin-top:4px;padding:12px 14px;border-radius:14px;background:#FFD21C;font:600 14px/1 var(--font-body);color:#000}
.b-faces{flex-direction:row;justify-content:space-between;align-items:center;gap:6px}
.b-faces figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:8px}
.b-faces img{width:56px;height:56px;object-fit:contain}
.b-faces figcaption{font:600 12px/1 var(--font-body);color:#6B6357;white-space:nowrap}
.b-signs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;place-items:center}
.b-signs img{width:52px;height:52px;object-fit:contain;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.b-signs img:hover{transform:translateY(-4px) rotate(-4deg)}
.b-sec{gap:12px;background:#FFFFFF;box-shadow:0 0 0 1px #EDE7D6,0 18px 36px -24px rgba(0,0,0,.25)}
.b-sec-k{font:700 18px/1 var(--font-display);color:#000}
.b-steps{display:flex;gap:6px}
.b-steps i{flex:1;height:8px;border-radius:999px;background:#E9E6DE}
.b-steps i.on{background:#176B52}
.b-sec-row{display:flex;justify-content:space-between;padding:10px 12px;border-radius:12px;background:#F5EFDD;font:500 13px/1 var(--font-body);color:#6B6357}
.b-sec-row span:first-child{font-weight:600;color:#000}
@container fpg (max-width: 760px){
  .b-bento{grid-template-columns:1fr !important;gap:20px !important}
  .b-wide{grid-column:auto !important;flex-direction:column !important;align-items:stretch !important;gap:22px !important}
}
/* Motion (motion.js, shader.js) */
.js-motion .f-rise,.js-motion .f-rise2,.js-motion .f-rise3{animation:none}
.m-mask{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.m-word{display:inline-block;will-change:transform}
.m-progress{position:fixed;top:0;left:0;right:0;height:3px;background:#FFD21C;transform:scaleX(0);transform-origin:0 50%;z-index:50;pointer-events:none}
nav{transition:box-shadow .35s ease,background-color .35s ease,transform .35s ease}
.m-nav-on nav,nav.m-nav-on{box-shadow:0 0 0 1px rgba(0,0,0,.08),0 14px 34px -14px rgba(0,0,0,.28) !important;background:rgba(255,255,255,.94) !important}
[data-shader]{position:relative;isolation:isolate}
[data-shader]>*:not(canvas){position:relative;z-index:1}
@property --m-a{syntax:'<angle>';inherits:false;initial-value:0deg}
.m-shine{background:conic-gradient(from var(--m-a),#FFD21C,#FFF1A8 18%,#FFD21C 36%,#F5B800 60%,#FFD21C) !important;animation:mShine 4s linear infinite}
@keyframes mShine{to{--m-a:360deg}}
@media (prefers-reduced-motion:reduce){.m-shine{animation:none}}
/* Closing CTA */
.c-card{position:relative;max-width:1280px;margin:0 auto;min-height:640px;border-radius:40px;background:#FFD21C;overflow:hidden;display:grid;place-items:center;padding:96px 24px 220px;text-align:center}
.c-body{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:20px;max-width:620px}
.c-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.6);font:600 13px/1 var(--font-body);color:#3A3100}
.c-pill::before{content:"";width:8px;height:8px;border-radius:50%;background:#176B52;box-shadow:0 0 0 4px rgba(23,107,82,.18)}
.c-sub{margin:0;font:400 18px/1.5 var(--font-body);color:#3A3100;max-width:520px}
.c-btn{height:60px;padding:0 8px 0 28px;font-size:17px;margin-top:8px}
.c-btn i{width:44px;height:44px}
.c-soon{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:4px;font:600 13px/1 var(--font-body);color:#7A6400}
.c-soon span{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(122,100,0,.28)}
.c-soon em{font-style:normal;font-weight:500;opacity:.85;margin-left:4px}
.c-float{position:absolute;z-index:1;width:96px;height:96px;object-fit:contain;filter:drop-shadow(0 14px 18px rgba(120,90,0,.25));pointer-events:none}
.c-f1{left:7%;top:12%;transform:rotate(-12deg)}
.c-f2{left:15%;top:46%;width:116px;height:116px}
.c-f3{right:8%;top:10%;transform:rotate(10deg)}
.c-f4{right:15%;top:44%;width:110px;height:110px}
.c-f5{left:31%;top:6%;width:64px;height:64px}
.c-f6{right:30%;top:7%;width:72px;height:72px}
.c-phone{position:absolute;z-index:1;bottom:-150px;width:250px;filter:drop-shadow(0 24px 30px rgba(90,70,0,.3));pointer-events:none}
.c-pl{left:9%;transform:rotate(-14deg)}
.c-pr{right:9%;transform:rotate(14deg)}
@container fpg (max-width: 760px){
  .c-card{min-height:0;padding:72px 20px 250px;border-radius:32px}
  .c-wide,.c-f2,.c-f4{display:none}
  .c-float{width:58px;height:58px}
  .c-f1{left:4%;top:3%}
  .c-f3{right:4%;top:3%}
  .c-phone{width:140px;bottom:-96px}
  .c-pl{left:2%}
  .c-pr{right:2%}
  .c-btn{font-size:16px}
}
.c-card>.c-float,.c-card>.c-phone{position:absolute}
.c-card>.c-body{position:relative;z-index:2}
/* Preloader (preloader.js): the CSS hides it on its own after 8 s if the script never runs */
html.pl-on{overflow:hidden}
.pl{position:fixed;inset:0;z-index:100;background:#FFFFFF;animation:plOut .5s 8s forwards}
@keyframes plOut{to{opacity:0;visibility:hidden}}
.pl-liquid{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.pl-logo{position:absolute;left:50%;top:50%;z-index:3;width:min(420px,70vw);aspect-ratio:1512/518;transform:translate(-50%,-50%)}
.pl-h{position:absolute;inset:0;width:100%;height:100%}
.pl-h-g{filter:grayscale(1);opacity:.25}
.pl-h-c{clip-path:inset(0 100% 0 0)}
.pl-mark{position:absolute;left:0;top:0;width:22.29%;height:100%;opacity:0;will-change:transform}
.pl-bar{position:absolute;left:0;right:0;bottom:0;z-index:2;height:4px;background:rgba(0,0,0,.08)}
.pl-bar i{display:block;height:100%;background:#000;transform:scaleX(0);transform-origin:0 50%}
.f-h1 .m-mask{perspective:700px}
.m-char{display:inline-block;transform-origin:50% 100%;will-change:transform}
.f-navbar nav{pointer-events:auto}

/* Stacking feature cards (desktop): each row sticks a little lower than the last, motion.js scales the one beneath */
@container fpg (min-width: 761px){
  #f-feat .f-wrap{gap:36px !important}
  #f-feat .f-feat{position:sticky;top:96px;padding:40px 48px;border-radius:40px;background:#FFFFFF;box-shadow:0 0 0 1px #EDE7D6,0 30px 60px -42px rgba(0,0,0,.4);transform-origin:50% 0;will-change:transform}
  #f-feat .f-feat:nth-child(2){top:116px}
  #f-feat .f-feat:nth-child(3){top:136px}
}
