.widget-heading {
    --font-brandon: modified-characters, brandon-grotesque, sans-serif;
	--font-roboto: modified-characters, roboto, sans-serif;
	--description-text-mobile: var(--font-weight-normal) var(--text-base) / var(--leading-normal) var(--font-body);
    --description-text-tablet: var(--font-weight-normal) var(--text-xl) / var(--leading-normal) var(--font-body);

	--font-display: var(--font-brandon);
	--font-body: var(--font-roboto);

	--font-weight-normal: 400;
	--font-weight-medium: 500;
	--font-weight-bold: 700;

    --leading-none: 1;
	--leading-tight: 1.25;
	--leading-snug: 1.375;
	--leading-normal: 1.5;
	--leading-relaxed: 1.625;
	--leading-loose: 2;

    width: 100%;
    padding: 0 var(--space-5);
    margin: 0 auto 30px;
	display: flex;
	flex-direction: column;
	align-items: flex-start; 
}

.widget-heading .inner {
	max-width: calc(var(--width-base) - 2 * var(--space-5));
	margin: 0 auto;
}

.widget-heading .title-cont {
	display: flex;
	flex-direction: column;
	align-items: baseline; 
	text-align: left;
}

.widget-heading .inner.center .title-cont {
	align-items: center;
	text-align: center;
}

.widget-heading .inner.center .button-default {
	align-self: center;
}

.widget-heading .inner .title {
	margin-bottom: 0;
}

.widget-heading .inner .title:has(+ .description) {
	margin-bottom: 20px;
}

.widget-heading .inner .title:has(+ .button-default) {
	margin-bottom: 40px;
}

.widget-heading .inner.center .title {
	text-align: center;
}

.widget-heading .inner .title.h1.roboto {
	font-family: var(--font-roboto);
	text-transform: none;
}

.widget-heading .description {
	font: var(--description-text-mobile);
	margin-bottom: 0;
}

.widget-heading .description:has(+ .button-default) {
	margin-bottom: 40px;
}

.widget-heading .inner.center .description {
	text-align: center;
}

/* Styles to accommodate blue background in the Virtual Tour panel */

.virtual-tour-cont .widget-heading .inner .title {
	color: var(--white);
}

.virtual-tour-cont .widget-heading .inner .button-link,
.virtual-tour-cont .widget-heading .inner .description {
	display: none;
}

:target {
	scroll-margin-top: 82px;
}

@media(min-width: 40em) {
	.widget-heading {
		margin-bottom: 40px;
		padding: 0 var(--space-20);
		max-width: var(--width-base);
	}

	.widget-heading .inner {
		max-width: var(--width-heading);
		margin: 0;
	}

	.widget-heading .inner.center {
		margin: 0 auto;
	}

	.widget-heading .description {
		font: var(--description-text-tablet);
	}
}

@media screen and (min-width: 64em) {
	.widget-heading {
		margin-bottom: 50px;
	}
}