.dgsaServiceSection {
	width: calc(100% - 6rem);
	margin: 1.5rem auto;
	display: grid;
	grid-template-columns: 90px 260px 1fr 35%;
	grid-template-areas: "icon intro content image";
	align-items: stretch;
	background: #ffffff;
	border: 1px solid #e4ebf3;
	border-radius: 1rem;
	overflow: hidden;
	box-shadow: 0 8px 30px rgba(6, 42, 92, 0.05);
}

/* =========================
   IKONA
========================= */

.dgsaServiceIcon {
	grid-area: icon;

	display: flex;
	align-items: center;
	justify-content: center;

	padding: 2rem 1rem;
}

.dgsaServiceIcon i {
	width: 72px;
	height: 72px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #f5f8fc;
	border: 1px solid #e5edf6;
	font-size: 2rem;
	color: #062a5c;
}

/* =========================
   TYTUŁ
========================= */

.dgsaServiceIntro {
	grid-area: intro;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 2rem 1.5rem;
	border-right: 1px solid #e5edf6;
}

.dgsaServiceIntro h2 {
	margin: 0 0 0.45rem 0;
	font-family: normalFont;
	font-size: 1.8rem;
	font-weight: 700;
	color: #062a5c;
}

.dgsaServiceIntro p {
	margin: 0;
	font-family: normalFont;
	font-size: 0.95rem;
	line-height: 1.5;
	color: #718096;
}

/* =========================
   TREŚĆ
========================= */

.dgsaServiceContent {
	grid-area: content;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 2rem 2.5rem;
}

.dgsaServiceContent > p {
	margin: 0 0 1.2rem 0;
	font-family: normalFont;
	font-size: 0.95rem;
	line-height: 1.65;
	color: #536276;
}

.dgsaServiceContent ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}

.dgsaServiceContent li {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	font-family: normalFont;
	font-size: 0.9rem;
	color: #40516a;
}

.dgsaServiceContent li i {
	width: 20px;
	height: 20px;

	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	border-radius: 50%;
	background: #f97316;
	color: #ffffff;
	font-size: 0.75rem;
	font-weight: bold;
}

/* =========================
   OBRAZ
========================= */

.dgsaServiceImage {
	grid-area: image;
	min-height: 260px;
	position: relative;
	overflow: hidden;
}

.dgsaServiceImage img {
	width: 100%;
	height: 100%;
	position: absolute;
	inset: 0;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.dgsaServiceSection:hover .dgsaServiceImage img {
	transform: scale(1.025);
}

/* =========================
   REVERSE
   zdjęcie | treść | ikona | temat
========================= */
/* =========================
   REVERSE
   zdjęcie | treść | temat+ikona
========================= */

.dgsaServiceSection.reverse {
	grid-template-columns: 35% 1fr 300px;
	grid-template-areas:
		"image content intro";
}

/* ikona trafia do tej samej kolumny co tytuł */
.dgsaServiceSection.reverse .dgsaServiceIcon {
	grid-area: intro;
	justify-content: flex-start;
	align-items: center;
	padding: 2rem 0 2rem 1.5rem;
	z-index: 2;
}

/* tytuł również w tej samej kolumnie */
.dgsaServiceSection.reverse .dgsaServiceIntro {
	grid-area: intro;
	padding: 2rem 1.5rem 2rem 6.5rem;
	border-right: none;
	border-left: 1px solid #e5edf6;
	z-index: 1;
}