html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* v2: StoreHub-style hero, stats, who-for, live demo, product pages. Loaded after styles.css. */
.btn.round{border-radius:99px}
.btn.wa{border:2px solid #1fa855;color:#1fa855;background:#fff}
.cta{background:var(--or)}
.hero2{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center;padding:34px 6vw 40px;max-width:1300px;margin:0 auto}
.scene{position:relative;height:500px}
.laptop{position:absolute;left:0;top:30px;width:88%;border-radius:14px;background:#1f2937;padding:10px 10px 0;box-shadow:0 30px 60px rgba(17,24,39,.18)}
.laptop img{display:block;width:100%;height:auto;border-radius:6px 6px 0 0}
.laptop::after{content:"";display:block;height:16px;margin:0 -30px;background:#d1d5db;border-radius:0 0 14px 14px}
.phone2{position:absolute;right:0;top:110px;width:220px;border-radius:30px;background:#111;padding:8px;box-shadow:0 24px 50px rgba(17,24,39,.28)}
.scr2,.dscr{border-radius:23px;overflow:hidden;background:#efe7dd;height:400px;display:flex;flex-direction:column}
.wh{background:#075e54;color:#fff;padding:10px 12px;font-size:13px;font-weight:700}
.wh small{display:block;font-weight:500;opacity:.8;font-size:11px}
.chat2,.dchat{flex:1;padding:10px;display:flex;flex-direction:column;gap:7px;font-size:12px;line-height:1.38;overflow:hidden}
.m{max-width:86%;background:#fff;border-radius:9px;padding:7px 9px;opacity:0;transform:translateY(8px);transition:.4s}
.m.me{align-self:flex-end;background:#d9fdd3}
.m.on{opacity:1;transform:none}
.slip2{background:#fff;border-radius:7px;padding:6px 8px;font-weight:700}
.slip2 small{display:block;color:#0f7a5c}
.badge{position:absolute;left:6%;bottom:20px;background:#fff;border-radius:14px;padding:12px 16px;box-shadow:0 14px 30px rgba(17,24,39,.15);display:flex;gap:12px;align-items:center;opacity:0;transform:scale(.9);transition:.5s}
.badge.on{opacity:1;transform:none}
.badge i{width:38px;height:38px;border-radius:50%;background:#0f7a5c;color:#fff;display:grid;place-items:center;font-style:normal;font-weight:800}
.badge b{display:block}
.badge span{font-size:13px;color:var(--mute)}
.trust{color:var(--mute);font-size:15px;margin-bottom:14px}
.trust b{color:var(--or-d)}
.hcopy h1{text-align:left;margin:0 0 18px;font-size:clamp(38px,5vw,62px)}
.hcopy .sub{margin:0 0 28px;max-width:520px}
.hcopy .btns{justify-content:flex-start}
.hnote{margin-top:16px;font-size:15px;color:var(--mute)}
.hnote a{color:var(--or-d);font-weight:700}
.feat4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:10px 6vw 56px;max-width:1300px;margin:0 auto}
.feat4 > div{display:flex;gap:14px}
.feat4 .ic{font-size:24px;width:46px;height:46px;flex:none;border-radius:13px;background:var(--orl);display:grid;place-items:center}
.feat4 b{display:block;font-size:17px}
.feat4 span{color:var(--mute);font-size:15px}
.stats{background:var(--or);color:#fff;padding:54px 0 30px}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.stat b{display:block;font-size:52px;line-height:1;font-weight:800;letter-spacing:-.03em;margin-bottom:10px}
.stat span{font-size:15px;opacity:.95}
.foot-note{max-width:1120px;margin:22px auto 0;padding:0 6vw;font-size:13px;opacity:.85}
.who4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.wbox{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;background:#fff;transition:transform .2s,box-shadow .2s}
.wbox:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(17,24,39,.08)}
.art{height:150px;display:grid;place-items:center}
.art svg{width:150px;height:auto}
.art-salon{background:#fff1ea}
.art-class{background:#eef4ff}
.art-gym{background:#eefaf2}
.art-cafe{background:#fdf6e3}
.wbox h3{font-size:18px;margin:16px 18px 6px}
.wbox p{margin:0 18px;color:var(--mute);font-size:15px;flex:1}
.fit{display:block;margin:14px 18px 18px;font-size:14px;color:var(--or-d);font-weight:600}
.more-link{display:inline-block;margin-top:14px;color:var(--or-d);font-weight:700;text-decoration:none}
.more-link:hover{text-decoration:underline}
.new-in{background:var(--orl);color:var(--or-d);font-size:12px;font-weight:800;border-radius:99px;padding:2px 9px;vertical-align:3px}
.demo{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;max-width:900px}
.dphone{width:270px;border-radius:32px;background:#111;padding:9px;box-shadow:0 24px 50px rgba(17,24,39,.22)}
.dscr{height:470px}
.dchat{font-size:13px}
.dfoot{padding:10px;background:#f0f2f5}
.dbtn{width:100%;border:0;background:#1fa855;color:#fff;font:inherit;font-weight:700;font-size:14px;border-radius:22px;padding:11px;cursor:pointer}
.dbtn[disabled]{opacity:.55;cursor:default}
.ddash{border:1px solid var(--line);border-radius:var(--r);padding:22px;background:#fff;box-shadow:0 10px 30px rgba(17,24,39,.06)}
.dtitle{font-weight:800;margin-bottom:12px}
.dk{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.dk div{background:var(--soft);border-radius:12px;padding:12px}
.dk small{display:block;color:var(--mute);font-size:13px}
.dk b{font-size:24px;transition:color .3s}
.dk b.bump{color:var(--ok)}
.drow{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--line);font-size:15px;transition:background .6s}
.drow.flash{background:#fff3c4}
.pill-ok,.pill-due,.pill-late{font-size:13px;font-weight:700;border-radius:99px;padding:2px 10px;white-space:nowrap}
.pill-ok{background:#e3f3ec;color:#0b5e47}
.pill-due{background:#e6edfd;color:#1d4ed8}
.pill-late{background:#fde8e6;color:#b42318}
.dfeed{margin-top:12px;background:var(--soft);border-radius:10px;padding:10px 12px;font-size:14px;color:var(--mute)}
.linkbtn{border:0;background:none;color:var(--or-d);font:inherit;font-weight:700;cursor:pointer;padding:6px 0;margin-right:14px}

/* product pages */
.phero{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;padding:56px 6vw 50px;max-width:1300px;margin:0 auto}
.phero h1{text-align:left;margin:0 0 16px;font-size:clamp(36px,4.6vw,58px)}
.phero .sub{margin:0 0 26px;max-width:540px}
.phero .btns{justify-content:flex-start}
.crumb{font-size:14px;color:var(--mute);margin-bottom:12px}
.crumb a{color:var(--or-d);font-weight:700;text-decoration:none}
.pvis img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 30px 60px rgba(17,24,39,.15)}
.pvis.narrow img{max-width:300px;margin:0 auto}
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:f}
.flow div{border:1px solid var(--line);border-radius:var(--r);padding:22px;background:#fff;counter-increment:f}
.flow div::before{content:counter(f);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;font-weight:800;margin-bottom:12px}
.flow b{display:block;font-size:17px;margin-bottom:4px}
.flow span{color:var(--mute);font-size:15px}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.fbox{border:1px solid var(--line);border-radius:var(--r);padding:20px;background:#fff}
.fbox .fi{font-size:22px;width:44px;height:44px;border-radius:12px;background:var(--orl);display:grid;place-items:center;margin-bottom:12px}
.fbox b{display:block;font-size:16px;margin-bottom:4px}
.fbox span{color:var(--mute);font-size:14.5px}
.ctable{width:100%;border-collapse:collapse;font-size:15px;background:#fff}
.ctable th,.ctable td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left}
.ctable th{background:var(--soft);font-size:14px}
.ctable td.c,.ctable th.c{text-align:center}
.ctable .y{color:var(--or-d);font-weight:800}
.ctable .n{color:#c9cdd3}
.tscroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r)}

@media (max-width: 960px){
  .hero2,.phero{grid-template-columns:1fr}
  .scene{order:2;height:440px}
  .feat4,.stats .wrap,.who4,.flow,.fgrid{grid-template-columns:1fr 1fr}
  .demo{grid-template-columns:1fr;justify-items:center}
  .ddash{width:100%}
}
@media (max-width: 760px){
  .hero2{padding:18px 16px 30px;gap:26px}
  .phero{padding:30px 16px 30px}
  .scene{height:360px}
  .phone2{width:165px;top:80px}
  .scr2{height:300px}
  .chat2{font-size:9.5px;padding:7px;gap:5px}
  .phone2 .wh{font-size:10px;padding:8px 9px}
  .phone2 .wh small{font-size:8.5px}
  .badge{left:0;bottom:14px;padding:8px 10px;gap:8px}
  .badge i{width:28px;height:28px}
  .badge b{font-size:13px}
  .badge span{font-size:11px}
  .feat4{grid-template-columns:1fr;padding:6px 16px 40px;gap:16px}
  .stats{padding:40px 0 24px}
  .stat b{font-size:40px}
  .foot-note{padding:0 16px}
  .who4,.flow,.fgrid{grid-template-columns:1fr}
  .dphone{width:250px}
  .dscr{height:430px}
}