/* ── Cedar Springs Icon Text ─────────────────────────────────────────────── */
.wp-block-cedarspringsnw-icon-text {
	--icon-text-cols-desktop: 3;
	--icon-text-cols-tablet:  2;
	--icon-text-cols-mobile:  1;
	--icon-text-gap:          var(--wp--preset--spacing--2xl, 48px);

	width: 100%;
}

/* ── Grid ────────────────────────────────────────────────────────────────── */
.icon-text-grid {
	display:               grid;
	grid-template-columns: repeat( var(--icon-text-cols-desktop), 1fr );
	gap:                   var(--wp--preset--spacing--md);
}

/* ── Carousel ────────────────────────────────────────────────────────────── */
.icon-text-carousel {
	position: relative;
}

.icon-text-track-outer {
	overflow: hidden;
}

.icon-text-track {
	display:    flex;
	gap:        var(--wp--preset--spacing--md);
	transition: transform 0.4s ease;
}

.icon-text-track .icon-text-item {
	flex:        0 0 calc( 100% / var(--icon-text-cols-desktop) - var(--icon-text-gap) + var(--icon-text-gap) / var(--icon-text-cols-desktop) );
	min-width:   0;

}

.icon-text-btn {
	position:        absolute;
	top:             50%;
	transform:       translateY(-50%);
	background:      #fff;
	border:          1px solid #ddd;
	border-radius:   50%;
	width:           40px;
	height:          40px;
	display:         flex;
	align-items:     center;
	justify-content: center;
	font-size:       18px;
	cursor:          pointer;
	z-index:         2;
	box-shadow:      0 2px 8px rgba(0,0,0,0.1);
	transition:      background 0.2s, box-shadow 0.2s;
}

.icon-text-btn:hover {
	background:  #f0f0f0;
	box-shadow:  0 2px 12px rgba(0,0,0,0.15);
}

.icon-text-btn.is-prev { left:  -20px; }
.icon-text-btn.is-next { right: -20px; }

.icon-text-dots {
	display:         flex;
	justify-content: center;
	gap:             8px;
	margin-top:      20px;
}

.icon-text-dot {
	width:         8px;
	height:        8px;
	border-radius: 50%;
	background:    #ccc;
	border:        none;
	padding:       0;
	cursor:        pointer;
	transition:    background 0.2s;
}

.icon-text-dot.is-active {
	background: currentColor;
}

/* ── Item ────────────────────────────────────────────────────────────────── */
.icon-text-item {
	text-align: center;
	background-color: #F7F5EF;
	padding: 26px;
}

.icon-text-content {
	flex: 1;
	min-width: 0;
}

/* ── Icon position: Left ─────────────────────────────────────────────────── */
.icon-pos-left .icon-text-item {
	display:     flex;
	align-items: center;
	gap:         20px;
	text-align:  left;
}

.icon-pos-left .icon-text-icon {
	flex-shrink:   0;
	margin-bottom: 0;
}

.icon-text-icon {
	display:         flex;
	align-items:     center;
	justify-content: center;
	margin-bottom:   16px;
	font-size:       40px;
	line-height:     1;
	width: 36px;
	height: 36px;
}

.icon-text-icon img,
.icon-text-icon svg {
	width:      48px;
	height:     48px;
	object-fit: contain;
}

/* SVG pasted by user may carry its own width/height — force it to fill the wrapper */
.icon-text-svg-wrap svg,
.icon-text-icon > svg {
	width:    100% !important;
	height:   100% !important;
	display:  block;
}

.icon-text-heading {
	margin:      0px;
	font-size:   var(--wp--preset--font-size--body, 16px);
	font-weight: 600;
	line-height: 1.3;
	color: #5C6B62 !important;
}

.icon-text-body {
	margin:      0 0 14px;
	font-size:   var(--wp--preset--font-size--body, 16px);
	line-height: 1.65;
	color:       inherit;
}

.icon-text-link {
	display:         inline-block;
	font-size:       0.875rem;
	font-weight:     600;
	text-decoration: underline;
	color:           currentColor;
	transition:      opacity 0.2s;
}

.icon-text-link:hover {
	opacity: 0.75;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media ( max-width: 1024px ) {
	.icon-text-grid {
		grid-template-columns: repeat( var(--icon-text-cols-tablet), 1fr );
	}
	.icon-text-track .icon-text-item {
		flex-basis: calc( 100% / var(--icon-text-cols-tablet) - var(--icon-text-gap) + var(--icon-text-gap) / var(--icon-text-cols-tablet) );
	}
}

@media ( max-width: 600px ) {
	.icon-text-grid {
		grid-template-columns: repeat( var(--icon-text-cols-mobile), 1fr );
	}
	.icon-text-track .icon-text-item {
		flex-basis: calc( 100% / var(--icon-text-cols-mobile) - var(--icon-text-gap) + var(--icon-text-gap) / var(--icon-text-cols-mobile) );
	}
}