/* 景氣燈號：以國發會景氣對策信號的五個燈號當識別，圓體標題、等寬日期。 */

body {
	--sg-width: min(60rem, 100% - var(--wp--style--root--padding-left) - var(--wp--style--root--padding-right));
}

:root {
	--sg-lamps: url("lamps.svg");
}

.av-hero {
	--wp--style--global--content-size: 100%;
	box-sizing: border-box;
	width: var(--sg-width);
	margin: 0 auto;
	padding: clamp(3rem, 9vw, 6rem) 0 clamp(2rem, 5vw, 3rem);
	border-bottom: 1px solid var(--wp--preset--color--accent-6);
}

.av-hero::before {
	content: "";
	display: block;
	width: 190px;
	height: 44px;
	margin-bottom: 2rem;
	background: var(--sg-lamps) no-repeat;
}

.av-hero .wp-block-site-title {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: clamp(2.2rem, 6vw, 4rem);
	line-height: 1.15;
	letter-spacing: 0.01em;
}

.av-hero .wp-block-site-title a {
	color: inherit;
	text-decoration: none;
}

.av-hero .wp-block-site-tagline {
	margin-top: 1rem;
	font-size: 1.1rem;
	color: var(--wp--preset--color--accent-4);
}

.av-hero__cats {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 2rem 0 0;
	padding: 0;
	list-style: none;
}

.av-hero__cats a,
.av-list__cat a {
	display: inline-block;
	padding: 0.2em 0.9em;
	border: 1px solid var(--wp--preset--color--accent-6);
	border-radius: 999px;
	background: var(--wp--preset--color--accent-5);
	color: var(--wp--preset--color--contrast);
	font-size: 0.85rem;
	text-decoration: none;
}

.av-hero__cats a:hover,
.av-list__cat a:hover {
	border-color: var(--wp--preset--color--accent-1);
	color: var(--wp--preset--color--accent-1);
}

/* 文章清單 */
.av-home {
	--wp--style--global--content-size: 60rem;
}

.av-list {
	--wp--preset--font-size--large: clamp(1.15rem, 2vw, 1.4rem);
}

.av-list .wp-block-post {
	display: grid;
	grid-template-columns: 7rem 1fr;
	column-gap: 2rem;
	row-gap: 0.4rem;
	margin: 0;
	padding: 1.6rem 0;
	border-bottom: 1px solid var(--wp--preset--color--accent-6);
}

.av-list__date {
	grid-row: 1 / span 3;
	padding-top: 0.3rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.85rem;
	color: var(--wp--preset--color--accent-4);
}

.av-list__title,
.av-list__cat,
.av-list__excerpt,
.av-list .post-password-required::after {
	grid-column: 2;
}

.av-list__title {
	margin: 0;
	line-height: 1.45;
}

.av-list__title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.av-list__title a:hover {
	color: var(--wp--preset--color--accent-1);
}

.av-list__cat a {
	padding: 0.05em 0.7em;
	font-size: 0.75rem;
}

.av-list__excerpt {
	font-size: 0.95rem;
	color: var(--wp--preset--color--accent-4);
}

.av-list__excerpt p {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

.av-list .post-password-required .av-list__excerpt {
	display: none;
}

.av-list .post-password-required::after {
	content: "付費文章";
	justify-self: start;
	font-size: 0.8rem;
	color: var(--wp--preset--color--accent-4);
}

/* 單篇文章 */
header.wp-block-template-part .wp-block-site-title {
	font-family: var(--wp--preset--font-family--heading);
}

header.wp-block-template-part .wp-block-site-title::before {
	content: "";
	display: inline-block;
	width: 102px;
	height: 13px;
	margin-right: 0.6rem;
	background: var(--sg-lamps) 0 0 / 106px 25px no-repeat;
	vertical-align: -1px;
}

.av-paywall {
	border: 1px solid var(--wp--preset--color--accent-6);
	border-radius: 16px;
	background: var(--wp--preset--color--accent-5);
}

.av-paywall::before {
	content: "";
	display: block;
	width: 190px;
	height: 44px;
	margin: 0 auto 0.5rem;
	background: var(--sg-lamps) no-repeat;
}

.av-paywall__price {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1.4rem;
}

@media (max-width: 600px) {
	.av-list .wp-block-post {
		grid-template-columns: 1fr;
	}

	.av-list__date {
		grid-row: auto;
		padding: 0;
	}

	.av-list__title,
	.av-list__cat,
	.av-list__excerpt,
	.av-list .post-password-required::after {
		grid-column: 1;
	}
}