/* PayrollBozz home-lite: below-the-fold styles (loaded deferred) */
/* dark stats */
.dark{position:relative;background:var(--tx);color:#fff;padding:0 50px;margin-top:-50px;min-height:940px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;z-index:1}
.dark-globe{position:absolute;left:50%;top:-680px;width:1300px;max-width:none;transform:translateX(-50%);z-index:0;pointer-events:none}
.dark-in{z-index:1;width:100%;display:flex;flex-direction:column;gap:50px}
.dark-head{display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 10px;text-align:center}
.dark .h-xl{font-weight:700;max-width:756px;color:#fff}
.dark-p{font-size:17px;line-height:1.6;color:var(--lt);max-width:616px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #0C3773;border-radius:25px;background:radial-gradient(at 50% 100%,#0C3773 0%,var(--tx) 50%)}
.stat{padding:50px}
.num{font-family:"DM Sans",sans-serif;font-size:60px;line-height:60px;font-weight:500;letter-spacing:-2px;color:var(--pr)}
.lbl{font-size:17px;line-height:17px;color:var(--lt);margin-top:10px}
/* why */
.why{position:relative;z-index:2;background:#fff;border-radius:30px 30px 0 0;margin-top:-50px;padding:200px 50px 50px}
.why-top{display:flex;justify-content:space-between;align-items:center;gap:60px}
.why-txt{flex:0 1 715px;display:flex;flex-direction:column;padding:10px 10px 0}
.why-txt .h-xl{margin-top:20px}
.why-p{font-size:17px;line-height:1.6;max-width:85%;margin-top:10px}
.qcard{flex:0 0 325px;background:#F9FAFB;border:1px solid #E0E6EB;border-radius:20px;padding:30px;display:flex;flex-direction:column;gap:30px;color:#4D5461;align-self:flex-end;margin-bottom:50px}
.qcard p{font-size:15px;line-height:1.857}
.qcard .qby{font-size:14px;line-height:14px}
.ibox-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:110px}
.ibox{padding:40px;border:1px solid #fff;border-radius:20px}
.ibox img{width:35%;max-width:116px}
.ibox h2{font-size:20px;line-height:26px;font-weight:700;margin-top:40px}
.ibox p{font-size:17px;line-height:1.6;margin-top:15px}
/* feature card */
.feat{margin:170px 0;padding:0 50px;overflow:hidden}
.feat-card{position:relative;background:radial-gradient(at 100% 0%,#fff 0%,var(--lt) 55%);border:1px solid var(--lt);border-radius:20px}
.feat-top{display:flex;gap:20px;padding:110px 90px 0}
.feat-txt{flex:1 1 auto;display:flex;flex-direction:column;gap:20px;max-width:643px}
.feat-txt p:not(.h-xl){font-size:17px;line-height:1.6;margin-top:-10px}
.sec-list{flex:0 0 255px;display:flex;flex-direction:column;align-items:flex-end;padding-top:60px}
.sec-list li{display:flex;align-items:center;font-size:17px;line-height:31.57px;width:142px;margin:0 0 6px}
.sec-list svg{width:20px;height:20px;margin-right:5px;flex:0 0 20px}
.dash{position:relative}
.dash-img{position:relative;z-index:6;width:calc(100% + 12px);max-width:none;margin:0 -6px;height:auto}
.dash-globe{position:absolute;right:-186px;top:-39px;width:410px;opacity:.25;z-index:3;pointer-events:none}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px}
.fcard{background:radial-gradient(at top right,#fff 0%,var(--lt) 70%);transition:background .3s;border:1px solid var(--lt);border-radius:20px;padding:50px;display:flex;flex-direction:column;justify-content:center;gap:15px}
.ft{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.ft h2,.ft h3{font-size:24px;line-height:24px;font-weight:700}
.arr{flex:0 0 23px;margin-top:5px;color:var(--tx)}
.arr svg{width:23px;height:23px;fill:currentColor;transform:rotate(-45deg)}
.arr:hover{color:var(--pr)}
.fcard p{font-size:17px;line-height:1.6}
.fcard:hover{background:var(--lt)}
.icard:hover{background:#fff}
.fnew{flex-direction:row;align-items:center;gap:20px;margin-top:20px}
.fnew-chip{flex:0 0 160px}
.fnew-body{flex:1 1 auto;display:flex;flex-direction:column;gap:12px}
.fnew .ft h2{font-size:26px;line-height:26px}
/* help */
.help{background:radial-gradient(at top left,#fff 0%,var(--bg2) 60%);border:1px solid var(--bg2);border-bottom:0;border-radius:30px 30px 0 0;padding:170px 50px 80px}
.help .wrap{display:flex;flex-direction:column;gap:20px;padding:10px}
.help-row{display:flex;gap:10px}
.help-txt{flex:0 0 65%;display:flex;flex-direction:column;gap:10px}
.help-txt p:not(.h-xl){font-size:17px;line-height:1.6;max-width:674px}
.cc-list{flex:1 1 auto;display:flex;flex-direction:column;align-items:flex-end}
.cc-list li{display:flex;align-items:center;font-size:17px;line-height:31.57px;width:285px;margin-bottom:6px;white-space:nowrap}
.cc-list svg{width:13px;height:13px;fill:var(--grb);margin-right:10px;flex:0 0 13px}
/* beige blocks */
.beige{background:var(--bg2);padding:0 50px}
.igrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.icard{background:radial-gradient(at bottom right,var(--bg2) 0%,#fff 100%);transition:background .3s;border:1px solid #fff;border-radius:20px;padding:50px;display:flex;flex-direction:column;justify-content:center;gap:50px}
.icard img{width:35%;max-width:90px}
.icard p{font-size:17px;line-height:1.6;margin-top:17px}
.stories{padding-top:200px}
.st-row{display:flex;gap:20px}
.st-card{background:radial-gradient(at bottom right,var(--bg2) 0%,#fff 40%);flex:0 0 770px;max-width:70%;border:1px solid #fff;border-radius:20px;padding:50px;display:flex;flex-direction:column;justify-content:space-between;gap:50px}
.st-q{font-size:34px;line-height:1.5;font-weight:700}
.st-by{display:flex;align-items:center;justify-content:space-between;gap:20px}
.st-by h4{font-size:17px;line-height:17px;font-weight:400}
.st-by img{width:100px}
.st-side{flex:1 1 auto;display:flex;flex-direction:column;justify-content:space-between;gap:20px;min-width:0}
.vid{position:relative;display:block;width:100%;aspect-ratio:1/1;border-radius:20px;overflow:hidden}
.vid img{width:100%;height:100%;object-fit:cover}
.vid .play{position:absolute;left:50%;top:50%;width:56px;height:56px;fill:#fff;opacity:.8;transform:translate(-50%,-50%);filter:drop-shadow(1px 0 6px rgba(0,0,0,.3));transition:opacity .3s}
.vid:hover .play{opacity:1}
.gbox{background-color:var(--gr);background-image:radial-gradient(at top right,#2F6B1F 2%,#0D63CC 45%);color:#fff;border-radius:20px;padding:40px;display:flex;flex-direction:column;gap:10px}
.gbox h3{font-size:30px;line-height:1.4;font-weight:700}
.gbox p{font-size:17px;line-height:1.5;font-weight:500}
.promo{padding-top:20px;padding-bottom:20px}
.promo-card{background:radial-gradient(at bottom left,var(--bg2) 0%,#fff 40%);border:1px solid #fff;border-radius:20px;padding:50px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.promo-s{font-size:17px;line-height:1.6}
.promo-h{font-size:30px;line-height:1.6;font-weight:700}
.btn-nb{border:0;margin-right:10px}
.t-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.tcard{background:radial-gradient(at bottom left,var(--bg2) 0%,#fff 50%);border:1px solid #fff;border-radius:20px;padding:50px;display:flex;flex-direction:column;justify-content:space-between;gap:50px}
.tcard p{font-size:20px;line-height:1.857}
.tcard h4{font-size:17px;line-height:17px;font-weight:400}
.disc{padding-top:40px;padding-bottom:80px;border-radius:0 0 30px 30px}
.disc p{max-width:648px;margin:0 auto;padding:10px 0;text-align:center;font-size:14px;line-height:1.6;color:#504E49}
/* faq */
.faq{padding:170px 50px 0}
.faq-row{display:flex;justify-content:space-between;gap:10px}
.faq-l{flex:0 0 385px;display:flex;flex-direction:column;align-items:flex-start}
.faq-l .h-xl{max-width:308px}
.faq-p{font-size:17px;line-height:1.6;color:#4D5461;max-width:308px;margin-top:10px}
.faq-p a{text-decoration:underline}
.btn-pill{display:inline-block;margin-top:60px;background:#fff;border:1px solid var(--pr);border-radius:50px;padding:20px 30px;font-size:17px;line-height:17px;font-weight:700;color:var(--tx)}
.btn-pill:hover{background:var(--pr);color:#fff}
.faq-r{flex:0 1 705px}
.faq details{border:0}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:30px;font-size:24px;line-height:36px;font-weight:700;color:var(--tx)}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{flex:0 0 14px;width:14px;height:16px;fill:var(--tx);margin-top:6px;transition:transform .2s}
.faq details[open] summary svg{transform:rotate(180deg)}
.ans{padding:0 30px 26px}
.ans p{font-size:17px;line-height:1.8}
.ans a{text-decoration:underline}
/* cta */
.cta{position:relative;z-index:1;background:var(--lt);border:1px solid var(--lt);border-radius:30px 30px 0 0;margin-top:220px;padding:0 50px 100px}
.cta-in{display:flex;min-height:509px}
.cta-txt{flex:0 0 660px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:30px}
.cta-txt .h-xl{width:710px;max-width:100%}
.cta-img{flex:1 1 auto;position:relative;align-self:stretch}
.cta-img img{position:absolute;right:-131px;bottom:0;width:711px;max-width:none}
/* footer */
.ftr{background:var(--lt)}
.ftr-top{padding:70px 50px}
.fcols{display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
.fcol h2{font-size:21px;line-height:1.5;font-weight:400;margin-bottom:20px}
.fcol li{line-height:28px}
.fcol li a,.fcol p{font-size:15px;line-height:1.857;color:var(--tx)}
.fcol li a:hover{color:var(--pr)}
.flogo{width:245px}
.fcol4>*{margin-bottom:42px}
.fcol4>a{display:block}
.fcol4>*:last-child{margin-bottom:0}
.soc{display:flex;align-items:center;gap:4px;margin-left:-5px}
.soc a{display:flex;align-items:center;justify-content:center;min-width:32px;min-height:32px}
.fstores{display:flex;gap:3px}
.fstores img{width:90px;height:auto}
.launch{display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap;padding:8px 0}
.ftr-bot{border-top:1px solid #DFF0FB;padding:40px 50px}
.ftr-bot p{font-size:15px;line-height:1.857}
.fabout{margin:28px 0 120px}
.ftr-bot p:last-child{margin-bottom:24px}
/* video modal */
.yt-modal{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;padding:20px}
.yt-modal iframe{width:min(90vw,calc(80vh*16/9));aspect-ratio:16/9;height:auto;border:0;background:#000}
.yt-close{position:absolute;top:12px;right:16px;color:#fff;font-size:36px;line-height:1}
/* tablet */
@media (max-width:1024px){
 .dark{min-height:1060px;padding:50px 80px}
 .stats{grid-template-columns:repeat(2,1fr)}
 .why{border-radius:20px 20px 0 0;padding:120px 50px 0}
 .why-top{flex-direction:column;align-items:flex-start}
 .why-txt{flex:none;width:100%}
 .qcard{display:none}
 .ibox-grid{grid-template-columns:repeat(2,1fr)}
 .feat{margin:150px 0}
 .feat-top{padding:80px 50px 0;flex-direction:column}
 .sec-list{flex:none;flex-direction:row;flex-wrap:wrap;align-items:center;padding-top:0}
 .sec-list li{width:auto;margin-right:24px}
 .dash-img{width:calc(100% + 160px);margin:0 -80px}
 .feat-card{overflow:hidden}
 .fgrid{grid-template-columns:repeat(2,1fr)}
 .help{border-radius:20px 20px 0 0;padding:120px 70px 80px}
 .help-row{flex-direction:column;gap:30px}
 .help-txt{flex:none}
 .cc-list{align-items:flex-start;flex-direction:row;flex-wrap:wrap}
 .cc-list li{width:auto;margin-right:24px}
 .igrid{grid-template-columns:repeat(2,1fr)}
 .stories{padding-top:100px}
 .st-row{flex-direction:column}
 .st-card{flex:none;max-width:none}
 .vid{max-width:420px}
 .faq-row{flex-direction:column;gap:40px}
 .faq-l{flex:none}
 .faq-r{flex:none;width:100%}
 .cta-txt{flex:1 1 auto;min-width:0}
 .cta-txt .h-xl{width:auto}
 .cta-img{display:none}
 .cta-in{min-height:0;padding:80px 0}
 .cta{padding-bottom:0}
 .fcols{grid-template-columns:repeat(2,1fr)}
}
/* mobile */
@media (max-width:767px){
 .h-xl{font-size:30px}
 .dark{display:none}
 .why{margin-top:0;padding:100px 20px 0}
 .why-txt{padding:10px 10px 0}
 .why-p{max-width:none}
 .ibox-grid{grid-template-columns:1fr;gap:10px;margin-top:50px}
 .ibox{padding:20px}
 .ibox img{width:116px}
 .ibox h2{margin-top:40px}
 .feat{margin:150px 0;padding:0 20px}
 .feat-top{padding:60px 30px 0;gap:20px}
 .feat-txt{gap:20px}
 .feat-txt p:not(.h-xl){margin-top:-10px}
 .sec-list{gap:0 0}
 .sec-list li{width:50%;margin:0;padding-left:5px}
 .dash-img{width:530px;margin:0 -80px}
 .dash-globe{width:296px;right:-130px;top:-39px}
 .fgrid{grid-template-columns:1fr;gap:20px}
 .fcard{padding:50px 35px;gap:10px;justify-content:flex-start}
 .fnew{flex-direction:column;align-items:flex-start;gap:20px}
 .fnew-chip{flex:none}
 .help{padding:80px 30px}
 .help .wrap{padding:0}
 .cc-list{flex-direction:column}
 .cc-list li{margin:0 0 0 18px}
 .beige{padding:0 20px}
 .igrid{grid-template-columns:1fr}
 .icard{padding:40px 35px;gap:30px;justify-content:flex-start}
 .icard img{width:90px}
 .icard p{margin-top:15px}
 .stories{padding-top:80px}
 .st-card{padding:50px 30px 40px}
 .st-q{font-size:30px}
 .st-by{flex-direction:column;align-items:flex-start;gap:20px}
 .st-by h4{line-height:1.5;max-width:240px}
 .vid{max-width:none}
 .gbox{justify-content:center}
 .promo{display:none}
 .t-row{grid-template-columns:1fr}
 .tcard{padding:30px}
 .tcard p{font-size:17px}
 .tcard h4{line-height:1.7}
 .disc{padding:30px 30px 80px;border-radius:0 0 20px 20px}
 .disc p{padding:10px}
 .faq{padding:150px 30px 0}
 .faq-l .h-xl,.faq-p{max-width:none}
 .btn-pill{font-size:14px;line-height:14px;margin-top:30px}
 .faq summary{padding:20px 10px;font-size:20px;line-height:30px}
 .ans{padding:0 10px 30px}
 .cta{margin-top:170px;border-radius:20px 20px 0 0;padding:0 30px}
 .cta-in{padding:60px 0 50px}
 .cta-txt .btn{align-self:stretch;font-size:14px;line-height:14px}
 .ftr-top{padding:70px 20px}
 .fcols{grid-template-columns:1fr;gap:38px}
 .fcol h2{font-size:19.15px;margin-bottom:19px}
 .fcol li{line-height:25.4px}
 .fcol li a,.fcol p{font-size:13.68px}
 .flogo{width:300px}
 .ftr-bot{padding:27px 20px}
 .ftr-bot p{font-size:13.68px}
 .fabout{margin:28px 0 60px}
}
