#navbar { background: none; }
#navbar.scrolled { background: #fff; }

#navbar { background: transparent;  transition: background-color 0.3s ease, box-shadow 0.3s ease;}

#navbar.scrolled {
  background: #ffffff;
  box-shadow: 0 4px 20px rgba(30, 28, 55, 0.08);
}

.nav-links a, .nav-links .nav-btn { color: #fff; font-weight: 600; font-size: 0.95rem; transition: color .25s ease; }
#navbar.scrolled .nav-links a,#navbar.scrolled .nav-links .nav-btn,#navbar.scrolled .explore-label,#navbar.scrolled .btn-ghost-tn { color: inherit; }
.explore-label, .btn-ghost-tn { color: #fff; font-weight: 600; font-size: 0.85rem; transition: color .25s ease; }
#navbar .logo-light { display: block; }
.logo-dark { display: none; }
#navbar.scrolled .logo-dark { display: block; }
#navbar.scrolled .logo-light { display: none; }
.eyebrow-hm { display: inline-flex; align-items: center; gap: 9px; padding: 8px 14px; border: 1px solid rgba(255, 255, 255, 0.134); border-radius: 999px; color: rgba(255, 255, 255,.6); font-weight: 600; background: rgba(255,255,255,.06); box-shadow: 0 4px 12px rgba(74,36,232,.04); font-size: 13px; margin-bottom: 24px; }
.eyebrow-hm i { font-size: 15px; }
.hero { min-height: auto; padding-bottom: 20px; }


 /* new */
.hero-home {padding-top: 100px; padding-bottom: 0px; position: relative; 
  /* background: radial-gradient(circle at 88% 24%,rgba(94,48,247,.13),transparent 26%),radial-gradient(circle at 20% 78%,rgba(102,61,240,.07),transparent 27%),linear-gradient(180deg,#fff 0%,#fff 55%,#f8f6ff 100%);  */
      background-image: linear-gradient(#18075f 5%, #230f7b 35%, #464cca 65%, #230f7b);
  overflow: hidden; 
}
/* .hero-home::before { content: ""; position: absolute; width: 260px; height: 260px; border-radius: 50%; right: -95px; top: 73px; background: rgba(255,255,255,.04); } */
.hero-inner { position: relative; z-index: 2; padding-top: 100px; }

.hero-sub {font-size:1rem}
.slider-hr-website-clip { clip-path: polygon(0% 0%, 0% 0%, 11.499% 0%, 22.022% 0%, 31.809% 0%, 41.102% 0%, 50.142% 0%, 59.171% 0%, 68.43% 0%, 78.16% 0%, 88.603% 0%, 100% 0%, 100% 100%, 100% 100%, 86.685% 95.4%, 75.613% 91.823%, 66.218% 89.267%, 57.938% 87.734%, 50.205% 87.223%, 42.456% 87.734%, 34.126% 89.267%, 24.65% 91.823%, 13.463% 95.4%, 0% 100%, 0% 0%);}

.btn-hero-secondary, .btn-hero-primary {min-height: 56px;box-shadow: none; min-width: 180px; justify-content: center; font-weight: 600; font-size: 0.85rem; border-radius: 8px; transition: transform .25s ease, box-shadow .25s ease;}

.email-demo { display: flex; gap: 10px; min-width: 502px; margin-bottom: 31px; }
.email-demo input { flex: 1; min-height: 52px; border: 1px solid rgba(255, 255, 255,.5); border-radius: 4px; padding: 0 22px; font-size: 16px; outline: none; background: rgba(255, 255, 255, 0.15);    backdrop-filter: blur(15px); color: #fff; transition: border-color .25s ease, box-shadow .25s ease;   }
.email-demo input:focus { border-color: #a493f4; box-shadow: 0 0 0 4px rgba(74,36,232,.08); }
.email-demo button { min-height: 52px; min-width: 160px; border: none; border-radius: 4px; color: #fff; background:#000aef; font-weight: 600; font-size:  0.85rem; }
.email-demo button:hover {  background:var(--primary-dark); }

.quick-links { display: flex; align-items: center; flex-wrap: wrap; gap: 0; color: #363b51; font-size: 14px;justify-content: center; }
.quick-item { display: flex; align-items: center; gap: 6px; padding: 0 18px; border-right: 1px solid #ddddeb; }
.quick-item:first-child { padding-left: 0; }
.quick-item:last-child { border-right: 0; }
.quick-icon { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; color: #00db2a; }
.play { background: #00db2a; color: #fff; width: 24px; height: 24px; font-size: 10px; }

/* customer strip */
.customer-strip-wrap { background-color: #fff !important; z-index: 5;background: rgba(255,255,255,.94);border-bottom: 1px solid #e8e7ef; padding: 30px 30px; }
.trust-label { color: #364056; font-size: 14px; line-height: 1.6; padding-right: 24px; border-right: 1px solid #e3e4ea;font-weight: 500; }
.logo-cell { min-height: 52px; display: grid; place-items: center; border-right: 1px solid #efeff4; color: #555a66; font-size: 22px; font-weight: 700; letter-spacing: -1px; opacity: .78; padding: 0 15px; text-align: center; }
.logo-cell:last-of-type { border-right: 0; }
.see-customers { color: var(--primary); text-decoration: none; font-size: 13px; text-align: right; white-space: nowrap; }

.tp-brand-item img {filter: grayscale(.3);}
.bg-overlay { background: url(assets/img/home/banner/overlay.png); position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; opacity: .6; }
.tp-hero-pb-bigtitle { font-weight: 700; font-size: 250px; line-height: 77%; letter-spacing: -.04em; background: linear-gradient(180deg, rgba(230, 230, 255, 0.12) 0%, rgba(16, 0, 117, 0.2) 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: #fff0; position: absolute; bottom: 80px; left: 0; right: 0; margin: 0 auto; z-index: -1; margin-left: -20px; }
.anime-svg { width: 100%; height: auto; z-index: 1; object-fit: cover; }

 @media (max-width: 575.98px) {
  .hero-home { padding-top: 60px !important; padding-bottom: 0px;}
  .btn-hero-primary,.btn-hero-secondary {width: 100%; text-align: center; justify-content: center;}
  .hero h1 { font-size: 37px; line-height: 1.2; text-align: center;}
  .email-demo {flex-direction: column; gap: 12px; max-width: 100%; margin-bottom: 20px; padding: 0 15px;}
  .customer-strip-wrap {    margin-top: -15px !important;}
  .trust-label {padding-right: 0 !important; border-right: none !important; text-align: center; margin-bottom: 12px;}
  .btn-primary.home-btn {border: 1px solid #fff; margin-bottom: 20px;}
 }

@media only screen and (min-width:1700px) and (max-width:1800px) {
    .tp-hero-pb-bigtitle { font-size: 260px}
}