.grado-cc {
	position: fixed;
	left: 50%;
	top: 100%;
	transform: translate(-50%, calc(var(--space-m-l) * -1 - 100%)) !important;
	z-index: 999999;
	max-width: 18em;
	min-width: auto;
	width: calc(100% - var(--space-m-l) * 2);
	display: none;
	font-family: 'Montserrat', system-ui, -apple-system, sans-serif;
}
.grado-cc.is-open { display: block; }
.grado-cc__panel {
	background-color: rgb(254, 254, 250);
	color: #2b2a27;
	font-weight: 400;
	line-height: 1.5;
	text-align: center;
	border-radius: var(--space-xs-s);
	box-shadow: 0 0 1.2em -0.8em rgba(0, 0, 0, 0.71);
	padding: var(--space-s-m);
}
.grado-cc__body {
	font-size: var(--step--1);
	color: #2b2a27;
	margin: 0 0 1rem;
}
.grado-cc__body a {
	color: #2b2a27;
	text-decoration: underline;
}
.grado-cc__actions {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.grado-cc-list { margin: 1.5rem 0; overflow-x: auto; }
.grado-cc-list__cat {
	font-family: 'Cormorant', serif;
	font-size: 1.5rem;
	color: #2b2a27;
	margin: 1.5rem 0 0.25rem;
}
.grado-cc-list__desc {
	color: #555;
	font-size: 0.9rem;
	margin: 0 0 0.75rem;
}
.grado-cc-list__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.85rem;
	margin: 0 0 1rem;
}
.grado-cc-list__table th,
.grado-cc-list__table td {
	text-align: left;
	padding: 0.5rem 0.75rem;
	border-bottom: 1px solid #e5e0d8;
	vertical-align: top;
}
.grado-cc-list__table th {
	background: #f6f3ee;
	color: #2b2a27;
	font-weight: 700;
}
.grado-cc-list__table code {
	background: #f6f3ee;
	padding: 0.1rem 0.3rem;
	border-radius: 3px;
	font-size: 0.8rem;
}
@media (max-width: 40em) {
	.grado-cc {
		top: 50%;
		transform: translate(-50%, -50%) !important;
	}
}