/* this is css file for colors content, only Pedro use this file */
/* this is the css file for colors content, only Pedro use this file */

/*SECTION TITLE*/
.p_section-title {
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	font-size: 32px;
	color: #3b118d;
	text-align: center;
	margin-bottom: 20px;
}

/*COLOR BOX*/
.p_color-box-group {
	background-color: #fff;
	border: 1px solid #d9d9e0;
	border-radius: 10px;
	padding: 20px;
	margin-bottom: 30px;
}

.p_color-box-group h2 {
	font-family: "Poppins", sans-serif;
	font-weight: 600;
	font-size: 18px;
	color: #1a1625;
	margin-bottom: 15px;
}

/*COLOR GRID*/
.p_color-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 16px;
}

.p_color-item {
	text-align: center;
	font-family: "Poppins", sans-serif;
}

/*COLOR SQUARE*/
.p_swatch {
	width: 100%;
	height: 100px;
	border-radius: 8px;
	border: 1px solid #ccc;
	margin-bottom: 8px;
}

/*TEXTS*/
.p_color-name {
	font-weight: 600;
	font-size: 15px;
	color: #1a1625;
}

.p_color-hex {
	font-family: monospace;
	font-size: 13px;
	color: #4a4a6a;
}

.p_color-desc {
	font-size: 12px;
	color: #4a4a6a;
	margin-top: 4px;
}