/* ============================================================
   08-utilities.css — Ícones, dividers, grupos, unidades
   ============================================================ */

/* Ícones */
.icon { display: inline-block; font-size: 16px; line-height: 1; }
.icon::before { position: relative; display: inline-block; font-weight: 400; font-style: normal; }
.icon-sm { font-size: 20px; }
.icon-md { font-size: 1.5em; }
.icon-lg { font-size: 1.875em; }
.icon-circle { border-radius: 50%; }

.icon-modern {
	width: 2em; height: 2em;
	line-height: 2em;
	text-align: center;
	border-radius: 50%;
	border: 1px solid #d3d5db;
	color: #354879;
}

/* Dividers */
hr { margin-top: 0; margin-bottom: 0; border-top: 1px solid #d3d5db; }
.context-dark hr,
.bg-primary-darken hr { border-top-color: #74757f; }

.divider-small { font-size: 0; line-height: 0; }
.divider-small::after {
	content: '';
	display: inline-block;
	width: 70px; height: 2px;
	background-color: #354879;
}
.divider-small + h3,
.divider-small-outer + h3 { margin-top: 20px; }

/* Grupos inline */
html .group { margin-bottom: -15px; margin-left: -20px; }
html .group:empty { margin-bottom: 0; margin-left: 0; }
html .group > * { display: inline-block; margin: 0 0 15px 20px; }
* + .group { margin-top: 30px; }

/* Blocos centralizados */
.block-center, .block-sm, .block-lg { margin-left: auto; margin-right: auto; }
.block-sm { max-width: 560px; }
.block-lg { max-width: 768px; }