:root{
  --biz-bg:#070912;
  --biz-card:#0d1220;
  --biz-border:rgba(255,255,255,.08);
  --biz-muted:#929cb0;
  --biz-blue:#2e7bff;
  --biz-purple:#8157ff;
  --biz-cyan:#61e6ff;
}

*{
  box-sizing:border-box
}

body.db-business-public{
  margin:0;
  color:#f7f8fc;
  background:
    radial-gradient(circle at 13% 4%,rgba(47,92,255,.13),transparent 30%),
    radial-gradient(circle at 92% 3%,rgba(196,44,205,.08),transparent 30%),
    var(--biz-bg);
  min-height:100vh
}

.biz-public-nav{
  position:sticky;
  top:0;
  z-index:20;

  min-height:70px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  padding:0 max(24px,calc((100vw - 1280px)/2));

  border-bottom:1px solid rgba(255,255,255,.06);

  background:rgba(7,9,18,.82);
  backdrop-filter:blur(18px)
}

.biz-public-brand{
  display:flex;
  align-items:center;
  gap:9px;

  color:#fff;
  text-decoration:none
}

.biz-public-brand em{
  padding:5px 8px;

  border-radius:7px;

  color:#70e9ff;
  background:rgba(64,183,255,.10);

  font-size:9px;
  font-style:normal;
  font-weight:900;
  letter-spacing:.12em
}

.biz-public-nav nav{
  display:flex;
  align-items:center;
  gap:20px
}

.biz-public-nav nav>a{
  color:#9ca5b8;
  text-decoration:none;
  font-size:12px;
  font-weight:700
}

.biz-nav-login{
  color:#fff!important
}

.biz-nav-start{
  padding:10px 14px;

  color:#fff!important;

  border-radius:11px;

  background:linear-gradient(
    100deg,
    var(--biz-blue),
    var(--biz-purple)
  )
}


/* HERO */

.biz-hero{
  max-width:1280px;
  min-height:680px;

  margin:0 auto;

  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;

  padding:80px 28px
}

.biz-kicker{
  color:var(--biz-cyan);

  font-size:10px;
  font-weight:900;
  letter-spacing:.15em
}

.biz-hero-copy h1{
  margin:13px 0 20px;

  max-width:650px;

  font-size:clamp(48px,6vw,82px);
  line-height:.96;
  letter-spacing:-.055em
}

.biz-hero-copy h1 span{
  display:block;

  background:linear-gradient(
    90deg,
    #6edaff,
    #8670ff,
    #f451ce
  );

  -webkit-background-clip:text;
  color:transparent
}

.biz-hero-copy>p{
  max-width:630px;

  color:var(--biz-muted);

  font-size:18px;
  line-height:1.6
}

.biz-hero-actions{
  margin-top:30px;

  display:flex;
  gap:10px;
  flex-wrap:wrap
}

.biz-primary-action,
.biz-secondary-action{
  min-height:52px;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:30px;

  padding:0 18px;

  border-radius:14px;

  text-decoration:none;

  font-size:13px;
  font-weight:900
}

.biz-primary-action{
  color:#fff;

  background:linear-gradient(
    100deg,
    var(--biz-blue),
    var(--biz-purple)
  );

  box-shadow:0 13px 34px rgba(67,73,218,.25)
}

.biz-secondary-action{
  color:#fff;

  border:1px solid var(--biz-border);

  background:rgba(255,255,255,.03)
}

.biz-trust-row{
  margin-top:25px;

  display:flex;
  gap:18px;
  flex-wrap:wrap;

  color:#7f899c;

  font-size:10px
}


/* DASHBOARD MOCK */

.biz-hero-preview{
  perspective:1200px
}

.biz-preview-window{
  overflow:hidden;

  border:1px solid var(--biz-border);

  border-radius:24px;

  background:#0a0f1c;

  box-shadow:
    0 35px 90px rgba(0,0,0,.40),
    0 0 60px rgba(73,78,255,.10);

  transform:rotateY(-3deg) rotateX(1deg)
}

.biz-preview-top{
  height:46px;

  display:flex;
  align-items:center;
  gap:6px;

  padding:0 14px;

  border-bottom:1px solid var(--biz-border);

  background:#0d1220
}

.biz-preview-top span{
  width:7px;
  height:7px;

  border-radius:50%;

  background:#394155
}

.biz-preview-top b{
  margin-left:auto;

  color:#707b92;

  font-size:8px;
  letter-spacing:.1em
}

.biz-preview-body{
  min-height:390px;

  display:grid;
  grid-template-columns:130px 1fr
}

.biz-preview-body aside{
  display:grid;
  align-content:start;
  gap:7px;

  padding:18px 13px;

  border-right:1px solid var(--biz-border);

  color:#687287;

  font-size:9px
}

.biz-preview-body aside strong{
  margin-bottom:10px;

  color:#fff
}

.biz-preview-body aside span{
  padding:7px 8px;

  border-radius:7px
}

.biz-preview-body aside .active{
  color:#fff;

  background:rgba(115,87,255,.12)
}

.biz-preview-body>section{
  padding:20px
}

.biz-preview-heading{
  display:flex;
  justify-content:space-between;
  align-items:center
}

.biz-preview-heading small{
  color:#657087;

  font-size:7px
}

.biz-preview-heading h3{
  margin:3px 0;

  font-size:19px
}

.biz-preview-heading button{
  border:0;

  padding:8px 11px;

  color:#fff;

  border-radius:8px;

  background:#6c50f6;

  font-size:8px
}

.biz-preview-metrics{
  margin-top:24px;

  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px
}

.biz-preview-metrics div{
  display:grid;
  gap:6px;

  padding:12px;

  border:1px solid rgba(255,255,255,.05);
  border-radius:10px;

  background:#0d1321
}

.biz-preview-metrics span{
  color:#69748a;

  font-size:7px
}

.biz-preview-metrics b{
  font-size:16px
}

.biz-preview-campaign{
  margin-top:15px;

  display:grid;
  gap:9px;

  padding:15px;

  border-radius:12px;

  background:#0d1321
}

.biz-preview-campaign>span{
  color:#66dda5;

  font-size:7px;
  font-weight:900
}

.biz-preview-campaign>div{
  height:4px;

  overflow:hidden;

  border-radius:10px;

  background:#1a2233
}

.biz-preview-campaign i{
  display:block;

  width:65%;
  height:100%;

  background:linear-gradient(
    90deg,
    var(--biz-blue),
    var(--biz-purple)
  )
}

.biz-preview-campaign small{
  color:#727d91;

  font-size:8px
}


/* SECTIONS */

.biz-section{
  max-width:1280px;

  margin:0 auto;

  padding:90px 28px
}

.biz-section-heading{
  max-width:780px;

  margin-bottom:35px
}

.biz-section-heading h2{
  margin:10px 0 14px;

  font-size:clamp(35px,4vw,55px);
  line-height:1.02;
  letter-spacing:-.04em
}

.biz-section-heading p{
  color:var(--biz-muted);

  font-size:16px;
  line-height:1.6
}


/* PROFILE DEMO */

.biz-profile-demo{
  overflow:hidden;

  border:1px solid var(--biz-border);
  border-radius:24px;

  background:#0c111d
}

.biz-demo-cover{
  height:190px;

  background:
    linear-gradient(
      120deg,
      rgba(35,105,255,.8),
      rgba(112,77,255,.75),
      rgba(229,53,179,.65)
    )
}

.biz-demo-main{
  display:flex;
  gap:20px;

  padding:0 28px 24px
}

.biz-demo-logo{
  width:95px;
  height:95px;

  margin-top:-42px;

  flex:0 0 95px;

  display:grid;
  place-items:center;

  border:6px solid #0c111d;
  border-radius:22px;

  background:#161e31;

  font-size:38px;
  font-weight:900
}

.biz-demo-info{
  padding-top:18px
}

.biz-demo-info h3{
  margin:0 0 5px;

  font-size:25px
}

.biz-demo-info h3 span{
  color:#55baff
}

.biz-demo-info>b{
  color:#8994a8;

  font-size:12px
}

.biz-demo-info p{
  color:#a5aec0
}

.biz-demo-info div{
  display:flex;
  gap:7px
}

.biz-demo-info button{
  padding:8px 11px;

  border:1px solid var(--biz-border);
  border-radius:9px;

  color:#fff;

  background:#111827
}

.biz-demo-tabs{
  display:flex;
  gap:25px;

  padding:15px 28px;

  border-top:1px solid var(--biz-border);

  color:#798397;

  font-size:11px
}

.biz-demo-tabs b{
  color:#fff
}


/* FEATURES */

.biz-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px
}

.biz-feature-grid article{
  min-height:190px;

  padding:22px;

  border:1px solid var(--biz-border);
  border-radius:18px;

  background:linear-gradient(
    145deg,
    #0d1321,
    #0a0e19
  )
}

.biz-feature-grid i{
  width:38px;
  height:38px;

  display:grid;
  place-items:center;

  border-radius:11px;

  background:rgba(119,81,255,.11);
  color:#ae9cff;

  font-style:normal
}

.biz-feature-grid h3{
  margin:18px 0 7px
}

.biz-feature-grid p{
  margin:0;

  color:var(--biz-muted);

  font-size:12px;
  line-height:1.55
}


/* PROCESS */

.biz-process{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px
}

.biz-process article{
  min-height:180px;

  padding:20px;

  border:1px solid var(--biz-border);
  border-radius:17px;

  background:#0c111e
}

.biz-process article>span{
  color:#8975ff;

  font-size:11px;
  font-weight:900
}

.biz-process h3{
  margin:25px 0 8px
}

.biz-process p{
  color:var(--biz-muted);

  font-size:11px;
  line-height:1.55
}


/* FINAL CTA */

.biz-final-cta{
  max-width:1225px;

  margin:50px auto 100px;

  padding:70px 30px;

  text-align:center;

  border:1px solid var(--biz-border);
  border-radius:28px;

  background:
    radial-gradient(circle at 50% 100%,rgba(104,72,255,.18),transparent 65%),
    #0c111d
}

.biz-final-cta h2{
  margin:12px 0;

  font-size:clamp(36px,5vw,62px)
}

.biz-final-cta p{
  color:var(--biz-muted)
}

.biz-final-cta a{
  margin-top:18px;

  display:inline-flex;

  padding:14px 20px;

  border-radius:13px;

  color:#fff;

  text-decoration:none;
  font-weight:900;

  background:linear-gradient(
    90deg,
    var(--biz-blue),
    var(--biz-purple)
  )
}


/* FOOTER */

.biz-public-footer{
  max-width:1280px;

  margin:auto;

  min-height:90px;

  display:flex;
  justify-content:space-between;
  align-items:center;

  padding:0 28px;

  border-top:1px solid var(--biz-border);

  color:#687286;

  font-size:10px
}

.biz-public-footer>a{
  color:#fff;
  text-decoration:none;
  font-weight:900
}

.biz-public-footer nav{
  display:flex;
  gap:18px
}

.biz-public-footer nav a{
  color:#7d8799;
  text-decoration:none
}


@media(max-width:900px){

  .biz-public-nav nav>a:not(
    .biz-nav-login,
    .biz-nav-start
  ){
    display:none
  }

  .biz-hero{
    grid-template-columns:1fr;

    padding-top:55px
  }

  .biz-preview-window{
    transform:none
  }

  .biz-feature-grid{
    grid-template-columns:1fr 1fr
  }

  .biz-process{
    grid-template-columns:1fr 1fr
  }

}


@media(max-width:600px){

  .biz-public-nav{
    padding:0 15px
  }

  .biz-public-nav nav{
    gap:7px
  }

  .biz-nav-login{
    display:none
  }

  .biz-nav-start{
    font-size:9px!important
  }

  .biz-hero{
    padding:45px 18px 60px
  }

  .biz-hero-copy h1{
    font-size:47px
  }

  .biz-section{
    padding:65px 18px
  }

  .biz-feature-grid,
  .biz-process{
    grid-template-columns:1fr
  }

  .biz-preview-body{
    grid-template-columns:1fr
  }

  .biz-preview-body aside{
    display:none
  }

  .biz-demo-main{
    padding:0 18px 20px
  }

  .biz-demo-tabs{
    overflow:auto;

    padding:14px 18px
  }

}