/* NAVBAR */
.navbar{
    background:white;
    box-shadow:0 3px 10px rgba(0,0,0,0.05);
}
.navbar-brand{
	font-weight:700;
	font-size:20px;
}
.badge-custom{
	background:#eef2ff;
	color:#6366f1;
	padding:8px 18px;
	border-radius:30px;
	font-size:14px;
}
.hero h1{
	font-size:42px;
	color: #000;
	font-weight:700;
	line-height:1.15;
	margin-top:25px;
}
.gradient-text{
	/*background:linear-gradient(90deg,#5b6cff,#8b5cf6,#ec4899);*/
	background:linear-gradient(90deg,#ffad1e,#8b5cf6,#ec4899);
	-webkit-background-clip:text;
	color:transparent;
}
	/* BUTTONS */
.btn-primary-custom{
	background:#ffad1e;
	color:#fff;
	padding:14px 28px;
	border-radius:12px;
	border:none;
	font-size: 1.25rem;
}
.btn-outline-custom{
	border:1px solid #cbd5e1;
	padding:14px 28px;
	border-radius:12px;
	background:white;
	font-size: 1.25rem;
}
.btn-primary-custom:hover{
	transform:translateY(-2px);
}
	/* DASHBOARD PREVIEW */
.preview-card{
	margin-top:70px;
	border-radius:20px;
	overflow:hidden;
	box-shadow:0 40px 80px rgba(0,0,0,0.12);
	transform:translateY(0);
	transition:.4s;
}
.preview-card:hover{
	transform:translateY(-10px);
}
	/* SECTION */
.section{
	padding:100px 0;
	text-align:center;
}
.section h2{
	font-size:40px;
	font-weight:700;
}
	/* TABS */
.feature-tabs{
	margin-top:30px;
}
.feature-tabs .btn{
	border-radius:30px;
	padding:10px 20px;
}
	/* CARDS */
.card{
	background:white;
	border-radius:16px;
	padding:24px;
	box-shadow:0 10px 30px rgba(0,0,0,0.05);
	transition:all .3s;
}
.card:hover{
	transform:translateY(-8px);
	box-shadow:0 20px 50px rgba(0,0,0,0.08);
}
.card h5{
	font-weight:600;
	margin-top:10px;
}
	/* CASE STUDIES */
.case-card{
	background:white;
	border-radius:18px;
	padding:40px;
	margin-top:30px;
	box-shadow:0 10px 30px rgba(0,0,0,0.05);
	text-align:left;
}
	/* RESPONSIVE */
@media(max-width:768px){
	.hero h1{
	font-size:38px;
	}
	.section h2{
	font-size:30px;
	}
}

.hero-orb-2 {
    position: absolute;
    top: 80px;
    right: 25%;
    width: 400px;
    height: 400px;
    border-radius: 50%;
    background: rgba(232, 98, 60, 0.05);
    filter: blur(80px);
    pointer-events: none;
}

.fade-up.visible {
    opacity: 1;
    transform: translateY(0);
}

.fade-up {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.text-muted-fl {
    color: #6b7a8d;
}

.fs-5 {
    font-size: 24px !important;
}

.navbar {
    background: white;
    box-shadow: none;
    padding: 8px 14px;
}
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 1rem;
    border-radius: 9999px;
    border: 1px solid #e2e6ed;
    background: #ffffff;
    font-size: 0.875rem;
    color: #6b7a8d;
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: #fff;
    background-color: #ffad1e;
}
.nav-pills .nav-link {
    color: #000;
    border-radius: 50px;
}
.card p {
    font-size: 0.875rem;
    color: #6b7a8d;
    line-height: 1.6;
    margin: 0;
}
.card h4 {
    font-size: 0.95rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}
.nav-pills .nav-link {
    box-shadow: none; 
    border: 1px solid #e2e6ed;
}
.icon-box-accent {
    background: rgb(255 173 30 / 12%);
    color: #ffad1e;
}
.icon-box {
    width: 48px;
    height: 48px;
    border-radius: .75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
    font-size: 1.5rem;
}

.bg-hero-gradient {
    background: linear-gradient(135deg, #ffad1e 0%, #6d48cb 50%, #e8623c 100%);
}
.cta-box {
    border-radius: 1.5rem;
    padding: 3rem 2rem;
    position: relative;
    overflow: hidden;
}
.btn-card {
    background: #fff;
    color: #000;
    border: none;
    border-radius: .75rem;
    font-weight: 600;
    padding: 0.75rem 2rem;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    transition: background 0.2s;
}
.btn-icon-only {
    width: 2.375rem;
    height: 2.375rem;
    padding: 10px;
}
.chip-yellow {
	background-color: #fff5e7;
}
.screen {
  position: absolute;

  left: 34%;
  top: 15%;
  width: 52%;
  height: 54%;

  overflow: hidden;

  transform:
    perspective(1800px)
    rotateY(-7deg)
    rotateX(3deg)
    rotateZ(-1deg);

  border-radius: 8px;
}

.screen img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.workflow{
	display:flex;
	align-items:stretch;
	gap:0;
	margin-top:35px;
	overflow-x:auto;
	padding-bottom:10px;
	text-align: left;
    font-weight: 300;
}
  .workflow-step{min-width:150px;background:#fff;border:1px solid #e5e9df;padding:22px 18px;position:relative}
  .workflow-step:first-child{border-radius:18px 0 0 18px}
.workflow-step:last-child{
  	border-radius:0 18px 18px 0;
  	background: #fff5e7;
    border-color: #ffad1e;
}
  .workflow-step:not(:last-child)::after{content:"→";position:absolute;right:-11px;top:50%;transform:translateY(-50%);z-index:2;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid #e5e9df;font-size:12px}
  .workflow-step small{color:#8a949d;font-weight:500}
  .workflow-step strong{display:block;margin-top:8px;font-size:15px}