/* ---------- Info cards section (plugin: InfoCardsPlugin) ---------- */

.icards-section {
	padding: var(--s12) 0;
	position: relative;
	background: var(--color-surface);
}

.icards-section .container {
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 var(--s3);
}

.icards-section .section-head {
	margin: 0 auto var(--s8);
	text-align: center;
}

.icards-section .section-head .kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 800;
	font-size: .82rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--orange);
	margin-bottom: var(--s2);
}

.icards-section .kicker .dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--yellow);
	display: inline-block;
}

.icards-section .section-head h2 {
	font-family: var(--font-display);
	font-size: clamp(1.8rem, 3.6vw, 2.6rem);
	line-height: 1.15;
	margin: 0 0 var(--s2);
	color: var(--color-text);
}

.icards-section .section-head p {
	color: var(--color-text-muted);
	font-size: 1.06rem;
	max-width: 640px;
	margin: 0 auto;
}

/* ---------- Layouts ---------- */

.icards--small {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--s3);
	align-items: stretch;
}

.icards--big {
	display: flex;
	flex-direction: column;
	max-width: 920px;
	margin: 0 auto;
}

.icards--small-centered {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--s3);
	align-items: stretch;
}

/* ---------- Shared: tags ---------- */

.icards .pill-row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: var(--s1);
}

.icards .pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border-radius: 999px;
	padding: 6px 13px;
	font-size: .85rem;
	font-weight: 700;
}

.icards .pill i[class^="icon-"] {
	font-size: 14px;
	line-height: 1;
}

.icards .pill--mint {
	background: var(--mint-soft);
	color: #2C7A52;
}

.icards .pill--yellow {
	background: var(--yellow-soft);
	color: #8a6d00;
}

.icards .pill--pink {
	background: var(--pink-soft);
	color: #B83D63;
}

.icards .pill--orange {
	background: var(--orange-soft);
	color: #B05E00;
}

.icards .pill--slate {
	background: #E8ECEF;
	color: var(--slate);
}

/* ---------- Small card ---------- */

.icard {
	background: var(--color-surface);
	border-radius: var(--r-lg);
	border: 1px solid var(--color-border);
	box-shadow: var(--shadow-sm);
	padding: var(--s3) var(--s3);
	display: flex;
	flex-direction: column;
	gap: 6px;
	transition: transform .25s cubic-bezier(.34, 1.56, .64, 1), box-shadow .25s ease;
}

.icard:hover {
	transform: translateY(-6px);
	box-shadow: var(--shadow-lg);
}

.icard .ico {
	width: 56px;
	height: 56px;
	border-radius: 20px;
	display: grid;
	place-items: center;
	margin-bottom: 10px;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.5rem;
}

.icard .ico i[class^="icon-"] {
	font-size: 26px;
	line-height: 1;
	font-weight: 300;
}

/* small card accents: soft background + strong icon color */
.icard--yellow .ico {
	background: var(--yellow-soft);
	color: #C9A227;
}

.icard--mint .ico {
	background: var(--mint-soft);
	color: #2C7A52;
}

.icard--pink .ico {
	background: var(--pink-soft);
	color: #B83D63;
}

.icard--orange .ico {
	background: var(--orange-soft);
	color: #B05E00;
}

.icard--slate .ico {
	background: #E8ECEF;
	color: var(--slate);
}

.icard h3 {
	font-family: var(--font-display);
	font-size: 1.35rem;
	margin: 0;
	color: var(--color-text);
}

.icard p {
	color: var(--color-text-muted);
	font-size: .98rem;
	margin: 0;
	flex: 1;
}

/* rich-text description wrapper (inner <p> keep the .icard p / .icard-big p styles) */
.icard .icard-desc {
	flex: 1;
}

.icard .icard-desc p:empty::before {
    content: "\00a0"; /* Injects an invisible non-breaking space */
}

.icard-desc a {
	color: var(--orange);
	font-weight: 700;
	text-decoration: none;
}

.icard-desc a[href^="mailto:"] {
	color: var(--slate-80);
	margin: var(--s4) 0;
}

.icard-desc a:hover {
	text-decoration: underline;
}

/* ---------- Small card, centered variant (4 per row) ---------- */

.icard--centered {
	align-items: center;
	text-align: center;
	padding: var(--s4) var(--s3);
}

.icard--centered .ico {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	margin: 0 auto 10px;
}

.icard--centered h3 {
	font-size: clamp(1.1rem, 1.4vw, 1.3rem);
	margin: 0 0 var(--s1);
}

.icard--centered .ico i[class^="icon-"] {
	font-size: 25px;
}

.icard--centered .pill-row {
	justify-content: center;
}

/* ---------- Big card ---------- */

.icard-big {
	display: grid;
	grid-template-columns: 100px 1fr;
	gap: var(--s4);
	background: #fff;
	border-radius: var(--r-lg);
	border: 1px solid var(--color-border);
	padding: var(--s4);
	margin-bottom: var(--s3);
	box-shadow: var(--shadow-sm);
	scroll-margin-top: 100px;
}

.icard-big .letter {
	width: 84px;
	height: 84px;
	border-radius: 26px;
	display: grid;
	place-items: center;
	font-family: var(--font-display);
	font-size: 2.4rem;
	font-weight: 700;
	color: var(--slate);
}

.icard-big .letter i[class^="icon-"] {
	font-size: 38px;
	line-height: 1;
}

/* big card accents: solid background */
.icard-big--yellow .letter {
	background: var(--yellow);
}

.icard-big--mint .letter {
	background: var(--mint);
}

.icard-big--pink .letter {
	background: var(--pink);
}

.icard-big--orange .letter {
	background: var(--orange);
}

.icard-big--slate .letter {
	background: var(--gray);
}

.icard-big h3 {
	font-family: var(--font-display);
	font-size: 1.5rem;
	margin: 0 0 var(--s1);
	color: var(--color-text);
}

.icard-big h3 small {
	display: block;
	font-size: .9rem;
	color: var(--color-text-muted);
	font-family: var(--font-body);
	font-weight: 700;
}

.icard-big p {
	color: var(--slate-80);
	margin: 1.2rem 0;
	line-height: 1.65;
	font-size: clamp(0.875rem, 0.8068rem + 0.3409vw, 1.0625rem);
}

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
	.icards--small {
		grid-template-columns: 1fr;
	}

	.icards--small-centered {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px) {
	.icards--small-centered {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 640px) {
	.icard-big {
		grid-template-columns: 1fr;
	}
}