/* ==========================================
   Economic Trends Section
========================================== */

.trends {
	position: relative;
	overflow: hidden;
	/* background: #f2f4f7; */
	padding-block: 160px;
}

/* Background Image */

.trends-bg {
	position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    width: 82%;
    left: 26%;
}

.trends-bg img {
	width: 90%;
    height: 90%;
    object-fit: contain;
    object-position: left;
    display: block;
}

/* Content */

.trends .container {
	position: relative;
	z-index: 2;
}

.trends-content {
	position: relative;
	z-index: 2;
}

.trends-eyebrow {
	display: inline-block;
	color: var(--secondary-color);
	font-weight: 600;
	margin-bottom: 0px;
}

.trends-content h2 {
	margin-bottom: 40px;
	max-width: 760px;
}

.trends-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.trends-list li {
	display: flex;
	align-items: center;
	gap: 16px;
}

.trends-list li:not(:last-child) {
	margin-bottom: 25px;
}

.trends-text {
	color: var(--primary-color);
	font-weight: 600;
	line-height: 1.5;
	font-family: var(--font-family-primary);
}

.trends-icon {
	width: 52px;
	height: 52px;
	min-width: 52px;
	border-radius: 50%;
	background-color: #e5eef5;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition:
		background-color 0.3s ease,
		transform 0.3s ease;
}

.trends-icon span {
	width: 48px;
	height: 48px;
	display: inline-block;
	flex-shrink: 0;
	background-position: center !important;
	background-repeat: no-repeat !important;
	background-size: contain !important;
}

.trends-icon .icon-message-circle {
	background: url('../images/Featured-icon.svg');
}

.trends-icon .icon-zap {
	background: url('../images/Featured-icon-2.svg');
}

.trends-icon .icon-chart-breakout {
	background: url('../images/Featured-icon-3.svg');
}

.trends .osep-primary-btn {
	margin-top: 25px;
}

/* ======================
   Max-width: 1499.98px
====================== */

@media (max-width: 1499.98px) {
	.trends-content h2 {
		margin-bottom: 40px;
	}

	.trends .osep-primary-btn {
		margin-top: 40px;
	}
	.trends {
    padding-block: 100px;
}
.trends-bg {
    width: 79%;
    left: 29%;
}
}

/* ======================
   Max-width: 1299.98px
====================== */

@media (max-width: 1299.98px) {
	.trends-content {
		max-width: 560px;
	}

	.trends-content h2 {
		margin-bottom: 36px;
	}
}

/* ======================
   Max-width: 1199.98px
====================== */

@media (max-width: 1199.98px) {
	.trends {
		padding-block: 60px;
	}
	.trends-list li:not(:last-child) {
    margin-bottom: 12px;
}
    .trends-content h2 {
        margin-bottom: 20px;
    }
	
	.trends-bg img{
		    object-position: unset;
	}
	.trends-bg {
        width: 70%;
        left: auto;
        opacity: 0.8;
        top: auto;
    }
	.trends-bg img {
    	width: 90%;
    	height: auto;
	}
}

/* ======================
   Max-width: 991.98px
====================== */

@media (max-width: 991.98px) {
	.trends-content {
		max-width: 100%;
	}

	.trends-content h2 {
		margin-bottom: 32px;
	}

	.trends .osep-primary-btn {
		margin-top: 32px;
	}

}

/* ======================
   Max-width: 767.98px
====================== */

@media (max-width: 767.98px) {
	.trends-eyebrow {
		margin-bottom: 12px;
	}

	.trends-content h2 {
		margin-bottom: 28px;
	}

	.trends-list li {
		gap: 14px;
	}

	.trends-icon {
		width: 52px;
		height: 52px;
		min-width: 52px;
	}

	.trends .osep-primary-btn {
		margin-top: 28px;
	}
	    .trends {
        padding-block: 40px;
    }
}

/* ======================
   Max-width: 567.98px
====================== */

@media (max-width: 567.98px) {
	.trends-content h2 {
		margin-bottom: 24px;
	}

	.trends-list li {
		gap: 12px;
		align-items: flex-start;
	}

	.trends-icon {
		width: 48px;
		height: 48px;
		min-width: 48px;
	}

	.trends-icon img {
		width: 20px;
		height: 20px;
	}

	.trends .osep-primary-btn {
		margin-top: 24px;
	}
}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {
	.trends * {
		transition: none !important;
		animation: none !important;
	}
}
