*{box-sizing:border-box}html,body{margin:0;padding:0}
body{font-family:Urbanist,Helvetica,Arial,sans-serif;color:#000;background:#fff;overflow-x:hidden}
.page{overflow-x:clip}
a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer}
.mockbanner{background:#FFD83A;color:#000;font:600 12px/1.4 Arial,sans-serif;text-align:center;padding:4px 8px}
.mocknav{background:#fff8d6;border-bottom:1px solid #f0e2a0;font:11px/1.4 Arial,sans-serif;padding:4px 10px;display:flex;flex-wrap:wrap;gap:4px 12px;justify-content:center}
.mocknav b{color:#7a6a00}.mocknav a{color:#5b4f00}.mocknav a:hover{text-decoration:underline}.mocknav em{color:#7a6a00}
/* page = Bubble Group baTiop: 780px tall, white */
.page{position:relative;width:100%;height:780px;background:#fff}
/* header = fixed 79px, 2px black border, 15px 48px padding */
.hdr{position:sticky;top:0;z-index:50;height:79px;margin-bottom:-79px;width:100%;background:#fff;border:2px solid #000;padding:15px 49px 15px 48px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{font:400 24px/24px Urbanist,sans-serif;white-space:nowrap}
.navg{flex:1;display:flex;align-items:center;justify-content:center;gap:20px;padding-left:20px;min-width:0}
.nl{font:700 14px/19.6px Urbanist,sans-serif}.don{font:600 14px/14px Urbanist,sans-serif}
.ib{width:25px;height:25px;padding:5px;border:0;background:none;display:flex;border-radius:4px;color:#000}.ib svg{fill:#000;display:block;width:15px;height:15px}
.gs{display:flex;align-items:center;justify-content:center;width:134px;height:45px;border:3px solid #000;border-radius:100px;background:#fff;font:700 15px/15px Urbanist,sans-serif;padding:12px 24px;box-shadow:0 7px 30px -10px rgba(0,0,0,.1);white-space:nowrap}
.bt{font:700 16px/22.4px Urbanist,sans-serif;text-decoration:underline;white-space:nowrap}
.prof{width:90px;height:45px;border:2px solid #000;border-radius:100px;padding:3px;display:flex;justify-content:space-between;align-items:center;background:#fff}
.av{width:35px;height:35px;border:3px solid #000;border-radius:100px;overflow:hidden;display:block}.av img{width:100%;height:100%;object-fit:cover;display:block;border-radius:100px}
.prof .dd{width:28px;height:28px;padding:5px;border:0}.prof .dd svg{width:18px;height:18px}
.burger{display:none;width:30px;height:30px;padding:5px;border:0;background:none}.burger svg{fill:#000;width:20px;height:20px;display:block}
/* hero image: Bubble img at top:-10px, 568 high, cover; visible part ends at y=558 */
.hero{position:absolute;left:0;right:0;top:0;height:558px;overflow:hidden;background:#555}
.hbg{position:absolute;left:0;right:0;top:-10px;height:568px;background-size:cover;background-position:center;opacity:0;transition:opacity .8s ease}.hbg.on{opacity:1}
/* hero box 800x265 @ y141 */
.hbox{position:absolute;z-index:5;top:141px;left:50%;transform:translateX(-50%);width:800px;min-height:265px;background:rgba(255,255,255,.6);border:2px solid #000;padding:10px;display:flex;flex-direction:column;justify-content:center;align-items:center}
.hbox h1{overflow-wrap:break-word;margin:0;width:768px;max-width:100%;font:500 50px/50px Urbanist,sans-serif;text-align:center}
.sub{margin:24px 0 0;width:700px;max-width:100%;font:700 14px/19.6px Urbanist,sans-serif;text-align:center;white-space:pre-line}
.sb{margin:25px 0 0;width:100%;max-width:728px;height:54px;background:#fff;border:2px solid #000;border-radius:100px;padding:0 5px 0 2px;display:flex;align-items:center;gap:8px}
.si{width:24px;height:24px;flex:none;display:block}
.sg{flex:1;min-width:0;height:50px;display:flex;justify-content:flex-start}
.sg input{height:50px;border:0;outline:0;background:#fff;font-family:Urbanist,sans-serif;font-size:14px;color:#3d3d3d;min-width:0}
.f1{flex:0 1 288px;width:288px;font-weight:700;padding:6px 12px 6px 0}.f2{flex:0 1 248px;width:248px;font-weight:400;border-left:2px solid #000!important;padding:6px 12px 6px 5px}
.sg input::placeholder{color:#3d3d3d;opacity:1}.f1::placeholder{font-weight:700}
.sbtn{flex:none;width:141px;height:40px;border:0;border-radius:100px;background:#000;color:#fff;font:500 14px/14px Urbanist,sans-serif;padding:12px 24px;box-shadow:0 7px 30px -10px rgba(0,0,0,.1);white-space:nowrap}
.har,.sar{position:absolute;z-index:6;width:40px;height:40px;padding:10px;border:0;border-radius:100px;background:#000;display:flex}.har svg,.sar svg{width:20px;height:20px;display:block}
.har{top:254px}.hl{left:0}.hr{right:0}
/* slider row: container y420, 360 high, padding 30 0; cards 220x300 @ y450 */
.slider{position:absolute;z-index:4;left:0;right:0;top:420px;height:360px;padding:30px 0}
.scr{height:300px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-behavior:smooth}.scr::-webkit-scrollbar{display:none}
.row{display:flex;height:300px;min-width:100%;width:max-content}
.item{flex:1 0 240px;width:240px;min-width:240px;position:relative}
.row{width:100%}.item{flex:1 0 240px}
.card{display:block;width:220px;height:300px;margin:0 10px;border:1px solid #dee2f2;border-radius:10px;background-size:cover;background-position:center;background-repeat:no-repeat;overflow:hidden;transition:transform .25s ease}
.card:hover{transform:translateY(-3px)}
.ov{width:218px;height:180px;background:rgba(0,0,0,.4);display:flex;flex-direction:column;justify-content:space-around;color:#fff}
.ov>*{margin:20px 10px 0}
.ov h6{font:900 24px/33.6px Urbanist,sans-serif;margin-block-end:0}
.ov .t{font:700 16px/22.4px Urbanist,sans-serif}.ov .lm{font:700 14px/19.6px Urbanist,sans-serif}
.sar{top:160px}.sl{left:0}.sr{right:0}

/* ===== Learn Service (Bubble Group: 780..981, pad 20/38) ===== */
.learn{background:#fff;padding:20px 38px;height:201px;overflow:hidden}
.learn h3{margin:0;font:700 36px/50.4px Urbanist,sans-serif;text-align:center}
.lrow{margin-top:30px;height:81px;display:flex;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}.lrow::-webkit-scrollbar{display:none}
.li{flex:1 0 172px;height:81px;padding-top:6px;display:flex;justify-content:center}
.lc{width:160px;height:70px;border-radius:16px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:11px;transition:transform .2s ease}
.lc:hover{transform:translateY(-2px)}
.lic{width:30px;height:30px;display:flex;align-items:center;justify-content:center}.lic svg{display:block;width:28px;height:28px;fill:#000}
.ll{font:700 14px/19.6px Urbanist,sans-serif;color:#000;margin-top:0;white-space:nowrap}
/* ===== Top Performing Tasker's (Bubble: pad 20/15, head pad 30 20 10 10, box 2px black) ===== */
.top{background:#fff;padding:20px 15px;margin-top:10px}
.thead{padding:30px 20px 10px 10px;display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap}
.ba{font:400 14px/14px Lato,sans-serif;color:#004ca7;text-decoration:underline;padding:5px 0;margin-bottom:4px}
.thead h3{margin:0;font:700 36px/50.4px Urbanist,sans-serif;color:#000}
.tbox{border:2px solid #000;padding:10px;height:374px}
.tscr{display:flex;gap:20px;overflow-x:auto;height:350px;scrollbar-width:none}.tscr::-webkit-scrollbar{display:none}
.tc{flex:none;width:280px;height:350px;background:#fff;border:1px solid #000;border-radius:10px;padding:20px 10px;color:#000;display:block;transition:transform .25s ease,box-shadow .25s ease}
.tc:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.12)}
.ta{display:flex;align-items:flex-start;height:87px}
.tav{flex:none;width:40px;height:40px;border:1px solid #dee2f2;border-radius:100px;overflow:hidden;display:block;margin:0 1px 0 0}.tav img{width:38px;height:38px;border-radius:100px;object-fit:cover;display:block}
.tinfo{flex:1;min-width:0;padding-left:5px;margin-left:9px}
.t1{font:700 16px/22.4px Urbanist,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tp{margin:0;font:700 14px/19.6px Urbanist,sans-serif;color:#000}.tp font{color:#c0c0c0;font-size:14px}
.pills{height:120px;padding:5px 12px 0;margin-top:8px}
.pill{height:40px;background:#dee2f2;border-radius:20px;padding:5px;margin-bottom:10px;display:flex;align-items:center;justify-content:center}
.pill span{font:700 14px/19.6px Urbanist,sans-serif;text-align:center}
.bio{margin-top:8px;height:59px;overflow:hidden;font:700 14px/19.6px Urbanist,sans-serif;color:#424754;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.rat{margin-top:7px;height:20px;display:flex;justify-content:space-between}
.rat h6{margin:0;font:700 14px/19.6px Urbanist,sans-serif;color:#000}.rat .oc{color:#727785}
@media (max-width:800px){
 .learn{padding:20px 24px;height:182px}.learn h3{font-size:22px;line-height:30.8px}.lrow{margin-top:30px}
 .thead h3{font-size:22px;line-height:30.8px}.tbox{height:436px}.tscr{height:412px}
}

/* ===== 4 Steps ===== */
.steps{background:#fff;margin-top:11px;padding:20px 38px}
.steps h3{margin:0;font:700 36px/50.4px Urbanist,sans-serif;text-align:center;color:#000}
.srow{display:flex;justify-content:center;margin-top:11px}
.sin{width:100%;margin:0 15px;display:flex;justify-content:space-between}
.st{width:220px;height:197px;border-top:5px solid transparent;display:flex;flex-direction:column;align-items:center;padding-top:17px;transition:transform .25s ease}.st:hover{transform:translateY(-3px)}
.sti{width:100px;height:100px}.sti img{width:100px;height:100px;display:block;object-fit:contain}
.stl{width:100%;margin-top:34px;font:600 16px/19.2px "Open Sans",sans-serif;color:#1c144e;text-align:center;min-height:24px}
.stg{width:100%;height:2px;margin-top:15px;background:transparent}
.sbar{height:4px;background:#000;border:2px solid #000;border-radius:5px;margin:12px 20px 0}
/* ===== Welcome ===== */
.welcome{padding:40px 40px 12px}
.welcome h1{margin:0;font:700 36px/43.2px Urbanist,sans-serif;text-align:center;color:#000;overflow-wrap:break-word}
.wtx{margin-top:13px;font:700 16px/22.4px Urbanist,sans-serif;color:#000;white-space:pre-line}
/* ===== Why Choose Us ===== */
.why{margin:50px 15px;padding:0 max(0px,calc((100vw - 1280px)*.114));display:flex;justify-content:space-between;align-items:flex-start}
.wimg{position:relative;width:calc(50vw - 15px);aspect-ratio:1600/1075;min-height:528px;overflow:hidden;flex:none}
.wimg .wmain{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.wtop{position:absolute;left:0;top:44%;width:280px;height:auto}.wbot{position:absolute;left:calc(50% - 140px);bottom:0;width:280px;height:auto}
.wcol{flex:none;width:clamp(560px,calc(605px + (100vw - 1280px)*.0453),700px)}
.wh{font:600 40px/48px Urbanist,sans-serif;color:#1c144e;text-align:center;margin-bottom:8px}
.wlist{display:flex;flex-direction:column;gap:14px}
.wi{display:flex;align-items:flex-start}
.wic{flex:none;width:80px;height:80px;border:1px solid rgba(0,0,0,.1);border-radius:50px;display:flex;align-items:center;justify-content:center;margin-right:18px}.wic svg{display:block}
.wt{flex:1;min-width:0}.wt h6{margin:0 0 8px;font:600 24px/33.6px Urbanist,sans-serif;color:#000}
.wp{font:400 15px/21px Urbanist,sans-serif;color:#000}
@media (max-width:800px){
 .steps{padding:20px 15px;margin-top:6px}.steps h3{font-size:22px;line-height:30.8px}
 .sin{display:grid;grid-template-columns:110px 110px;justify-content:space-between;margin:0 15px;max-width:none;row-gap:0}
 .st{width:110px}.stl{min-height:38px}
 .welcome{padding:40px 15px 12px}
 .why{display:block;padding:0}.wimg{display:none}.wcol{width:100%!important}.wh{font-size:36px;line-height:43.2px}
}

/* ===== What Makes Us Unique ===== */
.uniq{background:url(img/bubble/unique-bg.jpg) center/cover no-repeat;padding:40px 15px}
.ubox{max-width:1200px;margin:0 auto;background:#fff;border-radius:20px;box-shadow:0 2px 4px 0 #aaa;padding:20px}
.ubox h3{margin:0 0 19px;font:600 36px/50.4px Urbanist,sans-serif;color:#000;text-align:center}
.urow{display:flex;gap:14.5px;padding:0 0}
.uc{flex:1;min-width:0;padding:10px 15px;display:flex;flex-direction:column;justify-content:space-around;text-align:center}
.ui{width:100px;height:100px;margin:0 auto 19px;color:#000}.ui svg{width:100%;height:100%;fill:currentColor;display:block}
.uc h6{margin:0 0 18px;font:600 24px/33.6px Urbanist,sans-serif;color:#000}
.up{font:400 15px/21px Urbanist,sans-serif;color:#000}
@media (max-width:800px){.urow{flex-direction:column}}

/* ===== CTA ===== */
.cta{background:#fff;padding:24px 15px}
.cin{position:relative;display:flex;flex-direction:column;justify-content:center;min-height:421px}
.cbox{box-sizing:border-box;min-height:313px;position:relative;z-index:1;background:rgba(255,255,255,.6);border:2px solid #000;border-bottom:0;padding:10px;display:flex;flex-direction:column;gap:24px}
.cti{padding:10px}
.cti h3{margin:0;font:700 36px/50.4px Urbanist,sans-serif;color:#000;text-align:center}
.cti h5{margin:0;white-space:pre-wrap;max-width:1000px;font:700 18px/25.2px Urbanist,sans-serif;color:#000}
.cbtn{align-self:center;display:block;background:#fff;color:#000;border:3px solid #000;border-radius:100px;padding:12px 24px;font:700 15px/15px Urbanist,sans-serif;box-shadow:0 7px 30px -10px rgba(0,0,0,.1);text-decoration:none;box-sizing:content-box;transition:transform .2s}.cbtn:hover{transform:translateY(-2px)}
.cimg{position:absolute;right:0;top:0;width:320px;height:421px;object-fit:fill;z-index:0}
@media (max-width:768px){.cbox{min-height:0}.cimg{display:none}.cin{min-height:0}.cbox{border-bottom:2px solid #000}.cti h3{font-size:22px;line-height:30.8px}}
/* ===== Footer ===== */
.foot{background:#DEE2F2}
.fr{max-width:1137px;margin:0 auto;padding:64px 40px 108px;box-sizing:content-box;display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px}
.fl{display:flex;flex-direction:column;gap:8px}
.fl h4{margin:0;font:700 24px/33.6px Urbanist,sans-serif;color:#000}
.fc{font:400 12px/16.8px Urbanist,sans-serif;color:#000}
.fg{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:24px 12px}
.fcol{display:flex;flex-direction:column;gap:12px;padding:0 12px;width:112px;box-sizing:border-box}
.fcol a{font:400 14px/20px Urbanist,sans-serif;color:#000;text-decoration:none}.fcol a.fh{font-weight:600}.fcol a:hover{text-decoration:underline}
@media (max-width:640px){.fr{padding:48px 16px 96px}.fg{max-width:400px}}
@media (max-width:480px){.fg{width:100%;max-width:none;justify-content:center}.fcol{flex:1 1 149px;width:auto;max-width:173px}}
/* subtle reveal */
.rv{animation:rv .7s ease both}.item{animation:rv .7s ease both}
.item:nth-child(2){animation-delay:.05s}.item:nth-child(3){animation-delay:.1s}.item:nth-child(4){animation-delay:.15s}.item:nth-child(5){animation-delay:.2s}.item:nth-child(6){animation-delay:.25s}.item:nth-child(7){animation-delay:.3s}
@keyframes rv{from{opacity:0;transform:translate(var(--tx,0),14px)}to{opacity:1;transform:translate(var(--tx,0),0)}}
.hbox{--tx:-50%}
@media (prefers-reduced-motion:reduce){.rv,.item{animation:none}}
/* mobile (Bubble: 390 -> header 64, box full width @118, 36px headline) */
@media (max-width:800px){
 .hdr{height:64px;margin-bottom:-64px;padding:15px 30px}
 .navg,.gs,.bt,.prof{display:none}.burger{display:block}
 .hbox{top:118px;left:0;transform:none;width:100%;--tx:0px;min-height:312px}
 .hbox h1{font-size:36px;line-height:36px;width:100%}
 .sub{width:100%}
 .si{width:20px;height:20px}
 .sg input{font-size:12px}.f1{font-size:14px}
 .sbtn{width:97px;padding:12px;font-size:11px;line-height:11px}
}
