/*-------------------------------------------------------
Patterns
-------------------------------------------------------*/

/*
Section
*/

.section {
	position: relative;
}

/*
Section Header
*/

.section__header,
.page-header.grid {
	grid-template-areas:
		"a a a a"
		"b b b b";
}

@media only screen and (min-width: 600px) {
	.section__header,
	.page-header.grid {
		grid-template-areas:
			"a a a a a a a a"
			". . . . b b b b";
	}
}

@media only screen and (min-width: 768px) {
	.section__header,
	.page-header.grid {
		grid-template-areas: "a a a a a a b b";
	}
}

@media only screen and (min-width: 960px) {
	.section__header,
	.page-header.grid {
		grid-template-areas: "a a a a a a a a a b b b";
	}
}

.section__header h1,
.section__header h2,
.page-header.grid h1 {
	grid-area: a;
}

.section__header p,
.page-header.grid p {
	grid-area: b;
}

/*-------------------------------------------------------
Pattern "About Us"
-------------------------------------------------------*/

/*
Image
*/

@media only screen and (max-width: 767px) {
	.section--about-us .about-us__image img {
		aspect-ratio: 3/2 !important;
	}
}

/*
Large text
*/

.section--about-us .about-us__text--large {
	font-size: clamp(1.3125rem, 2.10938vw + 0.89063rem, 3rem);
	line-height: 1.3;
}

@media only screen and (min-width: 600px) {
	.section--about-us .about-us__text--large {
		line-height: 1.15;
	}
}

@media only screen and (min-width: 960px) {
	.section--about-us .about-us__text--large {
		line-height: 1.1;
	}
}

/*
Text
*/

.section--about-us .about-us__text {
	grid-template-areas:
		"a a a a"
		"b b b b"
		"c c c c";
}

@media only screen and (min-width: 600px) {
	.section--about-us .about-us__text {
		grid-template-areas:
			"a a a a b b b b"
			"c c c c c c c c";
	}
}

@media only screen and (min-width: 960px) {
	.section--about-us .about-us__text {
		grid-template-areas: "a a a a b b b b c c c c";
	}
}

.section--about-us .about-us__text > :nth-child(1) {
	grid-area: a;
}

.section--about-us .about-us__text > :nth-child(2) {
	grid-area: b;
}

.section--about-us .about-us__text > :nth-child(3) {
	grid-area: c;
}

/*-------------------------------------------------------
Pattern "About Us 2"
-------------------------------------------------------*/

.section--about-us-2 .about-us__text--large {
	font-size: clamp(1.5rem, 2.8125vi + 0.9375rem, 3.75rem) !important;
}

/*-------------------------------------------------------
Pattern "Our Team"
-------------------------------------------------------*/

/*
Artists list
*/

.section--our-team .artists-list {
	gap: calc(var(--wp--style--block-gap) * 1.5) var(--wp--style--block-gap);
}

.section--our-team .artist-card {
	grid-column: span 4 / auto;
}

@media only screen and (min-width: 480px) {
	.section--our-team .artist-card {
		grid-column: span 2 / auto;
	}
}

@media only screen and (min-width: 600px) {
	.section--our-team .artist-card {
		grid-column: span 4 / auto;
	}
}

@media only screen and (min-width: 960px) {
	.section--our-team .artist-card {
		grid-column: span 3 / auto;
	}
}

/*
Text
*/

.section--our-team .text--large > p {
	font-size: clamp(1.3125rem, 0.70313vw + 1.17188rem, 1.875rem);
	line-height: 1.3;
}

@media only screen and (min-width: 600px) {
	.section--our-team .text--large > p {
		line-height: 1.15;
	}
}

@media only screen and (min-width: 960px) {
	.section--our-team .text--large > p {
		line-height: 1.13333;
	}
}

/*-------------------------------------------------------
Pattern "Latest Projects"
-------------------------------------------------------*/

/*
Projects list
*/

.section--latest-projects .projects-list {
	grid-auto-rows: 1fr;
}

.section--latest-projects .project-card {
	grid-column: span 4 / auto;
}

@media only screen and (min-width: 480px) {
	.section--latest-projects .project-card {
		grid-column: span 2 / auto;
	}
}

@media only screen and (min-width: 600px) {
	.section--latest-projects .project-card {
		grid-column: span 4 / auto;
	}
}

@media only screen and (min-width: 960px) {
	.section--latest-projects .project-card {
		grid-column: span 3 / auto;
	}
}

/*
View more link
*/

.section--latest-projects .view-more-projects p {
	height: 100%;
}

.section--latest-projects .view-more-projects a {
	height: 100%;
	display: flex;
	align-items: flex-end;
	padding: var(--wp--preset--spacing--20);

	text-decoration: none;
	border: 1px solid var(--wp--preset--color--contrast-borders);
}

.section--latest-projects .view-more-projects a:hover,
.section--latest-projects .view-more-projects a:focus,
.section--latest-projects .view-more-projects a:active {
	color: var(--wp--preset--color--base);
	background-color: var(--wp--preset--color--contrast);
	border-color: var(--wp--preset--color--contrast);
}

/*-------------------------------------------------------
Pattern "Reviews"
-------------------------------------------------------*/

/*
Reviews list
*/

.section--reviews .review {
	grid-column: span 4 / auto;
}

@media only screen and (min-width: 600px) {
	.section--reviews .review {
		grid-column: span 4 / auto;
	}
}

@media only screen and (min-width: 960px) {
	.section--reviews .review {
		grid-column: span 6 / auto;
	}
}

@media only screen and (min-width: 1200px) {
	.section--reviews .review {
		grid-column: span 3 / auto;
	}
}

/*-------------------------------------------------------
Pattern "Latest Posts"
-------------------------------------------------------*/

/*
Posts List
*/

.section--latest-posts .section__content {
	grid-template-areas: "a a a a";
}

@media only screen and (min-width: 600px) {
	.section--latest-posts .section__content {
		grid-template-areas: "a a a a a a a a";
	}
}

@media only screen and (min-width: 960px) {
	.section--latest-posts .section__content {
		grid-template-areas: ". . . a a a a a a a a a";
	}
}

.section--latest-posts .posts-list {
	grid-area: a;
}

@media only screen and (min-width: 782px) {
	.section--latest-posts .posts-list .wp-block-post-date {
		text-align: right;
	}
}

/*
Read all link
*/

.section--latest-posts .read-all-link a {
	text-decoration: none;
}

/*-------------------------------------------------------
Pattern "Business Numbers"
-------------------------------------------------------*/

/*
Numbers List
*/

.section--business-numbers .numbers-list {
	gap: calc(var(--wp--style--block-gap) * 2) var(--wp--style--block-gap);
}

.section--business-numbers .number-card {
	grid-column: span 4 / auto;
	aspect-ratio: 3/4;
}

@media only screen and (min-width: 480px) {
	.section--business-numbers .number-card {
		grid-column: span 2 / auto;
	}
}

@media only screen and (min-width: 600px) {
	.section--business-numbers .number-card {
		grid-column: span 4 / auto;
	}
}

@media only screen and (min-width: 960px) {
	.section--business-numbers .number-card {
		grid-column: span 3 / auto;
	}
}

@media only screen and (min-width: 480px) {
	.section--business-numbers .number-card:nth-child(1) { order: 1; }
	.section--business-numbers .number-card:nth-child(2) { order: 2; }
	.section--business-numbers .number-card:nth-child(3) { order: 4; }
	.section--business-numbers .number-card:nth-child(4) { order: 3; }
	.section--business-numbers .number-card:nth-child(5) { order: 5; }
	.section--business-numbers .number-card:nth-child(6) { order: 6; }
	.section--business-numbers .number-card:nth-child(7) { order: 8; }
	.section--business-numbers .number-card:nth-child(8) { order: 7; }
}

@media only screen and (min-width: 960px) {
	.section--business-numbers .number-card:nth-child(1) { order: 1; }
	.section--business-numbers .number-card:nth-child(2) { order: 2; }
	.section--business-numbers .number-card:nth-child(3) { order: 3; }
	.section--business-numbers .number-card:nth-child(4) { order: 4; }
	.section--business-numbers .number-card:nth-child(5) { order: 6; }
	.section--business-numbers .number-card:nth-child(6) { order: 5; }
	.section--business-numbers .number-card:nth-child(7) { order: 8; }
	.section--business-numbers .number-card:nth-child(8) { order: 7; }
}

.section--business-numbers .number-card > :first-child {
	font-size: 5.25rem;
	line-height: 0.9;
}

/*-------------------------------------------------------
Pattern "Contacts"
-------------------------------------------------------*/

/*
Contacts list
*/

.section--contacts .contacts-list p {
	grid-column: span 4 / auto;
}

@media only screen and (min-width: 600px) {
	.section--contacts .contacts-list p {
		grid-column: span 4 / auto;
	}
}

@media only screen and (min-width: 960px) {
	.section--contacts .contacts-list p {
		grid-column: span 4 / auto;
	}

	.section--contacts .contacts-list p:nth-child(2) {
		text-align: center;
	}

	.section--contacts .contacts-list p:nth-child(3) {
		text-align: right;
	}
}

/*-------------------------------------------------------
Pattern "Site Title"
-------------------------------------------------------*/

.section--site-title {
	overflow: hidden;
}

.section--site-title .site-title {
	font-size: 19vw;
	line-height: 0.9;
	text-align: center;
}

@media only screen and (min-width: 600px) {
	.section--site-title .site-title {
		font-size: 20vw;
		line-height: 0.85;
	}
}

@media only screen and (min-width: 960px) {
	.section--site-title .site-title {
		font-size: 20.75vw;
		line-height: 0.8;
	}
}

/*-------------------------------------------------------
Pattern "Gallery Row"
-------------------------------------------------------*/

.section--gallery-row .section__content {
	gap: 0.5rem;
}

.section--gallery-row .wp-block-image {
	grid-column: span 1 / auto;
}

@media only screen and (min-width: 600px) and (max-width: 959px) {
	.section--gallery-row .wp-block-image:nth-child(9),
	.section--gallery-row .wp-block-image:nth-child(10),
	.section--gallery-row .wp-block-image:nth-child(11),
	.section--gallery-row .wp-block-image:nth-child(12) {
		display: none;
	}
}

/*-------------------------------------------------------
Pattern "Gallery"
-------------------------------------------------------*/

.section--gallery .wp-block-image {
	grid-column: span 4 / auto;
}

@media only screen and (min-width: 480px) {
	.section--gallery .wp-block-image {
		grid-column: span 2 / auto;
	}
}

@media only screen and (min-width: 600px) {
	.section--gallery .wp-block-image {
		grid-column: span 4 / auto;
	}
}

@media only screen and (min-width: 960px) {
	.section--gallery .wp-block-image {
		grid-column: span 3 / auto;
	}
}

/*-------------------------------------------------------
Pattern "Page About Us"
-------------------------------------------------------*/

/*
Contact form
*/

@media only screen and (min-width: 768px) {
	.page-content .contact-form {
		grid-column: 1 / -1;
	}

	.page-content .contact-info {
		grid-column: 1 / -1;
	}
}

@media only screen and (min-width: 960px) {
	.page-content .contact-form {
		grid-column: 1 / 9;
	}

	.page-content .contact-info {
		grid-column: 9 / 13;
	}
}

.contact-form__wrapper {
	padding: clamp(1rem, 2.5vi + 0.5rem, 3rem);
}

/*
Contact info
*/

.contact-info {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: auto;
	gap: var(--wp--style--block-gap);
	align-content: start;
}

@media only screen and (max-width: 959px) {
	.contact-info {
		margin-top: var(--wp--preset--spacing--30) !important;
	}
}

/*
Contact info block
*/

.contact-info__block {
	grid-column: span 2 / auto;
}

@media only screen and (min-width: 600px) {
	.contact-info__block {
		grid-column: span 1 / auto;
	}
}

@media only screen and (min-width: 960px) {
	.contact-info__block {
		grid-column: span 2 / auto;
	}
}

.contact-info__block a {
	text-decoration: none;
}