/* Small overrides for a cleaner artist portfolio adaptation of the Alpha template. */

body {
	background:
		linear-gradient(180deg, rgba(22, 29, 35, 0.08), rgba(22, 29, 35, 0)),
		#f3f0ea;
}

body, input, select, textarea {
	color: #514b45;
}

a {
	color: #8a5a44;
}

h1, h2, h3, h4, h5, h6 {
	color: #2f2a26;
}

#header nav ul li a.button {
	box-shadow: none;
	min-width: 0;
}

#banner.hero-art {
	background:
		linear-gradient(180deg, rgba(20, 25, 27, 0.28), rgba(20, 25, 27, 0.58)),
		url("../../images/art/whale-and-mermaids.jpg");
	background-position: center center;
	background-size: cover;
	padding-top: 9rem;
	padding-bottom: 7rem;
}

#banner p {
	max-width: 42rem;
	margin-left: auto;
	margin-right: auto;
}

.section-heading {
	text-align: center;
	margin: 0 0 2rem 0;
}

.section-kicker {
	font-size: 0.8rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #8a5a44;
	margin-bottom: 0.6rem;
}

.artist-intro .image.featured img,
.art-card .image.featured img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.gallery-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2rem;
}

.artist-bio-layout {
	display: grid;
	grid-template-columns: 20rem 1fr;
	gap: 2rem;
	align-items: start;
}

.artist-bio-photo img {
	display: block;
	width: 100%;
	border-radius: 1rem;
}

.contact-panel,
.artist-bio-layout,
.art-card,
.artist-intro,
.shop-intro,
.shop-link-card {
	box-shadow: 0 1rem 2.25rem rgba(43, 37, 31, 0.08);
}

.shop-link-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
	margin-top: 2rem;
}

.shop-link-card {
	display: block;
	padding: 1.25rem 1.5rem;
	border-radius: 0.75rem;
	background: #fff;
	border: solid 1px rgba(47, 42, 38, 0.08);
}

.shop-link-card strong,
.shop-link-card span {
	display: block;
}

.shop-link-card strong {
	color: #2f2a26;
	margin-bottom: 0.35rem;
}

.shop-link-card span {
	color: #6b625a;
	font-size: 0.95rem;
}

.art-status {
	display: inline-block;
	margin: 0 0 0.85rem 0;
	padding: 0.28rem 0.7rem;
	border-radius: 999px;
	background: rgba(138, 90, 68, 0.12);
	color: #8a5a44;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.art-meta {
	margin: 0 0 0.35rem 0;
	font-size: 0.95rem;
	line-height: 1.55em;
}

#cta {
	background:
		linear-gradient(135deg, rgba(69, 88, 92, 0.96), rgba(124, 87, 68, 0.95));
}

#cta .actions {
	margin-top: 2rem;
}

#cta .actions .button {
	min-width: 12rem;
}

@media screen and (max-width: 980px) {
	.gallery-grid,
	.artist-bio-layout,
	.shop-link-grid {
		grid-template-columns: 1fr;
	}
}
