:root {
--green:#087b32;
--green2:#0b923f;
--soft:#eaf8ef;
--soft2:#f4fbf6;
--navy:#071126;
--muted:#667085;
--line:#e6edf0;
--blue:#0b559f;
--shadow:0 14px 38px rgba(7, 17, 38, .08);
--r:18px
}
* {
	box-sizing:border-box
}
body {
	margin:0;
	font-family:Inter, Arial, sans-serif;
	color:var(--navy);
	background:#fff
}
a {
	text-decoration:none;
	color:inherit
}
button, input {
	font:inherit
}
.shell {
	max-width:1540px;
	margin:auto;
	padding:0 54px
}
.topbar {
	height:78px;
	border-bottom:1px solid var(--line);
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:0 74px;
	background:#fff;
	position:sticky;
	top:0;
	z-index:10
}
.logo {
	display:flex;
	flex-direction:column;
	line-height:1
}
.logo b {
	font-size:31px;
	color:#0a5695;
	letter-spacing:-2px
}
.logo b span {
	color:#0c8d3d
}
.logo small {
	font-size:10px;
	font-weight:800;
	color:#132447;
	margin-left:37px;
	margin-top:1px
}
.tag {
	display:inline-block;
	/*transform:rotate(24deg);*/
	background:#23b65a;
	color:#fff;
	font-size:14px;
	border-radius:4px;
	padding:3px 7px;
	margin-left:3px
}
.topbar nav {
	display:flex;
	gap:45px;
	font-weight:800
}
.btn {
	border:0;
	border-radius:12px;
	padding:15px 28px;
	font-weight:900;
	display:inline-flex;
	gap:10px;
	align-items:center;
	justify-content:center;
	cursor:pointer
}
.btn.green {
	background:linear-gradient(180deg, #07963e, #057730);
	color:#fff;
	box-shadow:0 12px 28px rgba(8, 123, 50, .2)
}
.btn.outline {
	border:1.5px solid var(--green);
	color:var(--green);
	background:#fff
}
.hero {
	min-height:470px;
	display:grid;
	grid-template-columns:38% 62%;
	gap:12px;
	align-items:center;
	padding-top:8px;
	background:radial-gradient(circle at 89% 30%, #dff7e8 0 17%, transparent 18%), radial-gradient(circle at 0 10%, #f0fbf4 0 12%, transparent 13%)
}
.pill {
	display:inline-block;
	background:#ddf5e6;
	color:var(--green);
	padding:12px 24px;
	border-radius:28px;
	font-weight:900;
	font-size:14px;
	letter-spacing:.5px
}
.hero h1 {
	font-size:61px;
	line-height:1.04;
	margin:22px 0 22px;
	letter-spacing:-2.8px
}
.hero h1 span {
	display:block;
	color:var(--green)
}
.hero p {
	font-size:17px;
	line-height:1.55;
	color:#344054;
	max-width:540px
}
.actions {
	display:flex;
	gap:16px;
	margin-top:30px
}
.mini {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:12px;
	margin-top:30px;
	max-width:520px
}
.mini div {
	background:#fff;
	border:1px solid var(--line);
	border-radius:12px;
	padding:13px;
	box-shadow:0 8px 20px rgba(7, 17, 38, .05);
	display:flex;
	gap:9px;
	align-items:center;
	font-weight:800;
	font-size:13px
}
.device {
	position:relative;
	height:520px
}
.blob {
	position:absolute;
	inset:25px 95px 65px 50px;
	background:#d6f5e1;
	border-radius:55% 45% 45% 55%;
	z-index:0
}
.monitor {
	position:absolute;
	left:60px;
	top:15px;
	width:640px;
	height:380px;
	background:#fff;
	border:17px solid #111927;
	border-radius:16px;
	box-shadow:var(--shadow);
	overflow:hidden
}
.monitor:after {
	content:"";
	position:absolute;
	left:250px;
	bottom:-55px;
	width:130px;
	height:55px;
	background:linear-gradient(#dfe3e7, #aeb6bd);
	clip-path:polygon(25% 0, 75% 0, 100% 100%, 0 100%)
}
.screen-head {
	height:54px;
	display:flex;
	align-items:center;
	gap:20px;
	border-bottom:1px solid var(--line);
	padding:0 24px
}
.s-logo {
	font-weight:900;
	color:#0a5695
}
.search-mini {
	margin-left:auto;
	border:1px solid var(--line);
	border-radius:18px;
	width:260px;
	height:27px;
	color:#98a2b3;
	font-size:11px;
	padding:7px
}
.biz-head {
	padding:20px 28px;
	display:flex;
	align-items:center;
	gap:18px
}
.biz-icon {
	width:58px;
	height:58px;
	border-radius:12px;
	background:#f11b82;
	color:#fff;
	display:grid;
	place-items:center;
	font-size:30px;
	font-weight:900
}
.biz-head h3 {
	margin:0;
	font-size:24px
}
.chip {
	background:#fff;
	border:1px solid var(--line);
	border-radius:8px;
	padding:8px 13px;
	font-weight:800;
	font-size:12px
}
.chip.green {
	background:var(--green);
	color:#fff
}
.mock-body {
	display:grid;
	grid-template-columns:135px 1fr;
	gap:16px;
	padding:0 24px
}
.side-list {
	font-size:12px
}
.side-list div {
	padding:8px 10px;
	border-radius:7px
}
.side-list div:first-child {
	background:#eaf8ef;
	color:var(--green);
	font-weight:900
}
.product-grid {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:12px
}
.p-card {
	border:1px solid var(--line);
	border-radius:10px;
	padding:10px;
	background:#fff
}
.p-img {
	height:90px;
	border-radius:9px;
	background:linear-gradient(145deg, #eaf2ff, #fff);
	display:grid;
	place-items:center;
	font-size:42px
}
.p-card b {
	font-size:12px;
	display:block;
	margin-top:8px
}
.p-card strong {
	font-size:12px
}
.tablet, .phone {
	position:absolute;
	background:#fff;
	border:12px solid #141c2e;
	border-radius:24px;
	box-shadow:var(--shadow);
	overflow:hidden
}
.tablet {
	right:10px;
	bottom:48px;
	width:300px;
	height:250px;
	transform:rotate(3deg)
}
.phone {
	right:0;
	bottom:34px;
	width:130px;
	height:250px;
	border-radius:28px
}
.tiny-ui {
	padding:12px
}
.tiny-grid {
	display:grid;
	grid-template-columns:repeat(5, 1fr);
	gap:7px
}
.tiny-grid span {
	background:#f5f8fa;
	border-radius:8px;
	height:44px;
	display:grid;
	place-items:center
}
.search-band {
	display:grid;
grid-template-columns:1.1fr .9fr;
	gap:30px;
	align-items:center;
	margin-top:12px
}
.searchbox {
	height:56px;
	border:1px solid var(--line);
	border-radius:34px;
	display:flex;
	box-shadow:0 7px 24px rgba(7, 17, 38, .04);
	overflow:hidden
}
.searchbox input {
	flex:1;
	border:0;
	padding:0 26px;
	outline:0
}
.searchbox button {
	width:64px;
	background:var(--green);
	color:#fff;
	border:0;
	font-size:22px
}
.popular {
	display:flex;
	gap:10px;
	align-items:center;
	font-size:13px
}
.popular b {
	margin-right:6px
}
.popular span {
	border:1px solid var(--line);
	padding:7px 14px;
	border-radius:18px;
	background:#fff
}
.stats {
	margin-top:28px;
	background:#fff;
	border:1px solid var(--line);
	border-radius:16px;
	box-shadow:var(--shadow);
	display:grid;
	grid-template-columns:repeat(5, 1fr)
}
.stat {
	padding:19px 36px;
	display:flex;
	gap:18px;
	align-items:center;
	border-right:1px solid var(--line)
}
.stat:last-child {
	border-right:0
}
.ico {
	width:52px;
	height:52px;
	border-radius:13px;
	background:#eaf8ef;
	display:grid;
	place-items:center;
	font-size:27px;
	color:var(--green)
}
.stat h2 {
	margin:0;
	font-size:30px
}
.stat p {
	margin:3px 0 0;
	font-weight:700;
	font-size:13px
}
.panels {
	display:grid;
grid-template-columns:.95fr 1.05fr;
	gap:18px;
	margin-top:18px
}
.panel {
	border:1px solid var(--line);
	border-radius:17px;
	background:#fff;
	padding:22px;
	box-shadow:0 10px 22px rgba(7, 17, 38, .04)
}
.panel-head {
	display:flex;
	justify-content:space-between;
	align-items:center
}
.panel h2 {
	font-size:22px;
	margin:0
}
.underline:after {
	content:"";
	display:block;
	width:24px;
	height:4px;
	background:var(--green);
	border-radius:5px;
	margin-top:8px
}
.panel a {
	color:var(--green);
	font-weight:900;
	font-size:13px
}
.cats {
	display:grid;
	grid-template-columns:repeat(6, 1fr);
	gap:12px;
	margin-top:24px
}
.cat {
	height:112px;
	border:1px solid #edf1f4;
	border-radius:13px;
	display:grid;
	place-items:center;
	text-align:center;
	font-weight:900;
	font-size:13px;
	background:#fff
}
.cat i {
	font-style:normal;
	font-size:33px
}
.steps {
	display:grid;
	grid-template-columns:repeat(6, 1fr);
	gap:8px;
	margin-top:24px
}
.step {
	text-align:center;
	position:relative
}
.step:not(:last-child):after {
content:"→";
position:absolute;
right:-10px;
top:24px;
color:#98a2b3
}
.step .circle {
	margin:auto;
	width:54px;
	height:54px;
	background:#eaf8ef;
	border-radius:50%;
	display:grid;
	place-items:center;
	color:var(--green);
	font-size:24px
}
.num {
	display:inline-grid;
	place-items:center;
	margin-top:-9px;
	width:18px;
	height:18px;
	background:var(--green);
	color:#fff;
	border-radius:50%;
	font-size:11px;
	font-weight:900
}
.step b {
	display:block;
	margin-top:6px;
	font-size:12px
}
.businesses {
	margin-top:18px
}
.biz-row {
	display:grid;
	grid-template-columns:repeat(6, 1fr);
	gap:16px;
	margin-top:18px
}
.biz {
	border:1px solid var(--line);
	border-radius:14px;
	padding:17px;
	display:flex;
	align-items:center;
	gap:13px;
	background:#fff
}
.biz .badge {
	width:54px;
	height:42px;
	border-radius:9px;
	display:grid;
	place-items:center;
	color:#fff;
	font-weight:900
}
.biz b {
	font-size:12px
}
.biz small {
	display:block;
	color:#667085;
	margin-top:4px
}
.benefits {
	margin-top:18px;
	margin-bottom:20px;
	background:#effaf3;
	border:1px solid #d9f2e2;
	border-radius:16px;
	display:grid;
	grid-template-columns:repeat(5, 1fr)
}
.benefits div {
	padding:19px 26px;
	display:flex;
	gap:14px;
	border-right:1px solid #d9f2e2
}
.benefits div:last-child {
	border:0
}
.benefits b {
	display:block
}
.benefits p {
	margin:3px 0 0;
	color:#526070;
	font-size:12px
}
.client-body {
	background:#fbfdfc
}
.client-top {
	height:74px
}
.global-search {
	width:470px;
	height:42px;
	border:1px solid var(--line);
	border-radius:12px;
	padding:0 18px
}
.client-layout {
	display:grid;
	grid-template-columns:265px 1fr;
	gap:28px;
	padding-top:18px
}
.sidebar {
	background:#fff;
	border:1px solid var(--line);
	border-radius:14px;
	box-shadow:0 10px 30px rgba(7, 17, 38, .04);
	padding:18px;
	align-self:start;
	position:sticky;
	top:92px
}
.side-logo {
	text-align:center;
	padding:12px 0 20px
}
.side-logo .hadex {
	font-size:32px;
	font-weight:900;
	color:#1557a5
}
.side-logo h3 {
	text-align:left;
	margin:16px 0 6px;
	font-size:18px
}
.side-btns {
	display:grid;
	gap:10px
}
.side-btns .btn {
	padding:12px
}
.side-title {
	margin:28px 0 12px;
	color:var(--green);
	font-size:15px
}
.info-row {
	display:flex;
	justify-content:space-between;
	color:#667085;
	font-size:13px;
	padding:7px 0
}
.cat-list div {
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding:11px;
	border-radius:9px;
	font-weight:700;
	color:#344054
}
.cat-list div.active {
	background:#eaf8ef;
	color:var(--green)
}
.qr-card {
	border:1px solid var(--line);
	border-radius:12px;
	padding:14px
}
.qr {
	width:92px;
	height:92px;
	background:repeating-linear-gradient(90deg, #111 0 6px, #fff 6px 12px);
	border:8px solid #fff;
	box-shadow:inset 0 0 0 2px #111;
	margin-left:auto
}
.business-hero {
	height:350px;
	border-radius:14px;
	overflow:hidden;
	background:linear-gradient(105deg, #07182d, #09376f 60%, #c7d9ef);
	position:relative;
	color:#fff;
	/*padding:46px*/
}

.banner-badges{
    position:absolute;
    top:20px;
    left:20px;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.badge{
    padding:8px 14px;
    border-radius:25px;
    color:#fff;
    font-size:13px;
    font-weight:600;
    box-shadow:0 4px 10px rgba(0,0,0,.25);
}

.verified{background:#16a34a;}
.trusted{background:#f59e0b;}
.premium{background:#2563eb;}
.since{background:#6b7280;}
.business-hero h1 {
	font-size:34px;
	margin:0 0 10px
}
.business-hero p {
	font-size:20px;
	margin:0 0 18px
}
.hero-products {
	position:absolute;
	right:30px;
	bottom:0;
	font-size:92px;
	letter-spacing:4px;
	filter:drop-shadow(0 18px 20px rgba(0, 0, 0, .3))
}
.trust-chips {
	display:flex;
	gap:14px;
	margin-top:25px
}
.trust-chips span {
	border:1px solid rgba(255, 255, 255, .18);
	border-radius:10px;
	padding:11px 15px;
	background:rgba(255, 255, 255, .05);
	font-weight:800;
	font-size:12px
}
.actionbar {
	margin-top:20px;
	background:#fff;
	border:1px solid var(--line);
	border-radius:14px;
	padding:14px 20px;
	display:flex;
	justify-content:space-between;
	align-items:center
}
.actionbar .left {
	display:flex;
	gap:12px
}
.actionbar .btn {
	padding:12px 20px
}
.client-stats {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	background:#effaf3;
	border-radius:12px;
	overflow:hidden
}
.client-stats div {
	text-align:center;
	padding:12px 28px;
	border-right:1px solid #d8efdf
}
.tabs {
	margin-top:18px;
	background:#fff;
	border:1px solid var(--line);
	border-radius:14px;
	padding:18px
}
.tab-head {
	display:flex;
	align-items:center;
	gap:36px;
	border-bottom:1px solid var(--line);
	padding-bottom:14px
}
.tab-head b:first-child {
	color:var(--green);
	border-bottom:3px solid var(--green);
	padding-bottom:14px;
	margin-bottom:-17px
}
.tab-head .prod-search {
	margin-left:auto;
	width:310px;
	height:38px;
	border:1px solid var(--line);
	border-radius:9px;
	padding:0 13px
}
.main-grid {
	display:grid;
	grid-template-columns:250px 1fr;
	gap:24px;
	margin-top:20px
}
.feature-cats {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:10px
}
.feature-cats .fcat {
	border:1px solid var(--line);
	border-radius:9px;
	padding:14px;
	text-align:center
}
.fcat div {
	height:58px;
	display:grid;
	place-items:center;
	font-size:40px
}
.products {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:12px
}
.product {
	border:1px solid var(--line);
	border-radius:10px;
	padding:14px
}
.product .photo {
	height:150px;
	background:linear-gradient(145deg, #eef4fa, #fff);
	border-radius:9px;
	display:grid;
	place-items:center;
	font-size:58px
}
.product h4 {
	margin:12px 0 6px
}
.product p {
	font-size:12px;
	color:#667085;
	margin:0 0 8px
}
.product strong {
	font-size:18px
}
.product .status {
	float:right;
	background:#dcf8e6;
	color:var(--green);
	border-radius:11px;
	padding:4px 8px;
	font-size:11px;
	font-weight:900
}
.product .wa {
	margin-top:12px;
	width:100%;
	padding:10px;
	border-radius:8px;
	border:1px solid #bfe9cd;
	color:var(--green);
	font-weight:900;
	background:#f5fff8
}
.info-panels {
	display:grid;
grid-template-columns:1.1fr 1fr .8fr;
	gap:14px;
	margin-top:18px
}
.map {
	height:100px;
	border-radius:10px;
	background:linear-gradient(45deg, #e9ecef 25%, #f8fafb 25% 50%, #e9ecef 50% 75%, #f8fafb 75%);
	display:grid;
	place-items:center;
	color:var(--green);
	font-size:44px
}
.similar {
	margin:18px 0
}
.similar .biz-row {
	grid-template-columns:repeat(5, 1fr)
}


.faa-list{
    list-style:none;
    padding:0;
    margin:0;
}

.faa-list li{
    padding:10px 0;
    font-size:16px;
    border-bottom:1px solid #eee;
}

.faa-list li:last-child{
    border-bottom:none;
}

.faa-list i{
    width:25px;
    color:#0d6efd;
    margin-right:8px;
    text-align:center;
}

.text-success{
    color:#28a745 !important;
}

.text-warning{
    color:#ffc107 !important;
}


@media(max-width:1100px) {
.topbar {
padding:0 20px
}
.shell {
padding:0 20px
}
.hero, .client-layout, .panels, .main-grid, .info-panels {
grid-template-columns:1fr
}
.device {
display:none
}
.stats, .benefits, .biz-row, .cats, .steps, .products {
grid-template-columns:repeat(2, 1fr)
}
.sidebar {
position:static
}
.search-band {
grid-template-columns:1fr
}
.topbar nav {
display:none
}
}
