/* Typography */
:root{
	--bs-body-font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* Helpers */
.py-lg-6{ padding-top: 5rem !important; padding-bottom: 5rem !important; }
.bg-gradient{
	background: radial-gradient(1200px 600px at -10% -10%, rgba(13,110,253,.08), transparent 50%),
	            radial-gradient(1200px 600px at 110% -10%, rgba(13,110,253,.08), transparent 50%),
	            linear-gradient(#fff, #fff);
}
.brand-icon{
	width: 32px;
	height: 32px;
	background: var(--bs-primary-bg-subtle);
	color: var(--bs-primary);
}
.icon-lg{
	width: 48px;
	height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: .75rem;
	font-size: 1.25rem;
}
.avatar{
	width: 40px;
	height: 40px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
}

/* Cards */
.pricing-card{
	border: 1px solid var(--bs-border-color);
	border-radius: 1rem;
	background: #fff;
}
.pricing-card .pricing-card-body{
	padding: 1.5rem;
}
.pricing-card.featured{
	border-color: var(--bs-primary);
	box-shadow: 0 0.5rem 1rem rgba(13, 110, 253, .15);
}

/* UI Mockup */
.ui-mockup{
	border-radius: 1rem;
}

/* Footer links hover */
a.link-secondary:hover{
	color: var(--bs-primary) !important;
}

/* Category page: unify thumbnail sizes */
.category-grid .card-img-top{
	height: 220px;
	width: 100%;
	object-fit: cover;
}

/* Typography */
:root{
	--bs-body-font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* Helpers */
.py-lg-6{ padding-top: 5rem !important; padding-bottom: 5rem !important; }
.bg-gradient{
	background: radial-gradient(1200px 600px at -10% -10%, rgba(13,110,253,.08), transparent 50%),
	            radial-gradient(1200px 600px at 110% -10%, rgba(13,110,253,.08), transparent 50%),
	            linear-gradient(#fff, #fff);
}
.brand-icon{
	width: 32px;
	height: 32px;
	background: var(--bs-primary-bg-subtle);
	color: var(--bs-primary);
}
.icon-lg{
	width: 48px;
	height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: .75rem;
	font-size: 1.25rem;
}
.avatar{
	width: 40px;
	height: 40px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
}

/* Cards */
.pricing-card{
	border: 1px solid var(--bs-border-color);
	border-radius: 1rem;
	background: #fff;
}
.pricing-card .pricing-card-body{
	padding: 1.5rem;
}
.pricing-card.featured{
	border-color: var(--bs-primary);
	box-shadow: 0 0.5rem 1rem rgba(13, 110, 253, .15);
}

/* UI Mockup */
.ui-mockup{
	border-radius: 1rem;
}

/* Footer links hover */
a.link-secondary:hover{
	color: var(--bs-primary) !important;
}