:root {
  --comp-temp-n1: #2f2f2f;
  --comp-temp-n2: #545454;
  --comp-temp-n5: #d7d7d7;
  --comp-temp-n7: #f4f4f4;
  --comp-temp-white: #fff;
  --comp-temp-container: 1320px;
  --comp-temp-pad-x: 60px;
  --comp-temp-radius-lg: 32px;
}
@media screen and (max-width: 1099px) {
  :root {
    --comp-temp-pad-x: 32px;
  }
}
@media screen and (max-width: 767px) {
  :root {
    --comp-temp-pad-x: 15px;
    --comp-temp-radius-lg: 24px;
  }
}
.comp-temp-use-cases {
	position: relative;
	z-index: 1;
	max-width: 1440px;
	margin: 0 auto;
	padding: 100px var(--comp-temp-pad-x);
	background: var(--comp-temp-white);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 56px;
}

@media screen and (max-width: 1099px) {
	.comp-temp-use-cases {
		padding-top: 80px;
		padding-bottom: 80px;
	}
}

@media screen and (max-width: 767px) {
	.comp-temp-use-cases {
		padding-top: 64px;
		padding-bottom: 64px;
		gap: 40px;
	}
}

.comp-temp-use-cases__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	width: 100%;
	text-align: center;
    padding: 0 66px;
}

.comp-temp-use-cases__title {
	margin: 0;
	font-size: 38px;
	font-weight: 600;
	line-height: 44px;
	color: var(--comp-temp-n1) !important;
    letter-spacing: -0.005em;
}
@media screen and (max-width: 1023.98px) {
	.comp-temp-use-cases__header{
		padding: 0;
	}
}
@media screen and (max-width: 767px) {
	.comp-temp-use-cases__title {
		font-size: 28px;
		line-height: 36px;
		padding: 0 10px;
	}

	.comp-temp-use-cases__title br {
		display: none;
	}
}

.comp-temp-use-cases__intro {
	margin: 0;
	max-width: 1000px;
	font-size: 18px;
	line-height: 28px;
	color: var(--comp-temp-n2);
}

@media screen and (max-width: 1099px) {
	.comp-temp-use-cases__intro {
		max-width: 100%;
	}
}

@media screen and (max-width: 767px) {
	.comp-temp-use-cases__intro {
		font-size: 16px;
		line-height: 24px;
	}
}

.comp-temp-use-cases__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
	width: 100%;
	max-width: var(--comp-temp-container);
}

@media screen and (max-width: 1099px) {
	.comp-temp-use-cases__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media screen and (max-width: 767px) {
	.comp-temp-use-cases__grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}
}

.comp-temp-use-cases__card {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 32px 30px 30px 32px;
	background: var(--comp-temp-n7);
	border: 1px solid var(--comp-temp-n5);
	border-radius: var(--comp-temp-radius-lg);
	overflow: hidden;
}

.comp-temp-use-cases__card-top {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.comp-temp-use-cases__card-head {
	display: flex;
	align-items: center;
	gap: 16px;
    min-height: 56px;
}

.comp-temp-use-cases__card-icon {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
}

.comp-temp-use-cases__card-title {
	margin: 0;
	flex: 1;
	font-size: 18px !important;
	font-weight: 600;
	line-height: 28px;
	color: var(--comp-temp-n1);
	text-transform: none;
}

.comp-temp-use-cases__card-desc {
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	color: var(--comp-temp-n1);
    min-height: 72px;
}

.comp-temp-use-cases__bullets {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.comp-temp-use-cases__bullet {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.comp-temp-use-cases__bullet-icon {
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	margin-top: -1px;
}

.comp-temp-use-cases__bullet p {
	margin: 0;
	flex: 1;
	font-size: 13px;
	line-height: 18px;
	color: var(--comp-temp-n1);
    letter-spacing: -0.003em;
}

.comp-temp-use-cases__bullet strong {
	font-weight: 600;
}
@media screen and (max-width: 1023.98px) {
	.comp-temp-use-cases__card-desc{
		min-height: 48px;
	}
}
@media screen and (max-width: 767.98px) {
	.comp-temp-use-cases__card{
		border-radius: 32px;
	}
}