/*==================================================
J-Tech UI Framework
Version: 1.0.0
==================================================*/


/*==================================================
Variables
==================================================*/

:root{

	--jtr-primary:#d90429;
	--jtr-primary-dark:#9d0208;

	--jtr-success:#16a34a;
	--jtr-warning:#f59e0b;
	--jtr-danger:#dc2626;

	--jtr-white:#ffffff;

	--jtr-bg:#f7f8fa;

	--jtr-text:#1f2937;

	--jtr-text-light:#6b7280;

	--jtr-border:#ececec;

	--jtr-radius:20px;

	--jtr-shadow:0 12px 30px rgba(0,0,0,.08);

	--jtr-transition:.30s ease;

}


/*==================================================
Reset
==================================================*/

*{

	margin:0;

	padding:0;

	box-sizing:border-box;

}


/*==================================================
Body
==================================================*/

body{

	background:var(--jtr-bg);

	color:var(--jtr-text);

	font-family:Inter,Arial,sans-serif;

	font-size:15px;

	line-height:1.6;

}


/*==================================================
Links
==================================================*/

a{

	text-decoration:none;

	color:inherit;

	transition:var(--jtr-transition);

}


/*==================================================
Images
==================================================*/

img{

	max-width:100%;

	height:auto;

	display:block;

}


/*==================================================
Containers
==================================================*/

.jtr-container{

	width:100%;

	max-width:1300px;

	margin:auto;

}


/*==================================================
Cards
==================================================*/

.jtr-card{

	background:var(--jtr-white);

	border-radius:var(--jtr-radius);

	box-shadow:var(--jtr-shadow);

	border:1px solid var(--jtr-border);

}


/*==================================================
Flex
==================================================*/

.jtr-flex{

	display:flex;

}

.jtr-align-center{

	align-items:center;

}

.jtr-justify-between{

	justify-content:space-between;

}


/*==================================================
Spacing
==================================================*/

.jtr-mt-20{

	margin-top:20px;

}

.jtr-mb-20{

	margin-bottom:20px;

}

.jtr-p-20{

	padding:20px;

}


/*==================================================
Animation
==================================================*/

.jtr-fade{

	animation:jtrFade .5s ease;

}

@keyframes jtrFade{

	from{

		opacity:0;

		transform:translateY(15px);

	}

	to{

		opacity:1;

		transform:translateY(0);

	}

}