:root{
	--amber:#E8820C;
	--amber-dark:#B85F05;
	--green:#168B72;
	--ink:#16191F;
	--muted:#657083;
	--cream:#FFF8EE;
	--sand:#F6EDDF;
	--white:#fff;
	--line:#E6DDCF;
	--shadow:0 24px 70px rgba(22,25,31,.13);
	--deep:#11161D;
}

*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}

html{
	scroll-behavior:smooth;
}

body{
	min-height:100vh;
	font-family:'DM Sans',sans-serif;
	background:
		radial-gradient(circle at 12% 4%, rgba(22,139,114,.12), transparent 26%),
		radial-gradient(circle at 92% 10%, rgba(232,130,12,.12), transparent 24%),
		linear-gradient(180deg,#FFFCF7 0%,#fff 42%,#F7FAF8 100%);
	color:var(--ink);
	overflow-x:hidden;
}

body.menu-open{
	overflow:hidden;
}

.wrap{
	width:min(1140px,100% - 40px);
	margin:auto;
}

h1,h2,h3{
	font-family:'Syne',sans-serif;
	letter-spacing:0;
}

a{
	text-decoration:none;
	color:inherit;
}

img{
	width:100%;
	display:block;
}

.nav{
	position:fixed;
	width:100%;
	top:0;
	z-index:1000;
	padding:16px 0;
	transition:background .25s ease, box-shadow .25s ease, padding .25s ease;
}

.nav.stuck,
.nav.menu-active{
	padding:10px 0;
	background:rgba(255,255,255,.84);
	border-bottom:1px solid rgba(230,221,207,.78);
	box-shadow:0 16px 40px rgba(22,25,31,.08);
	backdrop-filter:blur(18px);
}

.nav-inner{
	width:min(1140px,100% - 40px);
	margin:auto;
	display:flex;
	align-items:center;
	gap:32px;
}

.logo{
	display:flex;
	align-items:center;
	gap:10px;
	font-weight:800;
}

.logo-mark{
	width:58px;
	height:38px;
	border-radius:8px;
	background:#fff;
	display:flex;
	align-items:center;
	justify-content:center;
	overflow:hidden;
	box-shadow:0 12px 24px rgba(232,130,12,.16);
}

.logo-mark img{
	width:100%;
	height:100%;
	object-fit:contain;
}

.nav-links{
	display:flex;
	gap:20px;
	list-style:none;
	color:#485161;
	font-weight:700;
	font-size:.95rem;
}

.nav-links a{
	transition:color .2s ease;
}

.nav-links a:hover{
	color:var(--amber-dark);
}

.nav-right{
	margin-left:auto;
	display:flex;
	gap:10px;
	align-items:center;
}

.btn{
	min-height:46px;
	padding:12px 22px;
	border-radius:999px;
	font-weight:800;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	border:1px solid transparent;
	transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.btn:hover{
	transform:translateY(-2px);
}

.btn-amber{
	background:linear-gradient(135deg,var(--amber),var(--amber-dark));
	color:#fff;
	box-shadow:0 16px 34px rgba(232,130,12,.25);
}

.btn-outline{
	border-color:rgba(232,130,12,.34);
	color:var(--amber-dark);
	background:rgba(255,255,255,.72);
}

.btn-white{
	background:#fff;
	color:var(--amber-dark);
}

.btn-ghost{
	color:var(--muted);
}

.btn-lg{
	min-height:54px;
	padding-inline:26px;
}

.btn-full{
	width:100%;
}

.play-icon{
	width:18px;
	height:18px;
	border-radius:50%;
	background:var(--amber);
	position:relative;
	flex:0 0 auto;
}

.play-icon::after{
	content:"";
	position:absolute;
	left:7px;
	top:5px;
	border-left:6px solid #fff;
	border-top:4px solid transparent;
	border-bottom:4px solid transparent;
}

.hero{
	min-height:100vh;
	padding:136px 0 80px;
	display:flex;
	align-items:center;
	isolation:isolate;
	overflow:hidden;
}

.hero::before{
	content:"";
	position:absolute;
	inset:0;
	z-index:-2;
	background:
		linear-gradient(90deg,rgba(255,252,247,.99) 0%,rgba(255,252,247,.92) 45%,rgba(255,252,247,.58) 100%),
		url("analysis1.jpg") right 4% center / min(860px,64vw) auto no-repeat;
}

.hero::after{
	content:"";
	position:absolute;
	inset:auto -8% -14% 34%;
	height:360px;
	z-index:-1;
	background:
		linear-gradient(90deg,rgba(22,139,114,.18),rgba(232,130,12,.16)),
		url("analysis3.jpg") center / cover;
	transform:rotate(-5deg);
	border-radius:48px;
	opacity:.55;
	filter:saturate(.9);
}

.hero .wrap{
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(380px,1fr);
	gap:64px;
	align-items:center;
}

.hero-left{
	max-width:620px;
}

.hero-badge,
.label{
	display:inline-flex;
	align-items:center;
	gap:8px;
	background:#EEF8F4;
	color:#126f5d;
	border:1px solid rgba(22,139,114,.14);
	padding:8px 14px;
	border-radius:999px;
	font-weight:800;
	font-size:.82rem;
}

.dot{
	width:8px;
	height:8px;
	background:var(--green);
	border-radius:50%;
	box-shadow:0 0 0 6px rgba(22,139,114,.12);
}

.hero h1{
	max-width:720px;
	margin:18px 0 20px;
	font-size:clamp(2.65rem,6vw,5.25rem);
	line-height:.96;
}

.hero h1 span{
	color:var(--amber-dark);
}

.hero p{
	max-width:560px;
	font-size:1.08rem;
	color:var(--muted);
	line-height:1.75;
	margin-bottom:34px;
}

.hero-btns,
.cta-btns{
	display:flex;
	gap:14px;
	flex-wrap:wrap;
}

.hero-stats{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:14px;
	max-width:560px;
	margin-top:34px;
}

.hero-stats div{
	padding:16px;
	border:1px solid rgba(230,221,207,.85);
	background:rgba(255,255,255,.66);
	border-radius:8px;
	box-shadow:0 14px 28px rgba(22,25,31,.05);
}

.hero-stats strong{
	display:block;
	font-family:'Syne',sans-serif;
	font-size:1.35rem;
}

.hero-stats span{
	display:block;
	margin-top:4px;
	color:var(--muted);
	font-size:.85rem;
}

.app-links{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin-top:18px;
}

.app-links a{
	min-height:38px;
	display:inline-flex;
	align-items:center;
	padding:8px 13px;
	border-radius:999px;
	background:rgba(255,255,255,.68);
	border:1px solid rgba(230,221,207,.88);
	color:#3E4856;
	font-weight:800;
	font-size:.86rem;
	box-shadow:0 12px 28px rgba(22,25,31,.06);
	backdrop-filter:blur(12px);
	transition:transform .2s ease, border-color .2s ease;
}

.app-links a:hover{
	transform:translateY(-2px);
	border-color:rgba(22,139,114,.28);
}

.mockups{
	--rx:0deg;
	--ry:0deg;
	position:relative;
	min-height:560px;
	perspective:1200px;
	transform-style:preserve-3d;
	transform:rotateX(var(--rx)) rotateY(var(--ry));
	transition:transform .2s ease;
}

.mockups::before{
	content:"";
	position:absolute;
	inset:11% 4% 9% 0;
	border-radius:30px;
	background:linear-gradient(135deg,rgba(22,139,114,.16),rgba(232,130,12,.13));
	filter:blur(.2px);
	transform:translateZ(-80px) rotate(-4deg);
}

.orbit{
	position:absolute;
	border:1px solid rgba(22,139,114,.18);
	border-radius:50%;
	pointer-events:none;
	animation:spin 14s linear infinite;
}

.orbit-one{
	width:300px;
	height:300px;
	right:8%;
	top:8%;
}

.orbit-two{
	width:210px;
	height:210px;
	left:2%;
	bottom:10%;
	animation-duration:18s;
	animation-direction:reverse;
}

.mcard{
	position:absolute;
	overflow:hidden;
	border:1px solid rgba(255,255,255,.8);
	border-radius:18px;
	background:#fff;
	box-shadow:var(--shadow);
	transform-style:preserve-3d;
}

.mcard img{
	height:100%;
	object-fit:cover;
}

.mc-main{
	width:74%;
	left:0;
	top:13%;
	z-index:3;
	transform:translateZ(80px) rotateY(-11deg) rotateX(4deg);
	animation:floatMain 6s ease-in-out infinite;
}

.mc-top{
	width:46%;
	right:0;
	top:2%;
	z-index:4;
	transform:translateZ(150px) rotateY(-16deg) rotateZ(4deg);
	animation:floatTop 5.5s ease-in-out infinite;
}

.mc-bot{
	width:44%;
	right:5%;
	bottom:2%;
	z-index:2;
	transform:translateZ(110px) rotateY(-8deg) rotateZ(-3deg);
	animation:floatBottom 6.8s ease-in-out infinite;
}

.metric-chip{
	position:absolute;
	z-index:5;
	min-width:138px;
	padding:12px 14px;
	border-radius:8px;
	background:rgba(255,255,255,.88);
	border:1px solid rgba(230,221,207,.8);
	box-shadow:0 18px 40px rgba(22,25,31,.12);
	backdrop-filter:blur(12px);
}

.metric-chip span{
	display:block;
	color:var(--muted);
	font-size:.78rem;
	font-weight:700;
}

.metric-chip strong{
	display:block;
	margin-top:2px;
	font-family:'Syne',sans-serif;
}

.chip-a{
	left:3%;
	bottom:15%;
	animation:floatTop 5.7s ease-in-out infinite;
}

.chip-b{
	right:2%;
	top:43%;
	animation:floatBottom 6.2s ease-in-out infinite;
}

section{
	position:relative;
}

.features,
.showcase,
.work,
.pricing,
.faq{
	padding:104px 0;
}

.features,
.pricing{
	background:
		linear-gradient(110deg,rgba(255,255,255,.97),rgba(255,255,255,.9)),
		url("inventory.jpg") left center / min(560px,42vw) auto no-repeat fixed,
		#fff;
}

.showcase,
.work,
.faq{
	background:
	linear-gradient(135deg,rgba(248,251,250,.96),rgba(255,248,238,.92)),
	url("warehouse2.jpg") right center / min(760px,54vw) auto no-repeat fixed,
		#F8FBFA;
}

.sec-title{
	max-width:760px;
	margin:16px 0 12px;
	font-size:clamp(2rem,4vw,3.35rem);
	line-height:1.05;
}

.sec-sub{
	max-width:640px;
	color:var(--muted);
	line-height:1.7;
	margin-bottom:34px;
	font-size:1.02rem;
}

.feat-grid,
.pricing-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:20px;
}

.feat-card,
.price-card{
	position:relative;
	min-height:100%;
	background:#fff;
	padding:28px;
	border-radius:8px;
	border:1px solid var(--line);
	box-shadow:0 16px 38px rgba(22,25,31,.05);
	overflow:hidden;
	transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.feat-card > *,
.price-card > *{
	position:relative;
	z-index:1;
}

.features .feat-card,
.pricing .price-card{
	background:linear-gradient(180deg,#fff,#fffaf2);
}

.image-card{
	min-height:230px;
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
	color:#fff;
	border-color:rgba(255,255,255,.5);
	background:#151A20;
}

.image-card::before{
	content:"";
	position:absolute;
	inset:0;
	background:var(--card-image) center / cover;
	transform:scale(1.04);
	transition:transform .35s ease;
}

.image-card::after{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(180deg,rgba(15,20,26,.08),rgba(15,20,26,.78));
}

.image-card:hover::before{
	transform:scale(1.09);
}

.feat-card.image-card p{
	color:rgba(255,255,255,.82);
}

.image-card .feat-icon{
	background:rgba(255,255,255,.16);
	backdrop-filter:blur(10px);
}

.inventory-card{ --card-image:url("inventory.jpg"); }
.warehouse-card{ --card-image:url("warehouse2.jpg"); }
.analytics-card{ --card-image:url("analysis3.jpg"); }
.dashboard-card{ --card-image:url("analysis2.jpg"); }
.invoice-card{ --card-image:url("accounting1.jpg"); }

.feat-card:hover,
.price-card:hover{
	transform:translateY(-6px);
	border-color:rgba(232,130,12,.32);
	box-shadow:0 22px 52px rgba(22,25,31,.1);
}

.feat-icon{
	width:48px;
	height:48px;
	margin-bottom:18px;
	border-radius:12px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:#EEF8F4;
	font-size:1.55rem;
}

.feat-card h3,
.price-card h3{
	margin-bottom:10px;
	font-size:1.18rem;
}

.feat-card p,
.price-card p{
	color:var(--muted);
	line-height:1.65;
}

.module-strip{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin-top:24px;
}

.module-strip span{
	padding:10px 14px;
	border-radius:999px;
	background:#F7FAF9;
	border:1px solid var(--line);
	color:#44505C;
	font-weight:800;
	font-size:.88rem;
}

.showcase-panel{
	display:grid;
	grid-template-columns:.78fr 1.22fr;
	gap:28px;
	align-items:center;
	margin:20px 0 24px;
	padding:24px;
	border-radius:8px;
	border:1px solid var(--line);
	background:
		linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,255,255,.82)),
		url("analysis3.jpg") left center / cover;
	box-shadow:var(--shadow);
	backdrop-filter:blur(18px);
}

.panel-copy{
	padding:10px;
}

.panel-copy h3{
	margin:16px 0 12px;
	font-size:clamp(1.6rem,3vw,2.45rem);
	line-height:1.08;
}

.panel-copy p{
	color:var(--muted);
	line-height:1.7;
}

.panel-screen{
	position:relative;
	overflow:hidden;
	border-radius:8px;
	border:1px solid var(--line);
	box-shadow:0 20px 50px rgba(22,25,31,.12);
}

.panel-screen::after{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(180deg,transparent,rgba(22,25,31,.08));
	pointer-events:none;
}

.panel-screen img{
	aspect-ratio:16/10;
	object-fit:cover;
}

.work{
	overflow:hidden;
}

.work-head{
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(280px,420px);
	gap:28px;
	align-items:end;
}

.work-head .sec-sub{
	margin-bottom:14px;
}

.work-showcase{
	display:grid;
	grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);
	gap:28px;
	align-items:center;
	margin:28px 0 22px;
	padding:24px;
	border:1px solid var(--line);
	border-radius:8px;
	background:
		linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,250,242,.9)),
		url("MRA.png") left -80px center / 360px auto no-repeat;
	box-shadow:var(--shadow);
}

.work-copy{
	padding:10px;
}

.work-copy h3{
	margin:18px 0 12px;
	font-size:clamp(1.65rem,3vw,2.55rem);
	line-height:1.08;
}

.work-copy p,
.work-card-copy p{
	color:var(--muted);
	line-height:1.7;
}

.work-screen{
	position:relative;
	overflow:hidden;
	border-radius:8px;
	border:1px solid rgba(230,221,207,.94);
	background:#fff;
	box-shadow:0 22px 58px rgba(22,25,31,.12);
}

.work-screen img{
	aspect-ratio:4/3;
	height:100%;
	object-fit:cover;
	object-position:top center;
}

.work-screen-main{
	transform:perspective(1000px) rotateY(-3deg) rotateX(1deg);
	transform-origin:center;
}

.lumoda-stack{
	display:grid;
	grid-template-columns:1.25fr .82fr;
	grid-template-rows:repeat(2,minmax(0,1fr));
	gap:10px;
	padding:10px;
	background:#151A20;
}

.lumoda-stack img:first-child{
	grid-row:1 / span 2;
}

.lumoda-stack img{
	min-height:0;
	border-radius:6px;
	aspect-ratio:auto;
	object-fit:cover;
	object-position:top center;
}

.multi-screen{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:8px;
	padding:8px;
}

.multi-screen img{
	min-height:0;
	border-radius:6px;
}

.work-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:20px;
}

.work-card{
	display:grid;
	gap:16px;
	padding:16px;
	border:1px solid var(--line);
	border-radius:8px;
	background:rgba(255,255,255,.88);
	box-shadow:0 16px 38px rgba(22,25,31,.06);
	transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.work-card:hover{
	transform:translateY(-5px);
	border-color:rgba(22,139,114,.24);
	box-shadow:0 22px 52px rgba(22,25,31,.1);
}

.work-card .work-screen{
	box-shadow:0 14px 32px rgba(22,25,31,.08);
}

.work-card-copy{
	padding:0 4px 4px;
}

.work-card-copy span{
	display:inline-flex;
	margin-bottom:10px;
	color:#126f5d;
	font-size:.78rem;
	font-weight:900;
	text-transform:uppercase;
}

.work-card-copy h3{
	margin-bottom:8px;
	font-size:1.08rem;
}

.planning-card{
	display:grid;
	grid-template-columns:minmax(220px,.5fr) minmax(0,1fr);
	gap:22px;
	align-items:center;
	margin-top:20px;
	padding:24px;
	border:1px solid rgba(22,139,114,.18);
	border-radius:8px;
	background:
		linear-gradient(135deg,rgba(255,255,255,.94),rgba(238,248,244,.9)),
		url("MRA.png") right -50px center / 260px auto no-repeat;
	box-shadow:0 16px 38px rgba(22,25,31,.05);
}

.planning-card h3{
	margin-top:14px;
	font-size:1.35rem;
}

.planning-card p{
	color:var(--muted);
	line-height:1.7;
}

.compact-grid{
	margin-top:20px;
}

.price-card{
	position:relative;
	display:flex;
	flex-direction:column;
	gap:16px;
}

.price-card h2{
	margin-top:auto;
	font-size:2rem;
}

.price-card.featured{
	background:
		linear-gradient(180deg,rgba(23,26,32,.9),rgba(23,26,32,.98)),
		url("accounting2.jpg") center / cover;
	color:#fff;
	border-color:#171A20;
	transform:translateY(-10px);
}

.price-card.featured p{
	color:rgba(255,255,255,.72);
}

.plan-tag{
	align-self:flex-start;
	padding:7px 11px;
	border-radius:999px;
	background:rgba(232,130,12,.18);
	color:#FFD19A;
	font-weight:800;
	font-size:.78rem;
}

.cta{
	padding:108px 0;
	background:
		linear-gradient(135deg,rgba(23,26,32,.9),rgba(36,50,46,.92)),
		url("warehouse2.jpg") center / cover;
	color:#fff;
	text-align:center;
}

.cta-inner{
	max-width:680px;
	margin:auto;
}

.cta h2{
	font-size:clamp(2rem,4vw,3.45rem);
	line-height:1.06;
	margin-bottom:18px;
}

.cta p{
	margin-bottom:30px;
	color:rgba(255,255,255,.72);
	line-height:1.7;
}

.cta-btns{
	justify-content:center;
}

footer{
	background:#111419;
	color:rgba(255,255,255,.62);
	padding:30px 0;
}

.ft-bot{
	display:flex;
	justify-content:space-between;
	gap:18px;
	flex-wrap:wrap;
}

.drawer{
	position:fixed;
	inset:0 0 auto 0;
	z-index:999;
	min-height:100vh;
	padding:96px 24px 32px;
	background:rgba(255,250,242,.96);
	backdrop-filter:blur(20px);
	transform:translateY(-105%);
	transition:transform .28s ease;
}

.drawer.open{
	transform:translateY(0);
}

.drawer ul{
	display:grid;
	gap:8px;
	list-style:none;
}

.drawer a{
	display:flex;
	min-height:52px;
	align-items:center;
	font-weight:800;
}

.drawer-btns{
	display:grid;
	gap:12px;
	margin-top:24px;
}

.modal-backdrop{
	position:fixed;
	inset:0;
	z-index:1400;
	display:none;
	align-items:center;
	justify-content:center;
	padding:20px;
	background:rgba(17,22,29,.62);
	backdrop-filter:blur(14px);
}

.modal-backdrop.open{
	display:flex;
}

.site-modal{
	position:relative;
	width:min(480px,100%);
	max-height:calc(100vh - 40px);
	overflow:auto;
	padding:28px;
	border-radius:12px;
	border:1px solid rgba(255,255,255,.6);
	background:
		linear-gradient(rgba(255,255,255,.94),rgba(255,255,255,.94)),
		url("accounting1.jpg") center / cover;
	box-shadow:0 34px 100px rgba(0,0,0,.24);
}

.auth-modal{
	width:min(430px,100%);
	padding:48px 38px 34px;
	border-radius:16px;
	background:
		linear-gradient(rgba(255,255,255,.95),rgba(255,255,255,.97)),
		url("MRA.png") center 38px / 250px auto no-repeat,
		#fff;
}

.auth-modal::before{
	content:"";
	position:absolute;
	inset:0;
	pointer-events:none;
	opacity:.05;
	background:url("MRA.png") center 36px / 270px auto no-repeat;
}

.auth-head{
	position:relative;
	margin-bottom:28px;
}

.auth-head h2{
	margin:0;
	color:#151922;
	font-family:'DM Sans',sans-serif;
	font-size:1.85rem;
	font-weight:900;
	letter-spacing:0;
}

.auth-head span{
	display:block;
	width:96px;
	height:3px;
	margin-top:8px;
	border-radius:999px;
	background:#4667E8;
}

.auth-note{
	margin-top:-12px;
	margin-bottom:20px;
	color:var(--muted);
}

.site-modal h2{
	margin:16px 0 10px;
	font-size:clamp(1.8rem,4vw,2.55rem);
	line-height:1.06;
}

.site-modal p{
	color:var(--muted);
	line-height:1.65;
	margin-bottom:20px;
}

.modal-close{
	position:absolute;
	top:16px;
	right:16px;
	width:38px;
	height:38px;
	border:1px solid var(--line);
	border-radius:10px;
	background:#fff;
	color:var(--ink);
	cursor:pointer;
	font-size:1.35rem;
	line-height:1;
}

.modal-form{
	display:grid;
	gap:16px;
}

.modal-form label{
	margin-top:4px;
	color:#394454;
	font-weight:800;
	font-size:.86rem;
}

.modal-form input,
.modal-form select{
	width:100%;
	min-height:48px;
	padding:12px 14px;
	border:1px solid var(--line);
	border-radius:8px;
	background:#fff;
	color:var(--ink);
	font:inherit;
	outline:none;
}

.field-icon{
	min-height:56px;
	display:flex;
	align-items:center;
	gap:12px;
	margin:0;
	padding:0 14px;
	border:1.5px solid #BBC8DB;
	border-radius:8px;
	background:#fff;
	color:#171A20;
	transition:border-color .2s ease, box-shadow .2s ease;
}

.field-icon:focus-within{
	border-color:#4667E8;
	box-shadow:0 0 0 4px rgba(70,103,232,.1);
}

.field-icon span{
	width:24px;
	color:#151922;
	font-size:1.2rem;
	text-align:center;
}

.field-icon input{
	min-height:54px;
	padding:0;
	border:0;
	box-shadow:none;
	background:transparent;
}

.field-icon input:focus{
	box-shadow:none;
}

.form-row{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:14px;
	margin-top:-8px;
	font-size:.78rem;
}

.form-row small{
	color:#4E5563;
}

.form-row a{
	color:#3155D4;
	font-weight:800;
	text-decoration:underline;
}

.form-status{
	display:none;
	padding:10px 12px;
	border-radius:8px;
	background:#FEF3E2;
	color:#8A4A00;
	font-size:.86rem;
	line-height:1.45;
}

.form-status.show{
	display:block;
}

.form-status.error{
	background:#FEECEC;
	color:#B42318;
}

.btn-green{
	min-height:56px;
	background:#08B813;
	color:#fff;
	box-shadow:0 16px 34px rgba(8,184,19,.24);
	font-weight:900;
}

.auth-separator{
	display:flex;
	align-items:center;
	gap:10px;
	margin:18px 0;
	color:#3D414A;
	font-size:.9rem;
}

.auth-separator span{
	height:1px;
	flex:1;
	background:#AEB9C8;
}

.google-btn{
	width:100%;
	min-height:54px;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:16px;
	border:1.5px solid #BBC8DB;
	border-radius:8px;
	background:#fff;
	color:#2C3038;
	font:inherit;
	font-weight:800;
	cursor:pointer;
	transition:transform .2s ease, border-color .2s ease;
}

.google-btn:hover{
	transform:translateY(-2px);
	border-color:#4667E8;
}

.google-btn strong{
	font-size:1.35rem;
	color:#4285F4;
}

.auth-switch{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
	gap:4px;
	margin-top:22px;
	color:#2C3038;
}

.modal-form input:focus,
.modal-form select:focus{
	border-color:rgba(22,139,114,.55);
	box-shadow:0 0 0 4px rgba(22,139,114,.12);
}

.text-link{
	border:0;
	background:transparent;
	color:#3155D4;
	font:inherit;
	font-weight:800;
	cursor:pointer;
}

.hbg{
	display:none;
	width:44px;
	height:44px;
	border:1px solid var(--line);
	border-radius:12px;
	background:rgba(255,255,255,.72);
	cursor:pointer;
	margin-left:auto;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:5px;
}

.hbg span{
	width:20px;
	height:2px;
	border-radius:999px;
	background:var(--ink);
	display:block;
	transition:transform .2s ease, opacity .2s ease;
}

.hbg.open span:nth-child(1){
	transform:translateY(7px) rotate(45deg);
}

.hbg.open span:nth-child(2){
	opacity:0;
}

.hbg.open span:nth-child(3){
	transform:translateY(-7px) rotate(-45deg);
}

.reveal{
	opacity:0;
	transform:translateY(24px);
	transition:opacity .65s ease, transform .65s ease;
}

.reveal.on{
	opacity:1;
	transform:translateY(0);
}

@keyframes spin{
	to{ transform:rotate(360deg); }
}

@keyframes floatMain{
	0%,100%{ translate:0 0; }
	50%{ translate:0 -14px; }
}

@keyframes floatTop{
	0%,100%{ translate:0 0; }
	50%{ translate:0 -10px; }
}

@keyframes floatBottom{
	0%,100%{ translate:0 0; }
	50%{ translate:0 12px; }
}

@media (prefers-reduced-motion:reduce){
	*,
	*::before,
	*::after{
		animation-duration:.01ms !important;
		animation-iteration-count:1 !important;
		scroll-behavior:auto !important;
		transition-duration:.01ms !important;
	}
}

@media(max-width:980px){
	.nav-links,
	.nav-right{
		display:none;
	}

	.hbg{
		display:flex;
	}

	.hero{
		min-height:auto;
		padding:124px 0 70px;
	}

	.hero .wrap,
	.showcase-panel,
	.work-head,
	.work-showcase,
	.planning-card{
		grid-template-columns:1fr;
	}

	.hero-left{
		max-width:none;
	}

	.mockups{
		min-height:500px;
		max-width:620px;
		width:100%;
		margin:auto;
	}

	.feat-grid,
	.pricing-grid,
	.work-grid{
		grid-template-columns:1fr;
	}

	.work-showcase{
		gap:18px;
	}

	.work-screen-main{
		transform:none;
	}

	.price-card.featured{
		transform:none;
	}

	.features,
	.showcase,
	.work,
	.pricing,
	.faq{
	background-attachment:scroll;
	}
}

@media(max-width:640px){
	.wrap,
	.nav-inner{
		width:min(100% - 28px,1140px);
	}

	.hero{
		padding-top:112px;
	}

	.hero h1{
		line-height:1.02;
	}

	.hero-btns,
	.cta-btns{
		display:grid;
	}

	.hero-stats{
		grid-template-columns:1fr;
	}

	.mockups{
		min-height:390px;
	}

	.mc-main{
		width:82%;
		top:16%;
	}

	.mc-top{
		width:52%;
	}

	.mc-bot{
		width:52%;
		right:0;
	}

	.metric-chip{
		min-width:118px;
		padding:10px 12px;
	}

	.chip-b{
		top:auto;
		bottom:8%;
	}

	.features,
	.showcase,
	.work,
	.pricing,
	.faq,
	.cta{
		padding:72px 0;
	}

	.feat-card,
	.price-card,
	.showcase-panel,
	.work-showcase{
		padding:22px;
	}

	.work-card{
		padding:14px;
	}

	.work-screen img{
		aspect-ratio:1.2/1;
	}

	.lumoda-stack,
	.multi-screen{
		grid-template-columns:1fr;
	}

	.lumoda-stack img:first-child{
		grid-row:auto;
	}

	.auth-modal{
		padding:44px 22px 28px;
		background-size:auto, 210px auto, auto;
	}

	.ft-bot{
		display:grid;
	}
}
/* ================================================
   PASTE THIS ENTIRE BLOCK AT THE BOTTOM OF
   YOUR EXISTING styles.css FILE
   ================================================ */


/* ---- TRUST BAR ---- */

.trust{
  padding:48px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(135deg,rgba(255,255,255,.88),rgba(255,248,238,.82)),
    #FFFCF7;
}

.trust-label{
  text-align:center;
  font-size:.82rem;
  font-weight:800;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:28px;
}

.trust-logos{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:center;
  gap:16px;
}

.trust-client{
  min-height:182px;
  display:grid;
  justify-items:center;
  align-content:center;
  gap:10px;
  padding:20px 18px;
  border:1px solid rgba(230,221,207,.82);
  border-radius:8px;
  background:rgba(255,255,255,.72);
  box-shadow:0 14px 34px rgba(22,25,31,.05);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.trust-client:hover{
  transform:translateY(-4px);
  border-color:rgba(232,130,12,.28);
  box-shadow:0 20px 44px rgba(22,25,31,.09);
}

.client-logo-wrap{
  width:132px;
  height:88px;
  border-radius:8px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 8px 24px rgba(22,25,31,.06);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.client-logo-wrap img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:9px;
}

.client-initials{
  width:64px;
  height:64px;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Syne',sans-serif;
  font-size:1.2rem;
  font-weight:800;
}

.client-initials.ci-amber{
  background:rgba(232,130,12,.12);
  color:#B85F05;
}

.client-initials.ci-green{
  background:rgba(22,139,114,.12);
  color:#0F6E56;
}

.client-initials.ci-blue{
  background:rgba(70,103,232,.12);
  color:#2c4db5;
}

.trust-client span{
  font-size:.96rem;
  font-weight:800;
  color:#44505C;
  text-align:center;
}

.trust-client small{
  padding:5px 10px;
  border-radius:999px;
  background:#F7FAF9;
  border:1px solid rgba(22,139,114,.12);
  color:var(--muted);
  font-size:.76rem;
  font-weight:800;
  text-align:center;
}

@media(max-width:820px){
  .trust-logos{ grid-template-columns:1fr; }
  .trust-client{
    min-height:0;
    grid-template-columns:132px minmax(0,1fr);
    justify-items:start;
    align-items:center;
    text-align:left;
  }
  .trust-client span,
  .trust-client small{
    grid-column:2;
  }
  .client-logo-wrap{
    grid-row:1 / span 2;
  }
}

@media(max-width:640px){
  .trust{ padding:36px 0; }
  .trust-label{ margin-bottom:18px; }
  .trust-client{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
    padding:18px;
  }
  .trust-client span,
  .trust-client small,
  .client-logo-wrap{
    grid-column:auto;
    grid-row:auto;
  }
  .client-logo-wrap{
    width:min(172px,100%);
    height:92px;
  }
}


/* ---- PROBLEM SECTION ---- */

.problem{
  padding:104px 0;
  background:#fff;
}

.problem-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
  margin-top:14px;
}

.problem-card{
  position:relative;
  min-height:260px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:28px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.54);
  background:#151A20;
  box-shadow:0 18px 44px rgba(22,25,31,.09);
  overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.problem-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:var(--problem-image) center / cover;
  transform:scale(1.04);
  transition:transform .35s ease;
}

.problem-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(15,20,26,.08),rgba(15,20,26,.82));
}

.problem-card > *{
  position:relative;
  z-index:1;
}

.problem-card:hover{
  transform:translateY(-5px);
  border-color:rgba(232,130,12,.28);
  box-shadow:0 24px 58px rgba(22,25,31,.16);
}

.problem-card:hover::before{
  transform:scale(1.1);
}

.problem-card h3{
  font-size:1.12rem;
  margin-bottom:10px;
  line-height:1.3;
  color:#fff;
}

.problem-card p{
  color:rgba(255,255,255,.82);
  line-height:1.7;
  font-size:.96rem;
}

.problem-analysis-one{ --problem-image:url("analysis1.jpg"); }
.problem-accounting-one{ --problem-image:url("accounting1.jpg"); }
.problem-accounting-two{ --problem-image:url("accounting2.jpg"); }
.problem-analysis-two{ --problem-image:url("analysis3.jpg"); }

.problem-cta{
  margin-top:48px;
  display:flex;
  align-items:center;
  gap:28px;
  flex-wrap:wrap;
  padding:28px 32px;
  border-radius:8px;
  background:linear-gradient(135deg,rgba(22,139,114,.05),rgba(232,130,12,.06));
  border:1px solid rgba(22,139,114,.14);
}

.problem-cta p{
  flex:1;
  min-width:240px;
  color:#2D3640;
  font-size:1.04rem;
  line-height:1.65;
  font-weight:500;
  margin:0;
}

@media(max-width:720px){
  .problem-grid{ grid-template-columns:1fr; }
  .problem-cta{ flex-direction:column; text-align:center; }
  .problem-cta .btn{ width:100%; }
}


/* ---- HOW IT WORKS ---- */

.how{
  padding:104px 0;
  background:
    linear-gradient(135deg,rgba(248,251,250,.96),rgba(255,248,238,.9)),
    url("warehouse.jpg") right center / min(680px,52vw) auto no-repeat;
}

.how-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:28px;
}

.how-card{
  min-height:260px;
  padding:28px;
  border-radius:8px;
  border:1px solid rgba(230,221,207,.86);
  background:rgba(255,255,255,.84);
  box-shadow:0 16px 38px rgba(22,25,31,.06);
  backdrop-filter:blur(14px);
}

.how-card span{
  display:inline-flex;
  width:44px;
  height:44px;
  align-items:center;
  justify-content:center;
  margin-bottom:42px;
  border-radius:8px;
  background:#EEF8F4;
  color:#126f5d;
  font-family:'Syne',sans-serif;
  font-weight:800;
}

.how-card h3{
  margin-bottom:12px;
  font-size:1.18rem;
}

.how-card p{
  color:var(--muted);
  line-height:1.7;
}


/* ---- MODULE TOUR ---- */

.module-tour{
  margin:28px 0 22px;
  border:1px solid var(--line);
  border-radius:8px;
  background:rgba(255,255,255,.88);
  box-shadow:var(--shadow);
  overflow:hidden;
}

.module-tabs{
  display:flex;
  gap:8px;
  padding:12px;
  border-bottom:1px solid var(--line);
  overflow-x:auto;
}

.module-tab{
  min-height:42px;
  padding:10px 16px;
  border:1px solid rgba(230,221,207,.9);
  border-radius:999px;
  background:#fff;
  color:#44505C;
  font:inherit;
  font-weight:800;
  cursor:pointer;
  white-space:nowrap;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}

.module-tab.active,
.module-tab:hover{
  background:#EEF8F4;
  color:#126f5d;
  border-color:rgba(22,139,114,.24);
}

.module-preview{
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:24px;
  align-items:center;
  padding:24px;
}

.module-copy h3{
  margin:18px 0 12px;
  font-size:clamp(1.5rem,3vw,2.35rem);
  line-height:1.08;
}

.module-copy p{
  color:var(--muted);
  line-height:1.7;
}

.module-screen{
  overflow:hidden;
  border-radius:8px;
  border:1px solid var(--line);
  background:#fff;
  box-shadow:0 18px 46px rgba(22,25,31,.1);
}

.module-screen img{
  aspect-ratio:16/10;
  height:100%;
  object-fit:cover;
  object-position:center;
}


/* ---- ONBOARDING ---- */

.onboarding{
  padding:104px 0;
  background:
    linear-gradient(135deg,rgba(17,22,29,.9),rgba(22,139,114,.78)),
    url("accounting2.jpg") center / cover;
  color:#fff;
}

.onboarding-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,420px);
  gap:34px;
  align-items:center;
  padding:34px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:8px;
  background:rgba(17,22,29,.48);
  box-shadow:0 24px 70px rgba(0,0,0,.18);
  backdrop-filter:blur(14px);
}

.onboarding-panel .label{
  background:rgba(255,255,255,.12);
  color:#DDF6ED;
  border-color:rgba(255,255,255,.16);
}

.onboarding-panel h2{
  max-width:680px;
  margin:18px 0 14px;
  font-size:clamp(2rem,4vw,3.2rem);
  line-height:1.05;
}

.onboarding-panel p{
  max-width:660px;
  color:rgba(255,255,255,.74);
  line-height:1.75;
}

.onboarding-list{
  display:grid;
  gap:12px;
  padding:0;
  margin:0;
  list-style:none;
}

.onboarding-list li{
  padding:14px 16px;
  border-radius:8px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.14);
  font-weight:800;
}


/* ---- WHATSAPP ---- */

.whatsapp-float{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:900;
  min-height:52px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:9px 14px 9px 9px;
  border-radius:999px;
  background:#168B72;
  color:#fff;
  box-shadow:0 18px 42px rgba(22,139,114,.32);
  font-weight:900;
}

.whatsapp-float span{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  font-size:.78rem;
  letter-spacing:0;
}

.whatsapp-float:hover{
  transform:translateY(-2px);
}

@media(max-width:860px){
  .how-grid,
  .module-preview,
  .onboarding-panel{
    grid-template-columns:1fr;
  }
}

@media(max-width:640px){
  .how,
  .onboarding{
    padding:76px 0;
    background-attachment:scroll;
  }

  .how-card{
    min-height:0;
  }

  .how-card span{
    margin-bottom:24px;
  }

  .module-preview,
  .onboarding-panel{
    padding:18px;
  }

  .whatsapp-float{
    right:14px;
    bottom:14px;
  }
}


/* ---- FAQ ACCORDION ---- */

/* Remove the old feat-grid layout the FAQ used */
.faq .feat-grid{ display:none; }

.faq-list{
  max-width:780px;
  margin:0 auto;
  border-radius:8px;
  border:1px solid var(--line);
  overflow:hidden;
  background:#fff;
}

.faq-item{
  border-bottom:1px solid var(--line);
}

.faq-item:last-child{
  border-bottom:none;
}

.faq-q{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:22px 24px;
  border:none;
  background:transparent;
  font-family:'DM Sans',sans-serif;
  font-weight:700;
  font-size:1rem;
  color:var(--ink);
  text-align:left;
  cursor:pointer;
  transition:background .15s ease, color .15s ease;
}

.faq-q:hover,
.faq-q[aria-expanded="true"]{
  background:#FFFAF3;
  color:var(--amber-dark);
}

.faq-chevron{
  width:22px;
  height:22px;
  border-radius:50%;
  background:rgba(232,130,12,.12);
  flex-shrink:0;
  position:relative;
  transition:background .15s ease;
}

/* "+" bar — horizontal */
.faq-chevron::before{
  content:"";
  position:absolute;
  width:10px;
  height:2px;
  top:10px;
  left:6px;
  background:var(--amber-dark);
  border-radius:2px;
}

/* "+" bar — vertical, fades out when open */
.faq-chevron::after{
  content:"";
  position:absolute;
  width:2px;
  height:10px;
  top:6px;
  left:10px;
  background:var(--amber-dark);
  border-radius:2px;
  transition:transform .25s ease, opacity .25s ease;
}

.faq-q[aria-expanded="true"] .faq-chevron::after{
  transform:rotate(90deg);
  opacity:0;
}

.faq-q[aria-expanded="true"] .faq-chevron{
  background:rgba(232,130,12,.22);
}

.faq-a{
  padding:0 24px 22px;
  animation:faqSlide .2s ease;
}

.faq-a p{
  color:var(--muted);
  line-height:1.75;
  margin:0;
}

.faq-a a{
  color:var(--amber-dark);
  text-decoration:underline;
  font-weight:700;
}

@keyframes faqSlide{
  from{ opacity:0; transform:translateY(-6px); }
  to{ opacity:1; transform:translateY(0); }
}

@media(max-width:640px){
  .faq-q{ padding:18px; font-size:.95rem; }
  .faq-a{ padding:0 18px 18px; }
}


/* ---- FOOTER EXPANSION ---- */

/* Override the original footer padding since ft-top handles it */
footer{
  padding:0 !important;
}

.ft-top{
  display:grid;
  grid-template-columns:minmax(200px,.45fr) minmax(0,1fr);
  gap:48px;
  padding:52px 0 36px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.ft-brand p{
  margin-top:14px;
  font-size:.9rem;
  line-height:1.65;
  color:rgba(255,255,255,.45);
  max-width:220px;
}

.ft-logo{
  color:rgba(255,255,255,.88);
}

.ft-logo .logo-mark{
  background:rgba(255,255,255,.1);
  box-shadow:none;
}

.ft-links{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}

.ft-col h4{
  font-family:'DM Sans',sans-serif;
  font-size:.78rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:rgba(255,255,255,.38);
  margin-bottom:14px;
}

.ft-col ul{
  list-style:none;
  display:grid;
  gap:10px;
  padding:0;
  margin:0;
}

.ft-col a{
  font-size:.9rem;
  color:rgba(255,255,255,.58);
  transition:color .2s ease;
}

.ft-col a:hover{
  color:#fff;
}

.ft-bot{
  padding:22px 0 8px;
  display:flex;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}

@media(max-width:840px){
  .ft-top{
    grid-template-columns:1fr;
    gap:28px;
    padding:36px 0 24px;
  }
  .ft-links{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:480px){
  .ft-links{ grid-template-columns:1fr; }
}


/* ---- SEC-NOTE ---- */
.sec-note{
  margin-bottom:28px;
  color:var(--muted);
  font-size:.96rem;
}
.sec-note strong{
  color:var(--ink);
}