/**********************************************************
// Block >> Example
**********************************************************/
.Glossary-Container {
	display: flex;
	gap: 2rem;
	align-items: flex-start;
}

.Glossary-Sidebar {
	width: 250px;
	top: 2rem;
}

.Glossary-Sidebar ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.Glossary-Sidebar li {
	margin: 15px 0;
}

.Glossary-Sidebar a {
	text-decoration: none;
	color: var(--Green);
	font-size: .9rem;
	text-transform: uppercase;
	font-family: var(--Westmount);
	letter-spacing: 2px;
	font-weight: bold;
	line-height: 1.5em;
	display: block;
}

.Glossary-Toggle {
	display: none;
}

.Glossary-Content {
	flex: 1;
}

.Glossary-Content h3 {
	scroll-margin-top: 200px; /* adjust if you have sticky headers */
	padding-bottom: 0;
	padding-top: 160px;
	margin-top: -140px;
}

html {
	scroll-behavior: smooth;
}


/**********************************************************
// Media Queries
**********************************************************/
@media
all and (max-width: 768px),
all and (max-device-width: 768px)
{
	.Glossary-Container {
		display: block;
	}

	.Glossary-Sidebar {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #fff;
		padding: 2rem;
		overflow-y: auto;
		z-index: 9999;
		transform: translateY(-100%);
		transition: transform 0.3s ease;
	}

	.Glossary-Sidebar.Open {
		transform: translateY(0);
	}

	.Glossary-Sidebar nav ul {
		padding-top: 100px;
	}

	.Glossary-Toggle {
		display: inline-block;
		background: var(--Green);
		width: 100%;
		text-transform: uppercase;
		letter-spacing: 2px;
		font-weight: bold;
		font-family: var(--Westmount);
		color: #fff;
		padding: 0.5rem 1rem;
		font-size: 1rem;
		border: none;
		border-radius: 4px;
		cursor: pointer;
		margin-bottom: 1rem;
	}

}
