/**
 * Page section layout.
 *
 * The live pages were laid out with a page builder; these rules reproduce the
 * same grid (boxed/full-width sections, columns, column gaps, widget spacing,
 * overlays and buttons) under theme class names, so the CityBook styles in
 * main.css line up exactly as before.
 */

.gt-sections *,
.gt-sections :after,
.gt-sections :before {
	box-sizing: border-box;
}
.gt-sections a {
	box-shadow: none;
	text-decoration: none;
}
.gt-sections img {
	border: none;
	border-radius: 0;
	box-shadow: none;
	height: auto;
	max-width: 100%;
}
.gt-sections embed,
.gt-sections iframe,
.gt-sections object,
.gt-sections video {
	border: none;
	line-height: 1;
	margin: 0;
	max-width: 100%;
	width: 100%;
}

/* First screen ------------------------------------------------------------
   The header and the home hero fill exactly the first screen at every size,
   with "Let's Start" on the hero's bottom edge. svh keeps clear of mobile
   browser toolbars; vh is the fallback for older browsers. */

:root {
	--gt-header-h: 80px;
	--gt-bar-h: 0px;
}
body.admin-bar {
	--gt-bar-h: 32px;
}
@media screen and (max-width: 782px) {
	body.admin-bar {
		--gt-bar-h: 46px;
	}
}
/* The admin bar pushes the fixed header down; move the page down with it. */
body.admin-bar #wrapper {
	padding-top: calc(var(--gt-header-h) + var(--gt-bar-h));
}
section.gt-hero-section.hero-section {
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: calc(100vh - var(--gt-header-h) - var(--gt-bar-h));
	height: calc(100svh - var(--gt-header-h) - var(--gt-bar-h));
	min-height: 340px;
	padding: 30px 0 100px;
}

/* Sections, containers, columns ------------------------------------------ */

.gt-section {
	position: relative;
}
.gt-section .gt-container {
	display: flex;
	margin-inline: auto;
	position: relative;
}
.gt-bg-overlay {
	inset: 0;
	position: absolute;
}
/* Backgrounds drawn with <picture> (inc/core/images.php) cover like background-size: cover. */
.gt-media-bg picture,
.gt-media-bg img {
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
.gt-media-bg img {
	max-width: none;
	object-fit: cover;
	object-position: center;
}
.gt-column {
	display: flex;
	min-height: 1px;
	position: relative;
}
.gt-widget-wrap {
	align-content: flex-start;
	display: flex;
	flex-wrap: wrap;
	position: relative;
	width: 100%;
}
.gt-widget-wrap > .gt-widget,
.gt-widget-wrap > .gt-inner-section {
	width: 100%;
}
.gt-widget {
	position: relative;
}
.gt-widget:not(:last-child) {
	margin-block-end: 20px;
}
.gt-gap-default > .gt-column > .gt-populated {
	padding: 10px;
}
.gt-gap-extended > .gt-column > .gt-populated {
	padding: 15px;
}
.gt-gap-wider > .gt-column > .gt-populated {
	padding: 30px;
}
.gt-gap-steps > .gt-column > .gt-populated {
	padding: 30px 30px 0;
}

@media (max-width: 1024px) {
	.gt-section .gt-container {
		flex-wrap: wrap;
	}
}
@media (min-width: 768px) {
	.gt-col-25 { width: 25%; }
	.gt-col-33 { width: 33.333%; }
	.gt-col-50 { width: 50%; }
	.gt-col-66 { width: 66.666%; }
	.gt-col-100 { width: 100%; }
}
@media (max-width: 767px) {
	.gt-column {
		width: 100%;
	}
}

/* Section spacing and backgrounds ----------------------------------------- */

.gt-section.gt-pad-80 { padding: 80px 0; }
.gt-section.gt-pad-t80 { padding: 80px 0 0; }
.gt-section.gt-pad-b80 { padding: 0 0 80px; }
.gt-section.gt-mb-30 { margin-bottom: 30px; }

.gt-section.gt-bg-cover {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
@media (min-width: 1025px) {
	.gt-section.gt-bg-fixed {
		background-attachment: fixed;
	}
}
.gt-overlay-shapes {
	background-image: url(../images/bg/shapes-big.png);
	background-image: image-set(url(../images/bg/shapes-big.webp) type("image/webp"), url(../images/bg/shapes-big.png) type("image/png"));
	background-repeat: repeat;
	opacity: 0.3;
}
.gt-overlay-circle {
	background-image: url(../images/bg/circle.png);
	background-image: image-set(url(../images/bg/circle.webp) type("image/webp"), url(../images/bg/circle.png) type("image/png"));
	background-position: center right;
	background-repeat: no-repeat;
	opacity: 0.1;
}
.gt-overlay-dark {
	background-color: #000;
	opacity: 0.5;
}
.gt-section.gt-align-center > .gt-container,
.gt-align-center {
	text-align: center;
}

/* Widgets ------------------------------------------------------------------ */

.gt-text {
	color: #7a7a7a;
	font-family: "Roboto", Sans-serif;
	font-weight: 400;
}
.gt-text.gt-text-large {
	font-size: 73px;
}

.gt-heading-title {
	color: #030303;
	font-family: "Roboto", Sans-serif;
	font-size: 59px;
	font-weight: 600;
	line-height: 1;
	margin: 0;
	padding: 0;
	text-align: center;
}

.gt-spacer {
	height: 50px;
}

.gt-divider {
	display: flex;
	padding-block: 15px;
}
.gt-divider span {
	border-block-start: 1px solid #eee;
	display: flex;
	margin: 0;
	width: 100%;
}

/* "Get in touch" / "Sign up" button in the join band. */
.gt-button {
	background-color: #fff;
	border-radius: 30px;
	color: #000;
	display: inline-block;
	fill: #000;
	font-family: "Roboto", Sans-serif;
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	padding: 20px 55px;
	text-align: center;
	transition: all 0.3s;
}
/* Scoped so the ring outranks the link reset at the top of this file. */
.gt-sections .gt-button {
	box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.4);
}
.gt-button.gt-size-md {
	font-size: 16px;
}
.gt-button:hover,
.gt-button:focus {
	background-color: #2c3b5a;
	color: #fff;
}
.gt-button span {
	text-decoration: inherit;
}
.gt-button-content-wrapper {
	display: flex;
	flex-direction: row-reverse;
	gap: 5px;
	justify-content: center;
}
.gt-button-icon {
	align-items: center;
	display: flex;
}
.gt-button-text {
	display: inline-block;
}

/* Contact page card. */
.gt-container > .gt-card-column > .gt-populated {
	border: 1px solid #eee;
	border-radius: 10px;
	margin: 10px;
	padding: 30px;
}
.gt-contact-form-widget {
	max-width: 91.806%;
	width: 91.806%;
}
/* A custom-width widget had no bottom spacing on the live page. */
.gt-widget.gt-contact-form-widget:not(:last-child) {
	margin-block-end: 0;
}
/* Form on the left, details on the right; stacked (form first) below 992px. */
.gt-contact-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 30px;
}
.gt-contact-layout .gt-contact-form-widget {
	max-width: 100%;
	width: 100%;
}
.gt-contact-aside {
	border-top: 1px solid #eee;
	padding-top: 30px;
}
@media (min-width: 992px) {
	.gt-contact-layout {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	}
	.gt-contact-main {
		padding-right: 40px;
	}
	.gt-contact-aside {
		border-top: 0;
		border-left: 1px solid #eee;
		padding: 0 0 0 40px;
	}
}
.gt-contact-aside .list-author-widget-contacts {
	margin-top: 20px;
}
.gt-contact-aside .list-author-widget-contacts li a {
	margin-left: 0;
	overflow-wrap: anywhere;
}
.gt-contact-follow h4 {
	margin: 22px 0 0;
	font-size: 14px;
	font-weight: 600;
	color: #334e6f;
	text-align: left;
}
.gt-contact-follow .list-widget-social {
	margin-top: 12px;
}
.list-widget-social li a .gt-social-svg {
	width: 14px;
	height: 14px;
	fill: currentColor;
	vertical-align: -2px;
}
.list-author-widget-contacts ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.list-author-widget-contacts li {
	align-items: center;
	display: flex;
	gap: 10px;
	margin-bottom: 8px;
}
.list-author-widget-contacts li span {
	font-weight: bold;
	min-width: 100px;
}
.list-author-widget-contacts a {
	color: #007bff;
	text-decoration: none;
}
.list-author-widget-contacts a:hover {
	text-decoration: underline;
}

/* Theme forms that replace Contact Form 7 keep its message look. */
.gt-form-message {
	display: none;
	margin: 2em 0.5em 1em;
	padding: 0.2em 1em;
	border: 2px solid #ffb900;
}
.gt-form-message.show {
	display: block;
}
.gt-form-message.success {
	border-color: #46b450;
}
.gt-form-message.error {
	border-color: #dc3232;
}
.gt-hp {
	height: 1px;
	left: -9999px;
	overflow: hidden;
	position: absolute;
	width: 1px;
}
