/**
 * TAG Strategies: components.
 *
 * One banner per component. Theme-owned markup uses .tgs- BEM with is-*
 * states; markup that stored content or a plugin prints keeps its own
 * classes (footer widget .site-footer--locations, Gravity Forms). Values
 * are the old theme's computed values (css-spec + computed-style probes of
 * the old pages at 390 / 768 / 1024 / 1440), mobile-first.
 *
 * Contents: Site header · Hamburger · Nav panel · Shine overlays · Footer ·
 * Footer locations widget · Page header · Article body · Post pager ·
 * Cards + post grid · Pagination · 404 · Holidays / chromeless · Marquee ·
 * CTA · Video promo · Video dialog · More / Less toggle · Gravity Forms.
 *
 * @package TGS
 */

/* ==========================================================================
   Site header
   ========================================================================== */

/*
 * Old: header#siteHeader.site-header.site-header--side (fixed). Below 992 a
 * bar: 13px + logo block (5.2px padding, 27px logo + 16px gap) + 1px, then a
 * 2px white rule; #1e2121 behind the PNG shine. From 992 a 160px black
 * column with a 2px white rule on the right, the logo 50px from the top and
 * the toggle centred.
 */
.tgs-site-header {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: var(--tgs-z-site-header);
	color: var(--white);
	background-color: var(--secondary);
	transition: background-color var(--tgs-transition);
}

.tgs-site-header--side {
	border-bottom: var(--tgs-rule);
}

.tgs-site-header__bar {
	position: relative;
	padding: 13px 12px var(--header-mobile-padding-bottom);
}

.tgs-site-header__logo {
	display: block;
	position: relative;
	z-index: var(--tgs-z-site-header);
	width: 1.6875rem;
	padding: 0.325rem 0;
	color: var(--white);
}

.tgs-site-header__logo svg {
	display: block;
	width: 100%;
	height: 1.6875rem;
	margin-bottom: 1rem;
}

.tgs-site-header--top .tgs-site-header__logo {
	margin-right: auto;
	margin-left: auto;
}

.tgs-site-header__toggle {
	position: absolute;
	top: 50%;
	right: 0;
	z-index: var(--tgs-z-site-header);
	transform: translateY(-50%);
}

/* The top variant (search / archives) pins the toggle to the top-left. */
.tgs-site-header--top .tgs-site-header__toggle {
	top: 0;
	right: auto;
	left: 0;
	transform: none;
}

@media (max-width: 991.98px) {
	.tgs-site-header {
		overflow: hidden;
	}

	.is-nav-open .tgs-site-header {
		overflow: visible;
	}
}

/* Below 1024 the page behind the open nav does not scroll (dream:
   @media (max-width: 63.98em) body.nav-open { overflow: hidden }, which
   clipped the 100%-tall body). initNav() mirrors the class on <html>. */
@media (max-width: 1023.98px) {
	html.is-nav-open {
		overflow: hidden;
	}
}

@media (min-width: 768px) {
	.tgs-site-header__logo svg {
		height: 68px;
		margin-bottom: 0;
	}
}

@media (min-width: 992px) {
	.tgs-site-header {
		right: auto;
		bottom: 0;
		width: var(--tgs-side-w);
		max-height: 100vh;
		background-color: var(--black);
	}

	.tgs-site-header--side {
		border-right: var(--tgs-rule);
		border-bottom: 0;
	}

	.tgs-site-header__bar {
		position: static;
		height: 100%;
		padding: 50px 0;
	}

	.tgs-site-header__logo {
		width: 3.625rem;
		margin: 0 auto;
	}

	.tgs-site-header__toggle {
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	/* Top variant: the logo sits mid-height on the left, the toggle top-left. */
	.tgs-site-header--top .tgs-site-header__bar {
		display: flex;
		align-items: center;
	}

	.tgs-site-header--top .tgs-site-header__logo {
		margin: 0 0 0 12px;
	}

	.tgs-site-header--top .tgs-site-header__toggle {
		top: 0;
		left: 0;
		transform: none;
	}
}

/* ==========================================================================
   Hamburger (hamburgers.css "collapse", resolved --nav-toggle-* values)
   ========================================================================== */

.tgs-hamburger {
	display: inline-block;
	padding: 0.9375rem;
	margin: 0;
	overflow: visible;
	font: inherit;
	color: inherit;
	text-transform: none;
	cursor: pointer;
	background-color: transparent;
	border: 0;
	transition-property: opacity, filter;
	transition-duration: 0.15s;
	transition-timing-function: linear;
}

.tgs-hamburger__box {
	position: relative;
	display: inline-block;
	width: 2.5rem;
	height: calc(0.125rem * 3 + 0.375rem * 2);
}

.tgs-hamburger__inner,
.tgs-hamburger__inner::before,
.tgs-hamburger__inner::after {
	position: absolute;
	width: 2.5rem;
	height: 0.125rem;
	background-color: var(--white);
	border-radius: 0.25rem;
	transition-property: transform;
	transition-duration: 0.15s;
	transition-timing-function: ease;
}

.tgs-hamburger__inner {
	display: block;
	top: auto;
	bottom: 0;
	margin-top: -0.0625rem;
	transition-duration: 0.13s;
	transition-delay: 0.13s;
	transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.tgs-hamburger__inner::before,
.tgs-hamburger__inner::after {
	display: block;
	content: "";
}

.tgs-hamburger__inner::before {
	top: calc(-0.375rem - 0.125rem);
	transition: top 0.12s cubic-bezier(0.33333, 0.66667, 0.66667, 1) 0.2s, transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.tgs-hamburger__inner::after {
	top: calc(-0.375rem * 2 - 0.125rem * 2);
	transition: top 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1) 0.2s, opacity 0.1s linear;
}

.tgs-hamburger:hover .tgs-hamburger__inner,
.tgs-hamburger:hover .tgs-hamburger__inner::before,
.tgs-hamburger:hover .tgs-hamburger__inner::after,
.tgs-hamburger:focus-visible .tgs-hamburger__inner,
.tgs-hamburger:focus-visible .tgs-hamburger__inner::before,
.tgs-hamburger:focus-visible .tgs-hamburger__inner::after,
.tgs-hamburger.is-active .tgs-hamburger__inner,
.tgs-hamburger.is-active .tgs-hamburger__inner::before,
.tgs-hamburger.is-active .tgs-hamburger__inner::after {
	background-color: var(--octonary);
}

.tgs-hamburger.is-active .tgs-hamburger__inner {
	transform: translate3d(0, calc(-0.375rem - 0.125rem), 0) rotate(-45deg);
	transition-delay: 0.22s;
	transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.tgs-hamburger.is-active .tgs-hamburger__inner::after {
	top: 0;
	opacity: 0;
	transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s linear 0.22s;
}

.tgs-hamburger.is-active .tgs-hamburger__inner::before {
	top: 0;
	transform: rotate(-90deg);
	transition: top 0.1s cubic-bezier(0.33333, 0, 0.66667, 0.33333) 0.16s, transform 0.13s cubic-bezier(0.215, 0.61, 0.355, 1) 0.25s;
}

/* ==========================================================================
   Nav panel (was the .full-screen-mobile-nav Bootstrap collapse)
   ========================================================================== */

/* Below 992 the panel stays at z-index auto so the header's PNG sheen
   (z 3) lies over its top-left corner, as before. 100% here is the bar's
   padding box, so the panel covers the 2px rule and reaches the bottom. */
.tgs-nav-panel {
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	height: calc(100vh - 100%);
	padding: 1.875rem;
	overflow: hidden;
	text-align: center;
	visibility: hidden;
	background-color: var(--white);
	clip-path: inset(0 0 100% 0);
	transition: clip-path 0.35s ease, visibility 0s linear 0.35s;
}

.tgs-nav-panel.is-open {
	visibility: visible;
	clip-path: inset(0);
	transition: clip-path 0.35s ease, visibility 0s;
}

.tgs-nav-panel__nav {
	padding: 0 12px;
	margin-bottom: 20px;
}

.tgs-nav-panel__list {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 0;
	margin: 0;
	list-style: none;
}

.tgs-nav-panel__list > li {
	text-align: center;
}

.tgs-nav-panel__list > li > a {
	display: block;
	padding: var(--tgs-nav-item-padding-mobile);
	font-family: var(--tgs-font-primary);
	font-size: var(--tgs-nav-font-size-mobile);
	font-weight: 500;
	font-style: normal;
	line-height: var(--tgs-nav-line-height-mobile);
	color: var(--secondary);
	text-decoration: none;
	text-transform: none;
	border-bottom: 0.125rem solid var(--secondary);
	transition-property: font-weight, color, background;
	transition-duration: var(--tgs-duration);
	transition-timing-function: var(--tgs-ease);
}

.tgs-nav-panel__list > .current-menu-item > a,
.tgs-nav-panel__list > li > a:hover,
.tgs-nav-panel__list > li > a:focus-visible {
	font-weight: 800;
	text-decoration: none;
	background: var(--tgs-gradient-shimmer);
	background-size: 200% auto;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	animation: gradient 15s ease infinite;
}

@media (min-width: 992px) {
	.tgs-nav-panel {
		top: 0;
		right: auto;
		bottom: 0;
		left: 100%;
		z-index: var(--tgs-z-site-header);
		width: auto;
		max-width: 0;
		height: 100vh;
		padding: 0 12px 0 0;
		overflow-x: hidden;
		overflow-y: auto;
		text-align: left;
		clip-path: none;
		transition: max-width var(--tgs-transition), visibility 0s linear var(--tgs-duration);
	}

	.tgs-nav-panel.is-open {
		max-width: 100vw;
		clip-path: none;
		transition: max-width var(--tgs-transition), visibility 0s;
	}

	.tgs-nav-panel__nav {
		padding: 0.625rem 0 0;
		margin: 0;
	}

	.tgs-nav-panel__list {
		justify-content: flex-end;
		padding: 6.25rem 6.25rem 0 0;
	}

	.tgs-nav-panel__list > li {
		display: flex;
		align-items: center;
		text-align: left;
	}

	.tgs-nav-panel__list > li > a {
		flex: 0 0 100%;
		min-width: 21rem;
		padding: var(--tgs-nav-item-padding);
		font-size: var(--tgs-nav-font-size);
		line-height: var(--tgs-nav-line-height);
		white-space: nowrap;
	}
}

/*
 * Top variant (search / archives / author). The old header view had no
 * site-header--side rules, so its collapse sat in the header's flow and was
 * only as tall as the menu. Below 992 it hangs from the bar over the bar's
 * 1px bottom padding, which shows again as a #1e2121 line under it (the
 * header box grew around it). From 992 the header content was centred on
 * the viewport and the collapse sat in the col-8 of a 28rem row: 9.333rem
 * from the left, 598px tall at every width.
 */
.tgs-site-header--top .tgs-nav-panel {
	top: calc(100% - var(--header-mobile-padding-bottom));
	height: auto;
	/* 1.875rem + the 20px bottom padding of the old, empty CTA .button-wrapper. */
	padding-bottom: 3.125rem;
	border-bottom: var(--header-mobile-padding-bottom) solid var(--secondary);
}

@media (min-width: 992px) {
	.tgs-site-header--top .tgs-nav-panel {
		top: 50%;
		bottom: auto;
		left: calc(28rem / 3);
		height: auto;
		padding-bottom: 0;
		border-bottom: 0;
		transform: translateY(-50%);
	}
}

/* ==========================================================================
   Shine overlays (tagstart-child src/img/shine overlay.{png,svg})
   ========================================================================== */

/* Phones / tablets: a PNG sheen inside the top bar (clipped by it, and over
   the open nav panel). */
@media (max-width: 991.98px) {
	.tgs-site-header::before {
		position: absolute;
		top: 0;
		left: 0;
		z-index: var(--tgs-z-site-content);
		display: block;
		width: 100vw;
		height: 100vh;
		pointer-events: none;
		content: "";
		background-image: url("../images/shine-overlay.png");
		background-repeat: no-repeat;
		background-position: left top;
		background-size: contain;
	}
}

/* Desktop: the SVG sheen fixed over the whole viewport, above everything. */
@media (min-width: 992px) {
	body:not(.chromeless)::before {
		position: fixed;
		top: 0;
		left: 0;
		z-index: var(--tgs-z-overlay);
		display: block;
		width: 100vw;
		height: 100vh;
		pointer-events: none;
		content: "";
		background-image: url("../images/shine-overlay.svg");
		background-repeat: no-repeat;
		background-position: left top;
		background-size: contain;
	}
}

/* ==========================================================================
   Footer
   ========================================================================== */

.tgs-site-footer {
	position: relative;
	padding: 3.75rem 0 2.5rem;
	color: var(--white);
	text-align: center;
	background-color: var(--black);
	border-top: var(--tgs-rule);
}

.tgs-site-footer a {
	color: var(--white);
}

.tgs-site-footer a:hover,
.tgs-site-footer a:focus {
	color: var(--octonary);
	text-decoration: none;
}

/* Widget area: the container scale (body.has-footer-max-width, i.e.
   fluid_footer_container off, which is every page), no side padding (the
   old container's 12px was cancelled by its row). */
.tgs-site-footer__widgets {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}

.tgs-site-footer__bottom {
	padding-top: 3.75rem;
	border-top: var(--tgs-rule);
}

.tgs-site-footer__inner {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	padding-right: 0;
	padding-left: 0;
	margin-right: auto;
	margin-left: auto;
}

/* The old col / row pairs (12px padding, -12px margins) cancelled out:
   both columns sit flush with the container edge. */
.tgs-site-footer__social,
.tgs-site-footer__meta {
	flex: 0 0 auto;
	width: 100%;
	max-width: 100%;
}

.tgs-site-footer__social-list {
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	padding: 0 2.5rem 0 0;
	margin: 0 0 1rem;
	text-align: left;
	list-style: none;
}

.tgs-site-footer__social-list > li {
	position: relative;
	flex: 0 0 auto;
	padding: 0 calc(2.5rem * 0.5) 0 0;
	margin: 0;
	line-height: 1;
}

.tgs-site-footer__social-list > li:last-child {
	padding-right: 0;
}

.tgs-site-footer__social-list a {
	position: relative;
	display: block;
	min-height: 100%;
	padding: 0;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.0390625rem;
	text-transform: none;
}

/* Social links stay white (--footer-social-nav-item-hover: #fff); only the
   underline flips. */
.tgs-site-footer__social-list a:hover,
.tgs-site-footer__social-list a:focus {
	color: var(--white);
	text-decoration: underline;
}

.tgs-site-footer__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	text-align: left;
}

.tgs-site-footer__copyright {
	flex: 0 0 auto;
	order: 0;
	margin: 0;
	padding: 0;
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 0.75rem;
}

.tgs-site-footer__copyright em {
	font-family: var(--tgs-font-accent);
	font-style: normal;
	color: var(--octonary);
}

.tgs-site-footer__name {
	text-transform: uppercase;
}

.tgs-site-footer__utility {
	flex: 0 0 auto;
	order: 1;
	padding: 0 0 0 0.625rem;
}

.tgs-site-footer__utility-list {
	display: flex;
	flex-direction: row;
	justify-content: center;
	padding: 0;
	margin: 0;
	list-style: none;
}

.tgs-site-footer__utility-list > li {
	line-height: 0.875rem;
}

.tgs-site-footer__utility-list a {
	display: block;
	padding: 0 12px;
	font-size: 0.75rem;
	font-weight: 500;
	/* 0.875rem, but never less than the text (the old .item-label had
	   line-height 1 inside it). */
	line-height: max(0.875rem, 1em);
	color: var(--white);
	text-transform: uppercase;
	border-left: 0.0625rem solid var(--white);
}

@media (min-width: 390px) {
	.has-footer-max-width .tgs-site-footer__widgets,
	.has-footer-max-width .tgs-site-footer__inner {
		max-width: var(--tgs-container-sm);
	}
}

@media (min-width: 540px) {
	.has-footer-max-width .tgs-site-footer__widgets,
	.has-footer-max-width .tgs-site-footer__inner {
		max-width: var(--tgs-container-md);
	}
}

@media (min-width: 768px) {
	.tgs-site-footer__social {
		flex: 0 0 auto;
		width: 41.66666667%;
		order: 1;
	}

	.tgs-site-footer__social-list {
		justify-content: center;
		margin: 0;
	}

	.tgs-site-footer__meta {
		width: 58.33333333%;
		order: 0;
	}
}

@media (min-width: 992px) {
	.tgs-site-footer p {
		font-size: 1.125rem;
	}

	.has-footer-max-width .tgs-site-footer__widgets,
	.has-footer-max-width .tgs-site-footer__inner {
		max-width: var(--tgs-container-lg);
	}

	.tgs-site-footer__bottom {
		padding-left: 3.75rem;
	}

	.tgs-site-footer__social-list > li {
		padding: 0 2.5rem 0 0;
	}

	.tgs-site-footer__social-list a {
		font-size: 1rem;
		text-decoration: underline;
	}

	.tgs-site-footer__social-list a:hover,
	.tgs-site-footer__social-list a:focus {
		text-decoration: none;
	}

	.tgs-site-footer__copyright {
		padding-top: 0.0625rem;
		font-size: 1rem;
	}

	.tgs-site-footer__utility {
		padding-top: 0.0625rem;
	}

	.tgs-site-footer__utility-list a {
		font-size: 1rem;
	}
}

/* dream.css set the footer padding, alignment and copyright line-height at
   64em (1024px), not with the 62em (992px) child rules above. */
@media (min-width: 1024px) {
	.tgs-site-footer {
		padding: 5rem 0 3.75rem;
		text-align: var(--footer-text-align);
	}

	.has-footer-max-width .tgs-site-footer__widgets,
	.has-footer-max-width .tgs-site-footer__inner {
		max-width: var(--tgs-container-xl);
	}

	.tgs-site-footer__social-list {
		justify-content: var(--footer-flex-align);
	}

	.tgs-site-footer__copyright {
		line-height: 0.875rem;
	}

	.tgs-site-footer__utility-list {
		justify-content: flex-start;
	}

	.tgs-site-footer__bottom {
		padding-left: var(--tgs-gutter-xl);
	}

	.tgs-site-footer__social {
		width: 58.33333333%;
	}

	.tgs-site-footer__meta {
		width: 41.66666667%;
	}
}

@media (min-width: 1400px) {
	.has-footer-max-width .tgs-site-footer__widgets,
	.has-footer-max-width .tgs-site-footer__inner {
		max-width: var(--tgs-container-xxl);
	}

	.tgs-site-footer__bottom {
		padding-left: var(--tgs-gutter-xxl);
	}

	.tgs-site-footer__utility-list a {
		padding: 0 10px;
	}
}

@media (min-width: 1708px) {
	.has-footer-max-width .tgs-site-footer__widgets,
	.has-footer-max-width .tgs-site-footer__inner {
		max-width: var(--tgs-container-xxxl);
	}
}

@media (min-width: 2300px) {
	.has-footer-max-width .tgs-site-footer__widgets,
	.has-footer-max-width .tgs-site-footer__inner {
		max-width: var(--tgs-container-xxxxl);
	}
}

/* ==========================================================================
   Footer locations widget (widget_block 2: acf/section.site-footer--locations)
   ========================================================================== */

.site-footer--locations {
	text-align: left;
}

.site-footer--locations h4 {
	font-size: 1.125rem;
}

.site-footer--locations .block-section--wrapper {
	padding: 0 0.75rem;
}

@media (min-width: 992px) {
	.site-footer--locations h4 {
		font-size: 2.5rem;
	}

	.site-footer--locations .block-section--wrapper {
		padding-left: var(--tgs-gutter-xl);
	}
}

@media (min-width: 1400px) {
	.site-footer--locations .block-section--wrapper {
		padding-left: var(--tgs-gutter-xxl);
	}
}

/* ==========================================================================
   Page header (was header.page-header, child _page-header.scss)
   ========================================================================== */

.tgs-page-header {
	position: relative;
	padding-bottom: 6.125rem;
}

/* The vertical "TAG." wordmark (uploads/2023/05/Wordmark-TAG-NegativeBlueDot.svg). */
.tgs-page-header::before {
	position: absolute;
	top: 3.75rem;
	right: 1rem;
	z-index: var(--tgs-z-site-content);
	display: block;
	width: 1rem;
	content: url("../images/wordmark-tag.svg");
}

.tgs-page-header.has-image::before {
	top: 7rem;
}

.tgs-page-header__inner {
	display: flex;
	flex-wrap: wrap;
	margin-right: -0.75rem;
	margin-left: -0.75rem;
}

/* Pages with content gutters: the old container / row / content wrapper
   cancelled out, leaving the inner box flush with the header. */
.tgs-page-header--gutters .tgs-page-header__inner {
	max-width: var(--tgs-container-xxxxl);
	margin-right: auto;
	margin-left: auto;
}

.tgs-page-header__media {
	position: relative;
	z-index: 2;
	width: 100%;
	padding: 0;
}

.tgs-page-header__image {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	/* The old resize(1600, 900) "default" crop: centred across, but only a
	   sixth of the excess height taken off the top (Resize::get_target_sizes). */
	object-position: 50% 16.6666667%;
}

.tgs-page-header__image--natural {
	aspect-ratio: auto;
}

.tgs-page-header__media video {
	pointer-events: none;
}

.tgs-page-header__media .has-controls video {
	pointer-events: all;
}

.tgs-page-header__titles {
	position: relative;
	width: 100%;
	padding-left: var(--tgs-gutter-sm);
}

.tgs-page-header.has-image .tgs-page-header__titles {
	margin-top: -2.125rem;
}

.tgs-page-header__title {
	margin: 0;
	font-family: var(--tgs-font-primary);
	font-size: 4.625rem;
	font-weight: 700;
	line-height: 0.8108108108;
	color: var(--white);
}

.tgs-page-header__title span {
	display: block;
	white-space: nowrap;
}

.tgs-page-header__title strong {
	font-family: var(--tgs-font-accent);
	font-size: 0.8em;
	line-height: 0;
	color: var(--octonary);
}

.tgs-page-header__title--outline {
	position: absolute;
	bottom: 0;
	z-index: var(--tgs-z-site-content);
	pointer-events: none;
	-webkit-text-stroke: 0.0625rem var(--white);
	-webkit-text-fill-color: transparent;
}

.tgs-page-header__title--outline strong {
	-webkit-text-stroke: 0.0625rem var(--octonary);
	-webkit-text-fill-color: transparent;
}

/* Below 768 the fixed top bar is pushed out of the way. */
@media (max-width: 767.98px) {
	.tgs-site--side .tgs-page-header {
		padding-top: var(--tgs-header-h);
	}
}

@media (min-width: 768px) {
	.tgs-page-header {
		padding-top: 11.375rem;
	}

	.tgs-page-header__media {
		flex: 0 0 auto;
		order: 1;
		width: 66.6666666667%;
		margin-left: -16.6666666667%;
	}

	.tgs-page-header__titles {
		flex: 0 0 auto;
		order: 0;
		width: 50%;
	}

	.tgs-page-header.has-image .tgs-page-header__titles {
		margin-top: 0;
	}

	.tgs-page-header.has-image .tgs-page-header__title {
		position: absolute;
		top: 50%;
		bottom: auto;
		display: inline-block;
		transform: translateY(-50%);
	}

	/* The old fluid-type mixin resolved to these flat sizes. */
	.tgs-page-header__title {
		font-size: 132px;
	}
}

@media (min-width: 992px) {
	.tgs-page-header::before {
		right: 2.5rem;
	}

	.tgs-page-header__title--outline {
		-webkit-text-stroke-width: 0.125rem;
	}

	.tgs-page-header__title--outline strong {
		-webkit-text-stroke-width: 0.125rem;
	}
}

/* 992-1023 only: the wordmark sits higher over an image header
   (styles.css:9920, @media (min-width:62em) and (max-width:63.98em)). */
@media (min-width: 992px) and (max-width: 1023.98px) {
	.tgs-page-header.has-image::before {
		top: 2.75rem;
	}
}

@media (min-width: 1024px) {
	.tgs-page-header__titles {
		padding-left: var(--tgs-gutter-xl);
	}

	.tgs-page-header__title {
		font-size: 154px;
	}

	/* Scroll effect: fixed behind the content, which scrolls up over it.
	   The article reserves the same height (.tgs-article--scroll-header). */
	.tgs-page-header--scroll {
		position: fixed;
		top: 0;
		right: 0;
		left: var(--tgs-side-w);
		height: 100vh;
	}

	.tgs-article--scroll-header {
		padding-top: 100vh;
	}
}

@media (min-width: 1400px) {
	.tgs-page-header {
		padding-top: 13rem;
		padding-bottom: 8.25rem;
	}

	.tgs-page-header::before,
	.tgs-page-header.has-image::before {
		top: 3.5rem;
	}

	.tgs-page-header__titles {
		padding-left: var(--tgs-gutter-xxl);
	}

	.tgs-page-header__title {
		font-size: 197px;
	}

	.tgs-page-header--scroll {
		height: 85vh;
	}

	.tgs-article--scroll-header {
		padding-top: 85vh;
	}
}

/* xxxxl (child _page-header.scss media-breakpoint-up(xxxxl); its
   responsive-font(12vw, 277px, 309px) compiled to a flat 309px). */
@media (min-width: 2300px) {
	.tgs-page-header {
		padding-top: 20rem;
		padding-bottom: 11.5rem;
	}

	.tgs-page-header__title {
		font-size: 309px;
	}
}

/* ==========================================================================
   Article body (privacy, terms, contact, join copy; child wordpress/_page.scss)
   ========================================================================== */

.post-type-page .tgs-article__body a {
	word-break: break-all;
}

@media (min-width: 992px) {
	.post-type-page .tgs-article__body p,
	.post-type-our_work .tgs-article__body p,
	.post-type-videos .tgs-article__body p {
		font-size: 1.625rem;
	}
}

@media (min-width: 1400px) {
	.post-type-page .tgs-article__body p,
	.post-type-our_work .tgs-article__body p,
	.post-type-videos .tgs-article__body p {
		font-size: 1.6875rem;
	}
}

/* No Hero Unit (reel): the panel without its padding or rule, 1rem on top. */
.tgs-article__content--flush {
	padding: 1rem 0 0;
	border-top: 0;
}

.tgs-article__byline {
	margin-bottom: 1rem;
}

/* ==========================================================================
   Post pager (singles)
   ========================================================================== */

.tgs-post-pager {
	position: relative;
	padding-top: 5.625rem;
	text-align: center;
	background-color: var(--black);
}

.tgs-post-pager__back {
	display: block;
	margin-bottom: 1.875rem;
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.03125rem;
	color: #707070;
}

/* dream .post-pager .back kept its grey on hover; only the underline shows. */
.tgs-post-pager__back:hover,
.tgs-post-pager__back:focus {
	color: #707070;
}

.tgs-post-pager__item {
	position: relative;
	border: 0.125rem solid var(--primary);
}

.tgs-post-pager__item:last-child {
	border-left-width: 0.0625rem;
}

.tgs-post-pager__content {
	padding: 2.5rem;
}

.tgs-post-pager__label {
	position: absolute;
	top: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.03125rem;
	color: var(--primary);
	text-transform: uppercase;
}

.tgs-post-pager__item--next .tgs-post-pager__label {
	right: 0.9375rem;
}

.tgs-post-pager__item--prev .tgs-post-pager__label {
	left: 0.9375rem;
}

/* The old arrow icons: inline SVGs filled with var(--primary), which a
   data: URI cannot resolve, so they drew black on the black pager. Only
   their 20px box showed, nudging the label off the corner; keep the box. */
.tgs-post-pager__item--next .tgs-post-pager__label::after,
.tgs-post-pager__item--prev .tgs-post-pager__label::before {
	display: inline-block;
	width: 1.25rem;
	height: 0.9375rem;
	content: "";
}

.tgs-post-pager__date {
	display: block;
	margin-bottom: 0.9375rem;
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.03125rem;
	color: var(--gray);
	text-transform: uppercase;
}

.tgs-post-pager__title {
	display: block;
	max-width: 15.625rem;
	margin: 0 auto;
	font-family: Georgia, Times, "Times New Roman", serif;
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.2857142857;
	letter-spacing: 0.03125rem;
	color: var(--secondary);
}

/* The link covers the whole box; its text is not shown. */
.tgs-post-pager__link,
.tgs-post-pager__link a {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.tgs-post-pager__link {
	font-size: 0;
	line-height: 0;
}

@media (min-width: 540px) {
	.tgs-post-pager__content {
		padding: 3.75rem;
	}
}

/* ==========================================================================
   Cards + post grid (search, archives; parent tease / @molecules/card)
   ========================================================================== */

.tgs-post-grid__list {
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	justify-content: flex-start;
}

.tgs-post-grid__item {
	flex: 0 0 100%;
	margin: 0;
}

.tgs-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	color: var(--secondary);
	text-align: left;
	word-wrap: break-word;
	background-color: var(--white);
	border: 0.0625rem solid var(--secondary);
	border-radius: 0;
}

.tgs-card:hover,
.tgs-card:focus {
	color: var(--secondary);
	text-decoration: none;
	background-color: var(--white);
	border-color: var(--secondary);
}

.tgs-card__intro {
	padding: 1.328125rem;
}

.tgs-card__title {
	margin-bottom: 0.5rem;
	font-family: var(--tgs-font-primary);
	font-size: 2rem;
	font-weight: bold;
	font-style: normal;
	line-height: var(--tgs-heading-leading);
	color: var(--secondary);
}

.tgs-card__body {
	flex: 1 1 auto;
	padding: 0 1rem 1rem;
}

.tgs-card__text {
	font-family: var(--tgs-font-primary);
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.4;
	color: var(--secondary);
}

@media (min-width: 768px) {
	.tgs-post-grid__item {
		flex: 0 1 calc((100% - 60px) / 2);
		margin: 3.75rem 1.875rem 0;
	}

	.tgs-post-grid__item:nth-of-type(2n + 1) {
		margin-left: 0;
	}

	.tgs-post-grid__item:nth-of-type(2n) {
		margin-right: 0;
	}

	.tgs-post-grid__item:nth-of-type(-n + 2) {
		margin-top: 0;
	}
}

/* ==========================================================================
   Pagination (archives / search)
   ========================================================================== */

.tgs-pagination {
	position: relative;
	padding: 1.875rem 0;
	background-color: var(--black);
}

.tgs-pagination ul {
	display: flex;
	gap: 0.5rem;
	justify-content: center;
	padding: 0;
	margin: 0;
	list-style: none;
}

/* ==========================================================================
   404 (#dino, was .jumbotron-fifty-fifty)
   ========================================================================== */

.tgs-404 {
	padding: 3rem;
}

.tgs-404 .container {
	height: 100%;
}

.tgs-404__row {
	align-items: center;
	height: 100%;
}

.tgs-404__content {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: auto;
	text-align: center;
	vertical-align: middle;
}

.tgs-404__title {
	margin-top: 1.5rem;
	margin-bottom: var(--tgs-heading-gap);
	font-size: 172px;
	font-weight: 900;
	line-height: var(--tgs-heading-leading);
}

.tgs-404__title::after {
	font-size: 60px;
	color: var(--bright-blue);
	text-align: center;
	vertical-align: -webkit-baseline-middle;
	content: "\25A0";
}

/* ==========================================================================
   Holidays / chromeless (child _chromeless.scss, wordpress/_page.scss)
   ========================================================================== */

.chromeless {
	color: var(--black);
}

.chromeless a {
	color: var(--black);
}

/* ==========================================================================
   Marquee (child _marquee.scss)
   ========================================================================== */

.tgs-marquee {
	position: relative;
	background-color: var(--black);
}

.tgs-marquee__wrapper {
	position: relative;
	max-width: 100%;
	height: 9.625rem;
	padding: 3.125rem 0;
	overflow-x: hidden;
	border-top: var(--tgs-rule);
}

.tgs-marquee__track {
	position: absolute;
	top: 3.125rem;
	left: 0.75rem;
	white-space: nowrap;
	will-change: transform;
	animation: marquee 45s linear infinite;
}

.tgs-marquee--slow .tgs-marquee__track {
	animation-duration: 100s;
}

.tgs-marquee__content {
	display: inline-flex;
	justify-content: space-between;
	width: 100%;
	background: var(--tgs-gradient-shimmer);
	background-size: 200% auto;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	animation: gradient-alt 15s ease infinite;
}

.tgs-marquee__term {
	margin-bottom: 0;
	font-size: 2.8125rem;
	font-weight: 700;
}

.tgs-marquee__term::after {
	margin: 0 1.25rem;
	content: "\2013";
}

.tgs-marquee__link,
.tgs-marquee__link:hover {
	text-decoration: none;
}

@media (min-width: 992px) {
	.tgs-marquee__wrapper {
		height: 10.125rem;
	}

	.tgs-marquee__term {
		font-size: 3.25rem;
	}
}

@media (min-width: 1400px) {
	.tgs-marquee__wrapper {
		height: 13rem;
	}

	.tgs-marquee__track {
		animation-duration: 25s;
	}

	.tgs-marquee--slow .tgs-marquee__track {
		animation-duration: 100s;
	}

	.tgs-marquee__term {
		font-size: 5.625rem;
	}
}

/* ==========================================================================
   CTA band (about, tv-media; child _cta.scss)
   ========================================================================== */

.tgs-cta {
	position: relative;
	background-color: var(--black);
}

.tgs-cta__wrapper {
	border-top: var(--tgs-rule);
	border-bottom: var(--tgs-rule);
}

.tgs-cta__intro {
	display: block;
	padding: 0.625rem;
	vertical-align: middle;
	border-right: var(--tgs-rule);
}

.tgs-cta__text {
	margin-bottom: 0;
	padding-left: 1.25rem;
	font-size: 1rem;
}

.tgs-cta__action {
	display: inline-flex;
	align-items: center;
	padding: 0;
	font-size: 1.5rem;
	text-transform: uppercase;
	vertical-align: middle;
}

.tgs-cta__button {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	font-size: 0.875rem;
}

.tgs-cta__button .button--label {
	position: absolute;
	top: 50%;
	left: 50%;
	display: inline-block;
	width: 100%;
	transform: translate(-50%, -50%);
}

@media (min-width: 768px) {
	.tgs-cta__text {
		padding-right: 1.25rem;
		padding-left: 0;
	}
}

@media (min-width: 992px) {
	.tgs-cta__intro {
		display: inline-flex;
		align-items: center;
		justify-content: flex-end;
		padding: 1.25rem 0;
	}

	.tgs-cta__text {
		font-size: 1.625rem;
	}

	.tgs-cta__button {
		font-size: 1rem;
	}
}

@media (min-width: 1400px) {
	.tgs-cta__text {
		font-size: 1.6875rem;
	}

	.tgs-cta__button {
		font-size: 1.125rem;
	}
}

/* ==========================================================================
   Video promo (dream 02-molecules/video-promo + child _video-promo.scss)
   ========================================================================== */

.tgs-video-promo {
	position: relative;
}

.tgs-video-promo__play {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: var(--tgs-z-site-content);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 5.9375rem;
	height: 5.9375rem;
	padding: 0;
	color: rgba(255, 255, 255, 0.9);
	cursor: pointer;
	background: var(--transparent-octonary-primary-diagonal-down);
	background-size: 200% auto;
	border: 0.1875rem solid rgba(255, 255, 255, 0.8);
	border-radius: 50%;
	transform: translate(-50%, -50%);
	transition-property: opacity, color, border-color, background-color;
	transition-duration: var(--tgs-duration);
	transition-timing-function: var(--tgs-ease);
	animation: gradient-alt 15s ease infinite;
}

.tgs-video-promo__play:hover,
.tgs-video-promo__play:focus-visible {
	color: var(--white);
	border-color: var(--white);
}

.tgs-video-promo__play .tgs-icon {
	display: block;
	width: 30px;
	height: 30px;
}

.tgs-video-promo.is-playing .tgs-video-promo__play {
	pointer-events: none;
	opacity: 0;
}

/* ==========================================================================
   Video dialog (native <dialog>; was the Bootstrap .modal-video modals)
   ========================================================================== */

.tgs-video-dialog {
	position: fixed;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	max-height: none;
	padding: 0;
	margin: 0;
	overflow-x: hidden;
	overflow-y: auto;
	color: var(--white);
	text-align: left;
	background-color: var(--black);
	border: 0;
}

/* Both old modals were .modal-dialog-centered: below 540 (full screen) the
   content sat centred in a box 3.5rem shorter than the screen, from the top
   (min-height: calc(100% - 1.75rem * 2), margin 0), so 28px above the
   middle, and at the top once taller than that box. One grid row of at
   least that height, centred items and the content's auto margins do the
   same (auto margins never push the content above the scroll origin). */
.tgs-video-dialog[open] {
	display: grid;
	grid-template-rows: minmax(calc(100% - 3.5rem), auto);
	grid-template-columns: minmax(0, 1fr);
	align-content: start;
	align-items: center;
}

.tgs-video-dialog::backdrop {
	background-color: rgba(0, 0, 0, 0.5);
}

/* The TV modals had data-bs-backdrop="false": only the dialog's own
   rgba(0, 0, 0, 0.5) from 992px dims the page, not a second backdrop. */
.tgs-video-dialog--tv::backdrop {
	background-color: transparent;
}

/* The page behind an open dialog does not scroll (Bootstrap's .modal-open). */
html.is-dialog-open {
	overflow: hidden;
}

/* showModal() focuses the content box (autofocus, tabindex -1), as the
   Bootstrap modal focused itself; Tab then reaches play and close. */
.tgs-video-dialog__content:focus {
	outline: 0;
}

.tgs-video-dialog__content {
	position: relative;
	display: grid;
	grid-template-rows: auto auto 1fr;
	grid-template-columns: minmax(0, 1fr);
	width: 100%;
	margin: auto;
	background-color: var(--black);
}

.tgs-video-dialog__media {
	grid-row: 1;
	grid-column: 1;
}

.tgs-video-dialog__header {
	display: block;
	grid-row: 2;
	grid-column: 1;
	padding: 1.875rem 2.5rem 1.25rem;
}

.tgs-video-dialog__title {
	margin: 0;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1;
	color: var(--white);
}

.tgs-video-dialog__close {
	position: absolute;
	top: 2.5rem;
	right: 2.5rem;
	z-index: var(--tgs-z-site-content);
	padding: 0.5rem 1rem;
	margin: 0;
	font-size: 1.25rem;
	line-height: 1.4;
	cursor: pointer;
	background: transparent;
	border: 1px solid transparent;
	transition: opacity var(--tgs-transition);
}

/* On the baseline, as the old .modal--close::before: the 24px icon then
   sets a 33px line box, so the button is 51px tall with the X 9px from
   its top (vertical-align: middle made it 46px with the X 3px lower). */
.tgs-video-dialog__close::before {
	display: inline-block;
	width: 24px;
	height: 24px;
	content: "";
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 21.6 21.6' xml:space='preserve' width='21.6' height='21.6' x='89' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='m12.2 10.8 9.4 9.4-1.4 1.4-9.4-9.4-9.4 9.4L0 20.2l9.4-9.4L0 1.4 1.4 0l9.4 9.4L20.2 0l1.4 1.4-9.4 9.4z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	filter: drop-shadow(0.0625rem 0.125rem 0.125rem rgba(0, 0, 0, 0.7));
}

.tgs-video-dialog__close:hover::before,
.tgs-video-dialog__close:focus-visible::before {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 21.6 21.6' xml:space='preserve' width='21.6' height='21.6' x='89' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23002fdc' d='m12.2 10.8 9.4 9.4-1.4 1.4-9.4-9.4-9.4 9.4L0 20.2l9.4-9.4L0 1.4 1.4 0l9.4 9.4L20.2 0l1.4 1.4-9.4 9.4z'/%3E%3C/svg%3E");
}

.tgs-video-dialog__body {
	grid-row: 3;
	grid-column: 1;
	padding: 1.25rem 2.5rem 5.625rem;
	border-bottom: var(--tgs-rule);
}

.tgs-video-dialog__excerpt,
.tgs-video-dialog__body p {
	font-size: 1rem;
	line-height: 1.5;
}

/* The TV collapse was .collapse.p-3 (team details add pt-0): 1rem above
   the expanded text as well. */
.tgs-video-dialog--tv .tgs-more__panel {
	padding-top: 1rem;
}

/* TV: a centred card (Bootstrap modal-lg 800px, full screen below 540).
   From 540 the card (.modal-dialog margin 1.75rem auto) is centred on the
   screen while it fits, and starts 1.75rem from the top and scrolls, with
   1.75rem below it, once taller: 1.75rem of dialog padding, a 1fr row (at
   least the card's height) and the content's auto margins. Fixed 1.75rem
   margins in a centred row pushed a taller card's top (video, close
   button) out of reach, e.g. 100px of it at 1440x800 with More open. */
@media (min-width: 540px) {
	.tgs-video-dialog--tv[open] {
		grid-template-rows: 1fr;
		padding: 1.75rem 0;
	}

	.tgs-video-dialog--tv .tgs-video-dialog__content {
		max-width: 500px;
	}
}

@media (min-width: 768px) {
	.tgs-video-dialog__header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-top: 3.75rem;
	}
}

@media (min-width: 992px) {
	.tgs-video-dialog {
		background-color: rgba(0, 0, 0, 0.5);
	}

	.tgs-video-dialog--tv .tgs-video-dialog__content {
		max-width: 800px;
	}

	.tgs-video-dialog__title {
		font-size: 2rem;
	}
}

@media (min-width: 1400px) {
	.tgs-video-dialog__title {
		font-size: 1.75rem;
	}

	.tgs-video-dialog__excerpt,
	.tgs-video-dialog__body p {
		font-size: 1.125rem;
		line-height: 1.5555555556;
	}
}

/* ==========================================================================
   More / Less toggle (was the @atoms/collapse + Bootstrap collapse)
   initToggles(): button[data-tgs-toggle][aria-controls][aria-expanded].
   ========================================================================== */

.tgs-more {
	display: grid;
	grid-template-rows: auto auto;
	grid-template-columns: minmax(0, 1fr);
}

.tgs-more__panel {
	grid-row: 1;
	grid-column: 1;
	padding: 0 0 1rem;
	color: var(--white);
}

.tgs-more__panel p {
	font-size: 1rem;
	line-height: 1.5;
}

.tgs-more__controls {
	grid-row: 2;
	grid-column: 1;
	margin-top: 2.125rem;
}

.tgs-more__button {
	display: inline-block;
	padding: 0;
	font-family: inherit;
	font-size: 1.5rem;
	line-height: 1.4;
	color: var(--white);
	text-transform: uppercase;
	cursor: pointer;
	background: transparent;
	border: 1px solid transparent;
}

.tgs-more__button::after {
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: middle;
	content: "";
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xml:space='preserve' width='32' height='32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='m16.3 24.5-16-16 1-1 15 15 15-15 1 1'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.tgs-more__button[aria-expanded="false"]:hover::after,
.tgs-more__button[aria-expanded="false"]:focus-visible::after {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xml:space='preserve' width='32' height='32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23002fdc' d='m16.3 24.5-16-16 1-1 15 15 15-15 1 1'/%3E%3C/svg%3E");
}

.tgs-more__button[aria-expanded="true"]::after {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xml:space='preserve' width='32' height='32' x='32' y='32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23002fdc' d='m16.3 7.5 16 16-1 1-15-15-15 15-1-1'/%3E%3C/svg%3E");
}

.tgs-more__button[aria-expanded="false"] .tgs-more__label--less,
.tgs-more__button[aria-expanded="true"] .tgs-more__label--more {
	display: none;
}

@media (min-width: 1400px) {
	.tgs-more__panel p {
		font-size: 1.125rem;
		line-height: 1.5555555556;
	}
}

/* ==========================================================================
   Core Columns (rsvp 4837: details | form 7)
   bin/2026-10-22-rsvp-core-columns.php converted rsvp's Genesis Blocks
   Advanced Columns (gb-2-col-wideright, grid 1fr 2fr) to core/columns with
   widths 33.33% / 66.66%. Genesis drew a 2em gap, nothing between stacked
   columns, no bottom margin, and stacked only at 600px and below. Core
   stacks below 782px and, with global-styles dequeued (assets.php), prints
   no gap at all. These rules keep the Genesis look; between 601 and 781px a
   column keeps its width for the widths the conversion writes, and columns
   without a width share the row equally (as from 782px).
   ========================================================================== */

.wp-block-columns {
	gap: 0 2em;
	margin-bottom: 0;
}

@media (min-width: 601px) and (max-width: 781px) {
	.wp-block-columns:not(.is-not-stacked-on-mobile) {
		flex-wrap: nowrap !important;
	}

	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
		flex-basis: 0 !important;
		flex-grow: 1;
	}

	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:33.33%"] {
		flex-basis: 33.33% !important;
		flex-grow: 0;
	}

	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis:66.66%"] {
		flex-basis: 66.66% !important;
		flex-grow: 0;
	}
}

/* ==========================================================================
   Gravity Forms (forms 3 contact, 7 rsvp)
   Child wordpress/plugins/gravity-forms/_gravity-forms.scss + _contact-us.scss
   over the dream.css base, then the Additional CSS (custom_css post 4511).
   Plugin markup: the selectors stay as Gravity Forms prints them.
   ========================================================================== */

.no-gf-layout .gform_wrapper.gravity-theme .gform-body .gform_fields {
	display: block;
	grid-template-rows: none;
	grid-template-columns: none;
	grid-row-gap: 0;
	grid-column-gap: 0;
}

.no-gf-layout .gform_wrapper.gravity-theme .gform-body .gfield,
.no-gf-layout .gform_wrapper.gravity-theme .gform-body .gfield.gfield--width-full {
	grid-column: unset;
}

.no-gf-layout .gform_wrapper.gravity-theme .gform-body input:not([type=submit]),
.no-gf-layout .gform_wrapper.gravity-theme .gform-body input[type=email],
.no-gf-layout .gform_wrapper.gravity-theme .gform-body input[type=tel],
.no-gf-layout .gform_wrapper.gravity-theme .gform-body input[type=text],
.no-gf-layout .gform_wrapper.gravity-theme .gform-body select,
.no-gf-layout .gform_wrapper.gravity-theme .gform-body textarea {
	padding: var(--tgs-input-padding-y) var(--tgs-input-padding-x);
	font-size: var(--tgs-input-font-size);
	font-weight: normal;
	font-style: normal;
	line-height: 1.4;
	letter-spacing: 0;
	color: var(--white);
	text-transform: none;
	vertical-align: middle;
	background-color: transparent;
	border: 0.125rem solid var(--white);
	border-radius: 0;
}

.no-gf-layout .gform_wrapper.gravity-theme .gform-body input:not([type=submit]):hover,
.no-gf-layout .gform_wrapper.gravity-theme .gform-body input:not([type=submit]):focus,
.no-gf-layout .gform_wrapper.gravity-theme .gform-body select:hover,
.no-gf-layout .gform_wrapper.gravity-theme .gform-body select:focus,
.no-gf-layout .gform_wrapper.gravity-theme .gform-body textarea:hover,
.no-gf-layout .gform_wrapper.gravity-theme .gform-body textarea:focus {
	padding-right: var(--tgs-input-padding-x);
	padding-left: var(--tgs-input-padding-x);
	color: var(--white);
	background-color: transparent;
	border: 0.125rem solid var(--white);
}

.no-gf-layout .gform_wrapper.gravity-theme .gform-body input:not([type=submit]):not([type=radio]):not([type=checkbox]):not([type=image]):not([type=file]),
.no-gf-layout .gform_wrapper.gravity-theme .gform-body select:not([type=radio]):not([type=checkbox]):not([type=image]):not([type=file]),
.no-gf-layout .gform_wrapper.gravity-theme .gform-body textarea:not([type=radio]):not([type=checkbox]):not([type=image]):not([type=file]) {
	min-height: 0;
	line-height: 1.4;
}

.no-gf-layout .gform_wrapper.gravity-theme .gform-body select {
	padding: calc(var(--tgs-input-padding-y) + 1px) var(--tgs-input-padding-x);
}

.no-gf-layout .gform_wrapper.gravity-theme .gform_footer .button {
	display: inline-block;
	padding: var(--tgs-button-padding);
	font-family: var(--tgs-font-primary);
	font-size: var(--tgs-button-font-size);
	font-weight: var(--tgs-button-font-weight);
	font-style: normal;
	line-height: var(--tgs-button-line-height);
	letter-spacing: 0;
	color: var(--tgs-button-text);
	text-align: center;
	text-decoration: none;
	text-transform: none;
	vertical-align: middle;
	background-color: var(--octonary);
	border: var(--tgs-button-border);
	border-radius: 0;
	transition: all var(--tgs-transition);
}

.no-gf-layout .gform_wrapper.gravity-theme .gform_footer .button:visited {
	color: var(--tgs-button-text);
}

.no-gf-layout .gform_wrapper.gravity-theme .gform_footer .button:hover,
.no-gf-layout .gform_wrapper.gravity-theme .gform_footer .button:focus,
.no-gf-layout .gform_wrapper.gravity-theme .gform_footer .button:active {
	color: var(--tgs-button-text);
	text-decoration: none;
	cursor: pointer;
	background: var(--octonary-primary-horizontal);
	background-size: 200% auto;
	animation: gradient-alt 15s ease infinite;
}

/* The contact-us layout (forms 3 and 7 both carry .contact-us). */
.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us .gform-body,
.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us .gform_fields {
	display: contents;
}

.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us .gfield {
	margin-bottom: 1.375rem;
}

.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us .ginput_container_select {
	position: relative;
}

.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us .ginput_container_select::after {
	position: absolute;
	top: 50%;
	right: 1.5rem;
	display: inline-block;
	width: 16px;
	height: 16px;
	content: "";
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xml:space='preserve' width='32' height='32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='m16.3 24.5-16-16 1-1 15 15 15-15 1 1'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transform: translateY(-50%);
}

.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us .gfield_select {
	appearance: none;
}

.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us #field_3_7 { grid-row: 1; grid-column: 1; }
.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us #field_3_2 { grid-row: 2; grid-column: 1; }
.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us #field_3_8 { grid-row: 3; grid-column: 1; }
.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us #field_3_5 { grid-row: 4; grid-column: 1; }
.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us #field_3_6 { grid-row: 5; grid-column: 1; }
.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us #field_3_4 { grid-row: 6; grid-column: 1; }

.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us .gform_footer {
	grid-row: 7;
	grid-column: 1;
	justify-content: flex-start;
	padding: 0;
	margin: 0;
}

.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us .gform_footer .button {
	flex: 0 0 auto;
	margin: 1.875rem 0 0;
}

@media (min-width: 992px) {
	.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us {
		display: grid;
		grid-template-rows: auto auto auto auto auto auto auto;
		grid-template-columns: 1fr;
		column-gap: 1.375rem;
	}
}

/* Additional CSS (custom_css post 4511), in source order. */
.no-gf-layout .contact-us_wrapper.gravity-theme .contact-us .gform_footer {
	grid-row-start: 8;
}

.contact-us .gchoice {
	position: relative;
	z-index: 1;
	width: 100% !important;
	height: 130px;
	padding: 0;
	margin: 0;
}

.contact-us input.gfield-choice-input {
	position: absolute;
	z-index: 2;
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	appearance: none;
	background: #dfe1e5;
	border-radius: 0;
	transition: 0.3s all ease-in-out;
}

.contact-us input.gfield-choice-input:hover,
.contact-us .gchoice label:hover {
	cursor: pointer;
}

.contact-us input.gfield-choice-input:checked {
	background: #1273e6;
}

.contact-us input.gfield-choice-input:checked + label {
	color: white;
}

.contact-us .gchoice label {
	position: relative;
	top: 50%;
	z-index: 3;
	display: block;
	width: 100%;
	max-width: 100%;
	padding: 0 0 0 40px;
	overflow: visible;
	font-weight: 400;
	color: #fff;
	transform: translateY(-50%);
}

.contact-us input.gfield-choice-input + label::after {
	position: absolute;
	top: 50%;
	left: 0;
	z-index: 2;
	width: 30px;
	height: 30px;
	font-size: 25px;
	font-weight: 500;
	line-height: 25px;
	color: white;
	text-align: center;
	content: "";
	border: 2px solid #c5c9d2;
	transform: translateY(-50%);
	transition: 0.3s all ease-in-out;
}

.contact-us input[type="checkbox"].gfield-choice-input + label::after {
	border-radius: 0;
}

.contact-us input[type="radio"].gfield-choice-input + label::after {
	border-radius: 50px;
}

.contact-us input.gfield-choice-input:checked + label::after {
	content: "\00D7";
	border: 2px solid white;
}

input#choice_3_10_1 {
	border: none !important;
}

.gchoice.gchoice_3_10_1 {
	display: flex;
	align-items: baseline;
	padding: 0 !important;
}

.contact-us .gfield-choice-input + label {
	max-width: 100% !important;
	vertical-align: top;
}

.contact-us input[type="checkbox"].gfield-choice-input + label::after {
	top: 20px;
	border-radius: 0;
}

@media only screen and (max-width: 768px) {
	.contact-us .gchoice {
		height: 200px !important;
	}
}

input#choice_7_10_1 {
	border: none;
}