/*
Theme Name: biegao Apple A
Description: A light, spacious billboard design for biegao. Child theme of Frost.
Author: biegao
Template: frost
Version: 1.4.0
Requires at least: 6.7
Requires PHP: 7.4
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: biegao-apple-a
Tags: blog, block-styles, custom-menu, editor-style, full-site-editing, one-column, wide-blocks
*/

/* Shared with the block editor; no fonts, images, or scripts are downloaded. */
:root {
	--bg-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
	--bg-ink: #1d1d1f;
	--bg-muted: #6e6e73;
	--bg-blue: #0071e3;
	--bg-blue-small: #0066cc;
	--bg-wash: #f5f5f7;
	--bg-line: #d2d2d7;
	--bg-radius: 18px;
	--bg-gutter: clamp(20px, 4vw, 48px);
	--bg-card-padding: 24px;
	--bg-shadow: 0 4px 20px rgb(29 29 31 / 4%);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	color-scheme: light;
	scroll-padding-top: 96px;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	margin: 0;
	background: #fff;
	color: var(--bg-ink);
	font-family: var(--bg-font);
	font-weight: 400;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}

body .wp-site-blocks {
	padding-top: 0;
	padding-bottom: 0;
	/* Root-aware constrained blocks supply content gutters; the site stays full width. */
	padding-inline: 0;
}

.wp-site-blocks :where(.is-layout-flex, .is-layout-grid) > * {
	min-width: 0;
}

:where(h1, h2, h3, h4, h5, h6) {
	overflow-wrap: break-word;
	word-break: normal;
	text-wrap: pretty;
}

:where(p, li, dd, dt, figcaption),
.wp-block-post-terms {
	overflow-wrap: break-word;
	word-break: normal;
	text-wrap: pretty;
}

:where(img, video, audio, iframe, canvas, svg) {
	min-width: 0;
	max-width: 100%;
}

:where(.wp-site-blocks) :where(figure, .wp-block-embed, .wp-block-embed__wrapper) {
	min-width: 0;
	max-width: 100%;
}

a {
	text-underline-offset: 0.2em;
	transition: color 160ms ease, background-color 160ms ease;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--bg-blue);
	outline-offset: 4px;
}

body b,
body strong,
body th {
	font-weight: 600;
}

/* Root-aware layouts already reach the viewport. A second pull-out here overflows. */
.site-header,
.site-footer {
	min-width: 0;
	margin-inline: 0;
	padding-inline: 0;
}

/* The template-part wrapper still owns sticky positioning and the full-width glass. */
.site-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 100;
	margin-block: 0;
	border-bottom: 1px solid rgb(29 29 31 / 7%);
	background: rgb(255 255 255 / 94%);
	-webkit-backdrop-filter: saturate(180%) blur(20px);
	backdrop-filter: saturate(180%) blur(20px);
}

@supports ((backdrop-filter: blur(20px)) or (-webkit-backdrop-filter: blur(20px))) {
	.site-header {
		background: rgb(255 255 255 / 78%);
	}
}

.site-header .bg-header-shell,
.site-footer .bg-footer-shell {
	width: 100%;
	max-width: 100%;
	margin: 0 !important;
	/* One padding layer, including when an older saved part still has alignfull. */
	padding-left: max(var(--bg-gutter), env(safe-area-inset-left, 0px));
	padding-right: max(var(--bg-gutter), env(safe-area-inset-right, 0px));
}

.bg-header-inner,
.bg-footer-inner {
	display: flex;
	min-width: 0;
	align-items: center;
	justify-content: space-between;
	max-width: var(--wp--style--global--wide-size, 1200px);
	margin-inline: auto;
}

.bg-header-inner {
	min-height: 64px;
	gap: 32px;
	flex-wrap: nowrap;
}

.bg-header-inner .bg-wordmark {
	flex: 0 0 auto;
	margin: 0;
	font-family: var(--bg-font);
	font-size: 25px;
	font-weight: 650;
	letter-spacing: -0.055em;
	line-height: 1.2;
}

.bg-wordmark a {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	color: var(--bg-ink);
	text-decoration: none;
}

.bg-primary-nav,
.bg-footer-nav {
	min-width: 0;
	max-width: 100%;
	margin: 0;
	color: var(--bg-ink);
	font-size: 14px;
	font-weight: 400;
}

:is(.bg-primary-nav, .bg-footer-nav) :is(.wp-block-navigation__responsive-container, .wp-block-navigation__responsive-close, .wp-block-navigation__responsive-dialog, .wp-block-navigation__responsive-container-content, .wp-block-navigation__container, .wp-block-navigation-item) {
	min-width: 0;
	max-width: 100%;
}

:is(.bg-primary-nav, .bg-footer-nav) .wp-block-navigation-item__label {
	min-width: 0;
	overflow-wrap: anywhere;
}

.bg-primary-nav .wp-block-navigation__container {
	gap: clamp(16px, 2vw, 28px);
}

.bg-primary-nav .wp-block-navigation-item__content,
.bg-footer-nav .wp-block-navigation-item__content {
	display: inline-flex;
	min-width: 0;
	max-width: 100%;
	min-height: 44px;
	align-items: center;
	color: inherit;
	text-decoration: none;
}

:is(.bg-primary-nav, .bg-footer-nav) .wp-block-navigation-item__content:hover,
:is(.bg-primary-nav, .bg-footer-nav) .current-menu-item > .wp-block-navigation-item__content,
:is(.bg-primary-nav, .bg-footer-nav) [aria-current="page"] {
	color: var(--bg-blue);
}

/* Override Frost's dark submenu while keeping core's keyboard behavior. */
body .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
	padding: 8px;
	border: 1px solid rgb(29 29 31 / 8%);
	border-radius: 12px;
	background: #fff;
	color: var(--bg-ink);
	box-shadow: 0 12px 32px rgb(29 29 31 / 8%);
}

.bg-primary-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 8px 12px;
	border-radius: 6px;
}

.bg-primary-nav .wp-block-navigation__responsive-container-open,
.bg-primary-nav .wp-block-navigation__responsive-container-close {
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	padding: 10px;
	border: 0;
	border-radius: 50%;
	color: var(--bg-ink);
	background: transparent;
}

.bg-primary-nav .wp-block-navigation__responsive-container-open:hover,
.bg-primary-nav .wp-block-navigation__responsive-container-close:hover {
	background: var(--bg-wash);
	color: var(--bg-blue);
}

/* A filtered ancestor otherwise confines the native fixed mobile overlay. */
.site-header:has(.is-menu-open) {
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

.wp-block-navigation.bg-primary-nav .wp-block-navigation__responsive-container.is-menu-open {
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	position: fixed;
	inset: 0;
	padding-top: max(24px, env(safe-area-inset-top, 0px));
	padding-right: max(var(--bg-gutter), env(safe-area-inset-right, 0px));
	padding-bottom: max(24px, env(safe-area-inset-bottom, 0px));
	padding-left: max(var(--bg-gutter), env(safe-area-inset-left, 0px));
	background: #fff;
	color: var(--bg-ink);
}

/* Core repeats items-justified-right on the inner list and can load after the child.
 * Reset its variables there too; (0,5,0) beats both right-justification classes.
 * Only the open overlay changes: desktop navigation keeps its right alignment. */
.wp-block-navigation.bg-primary-nav .wp-block-navigation__responsive-container.is-menu-open :is(.wp-block-navigation__responsive-container-content, .wp-block-navigation__container, .wp-block-navigation__submenu-container, .wp-block-navigation-item, .wp-block-navigation-item__content) {
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	width: 100%;
	justify-content: flex-start;
	text-align: left;
}

.wp-block-navigation.bg-primary-nav .wp-block-navigation__responsive-container.is-menu-open :is(.wp-block-navigation__responsive-container-content, .wp-block-navigation__container, .wp-block-navigation__submenu-container, .wp-block-navigation-item) {
	align-items: flex-start;
}

.wp-block-navigation.bg-primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	max-width: 1200px;
	margin-inline: auto;
	padding-block: 64px 32px;
}

.wp-block-navigation.bg-primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 16px;
	font-size: 24px;
}

.wp-block-navigation.bg-primary-nav .wp-block-navigation__responsive-container.is-menu-open :is(.wp-block-navigation-item, .wp-block-navigation-item__content) {
	min-height: 56px;
}

.bg-primary-nav .is-menu-open .wp-block-navigation__responsive-container-close {
	display: flex;
	top: 0;
	right: 0;
	left: auto;
}

.wp-block-navigation.bg-primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	/* Core's desktop submenu min-width must not push a nested mobile menu out. */
	min-width: 0;
	max-width: 100%;
	padding: 8px 0 8px 20px;
	border: 0;
	box-shadow: none;
	font-size: 18px;
}

/* Home content remains the published page; no duplicate title or sample blocks. */
.bg-front-page {
	margin-block-start: 0;
}

.bg-home-content {
	padding-bottom: clamp(72px, 8vw, 112px);
}

.bg-hero {
	padding-block: clamp(160px, 13.4vw, 200px) !important;
	background: #fff;
	text-align: center;
}

.bg-hero .bg-hero-title,
.bg-hero h1 {
	max-width: 1000px;
	margin: 0 auto;
	color: var(--bg-ink);
	font-size: clamp(56px, 5vw, 72px) !important;
	font-weight: 650;
	letter-spacing: -0.045em;
	line-height: 1.15;
}

.bg-hero .bg-hero-desc {
	max-width: 680px;
	margin: 24px auto 0;
	color: var(--bg-muted);
	font-size: clamp(20px, 2vw, 26px);
	font-weight: 400;
	line-height: 1.7;
	text-wrap: pretty;
}

.bg-hero .wp-block-buttons {
	justify-content: center;
	margin-top: 32px;
}

.bg-section-title,
.bg-home-content > h2 {
	margin-block: clamp(72px, 7vw, 104px) 32px;
	color: var(--bg-ink);
	font-size: clamp(28px, 3vw, 40px);
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 1.25;
	text-align: center;
}

.bg-hero + .bg-section-title,
.bg-hero + h2 {
	margin-top: 0;
}

.bg-cats {
	display: grid !important;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	align-items: stretch !important;
	gap: 16px;
	margin-block: 32px 0;
}

.bg-cats > .wp-block-column {
	width: auto;
	max-width: 100%;
	min-width: 0;
	margin: 0 !important;
}

.bg-cats > .wp-block-column:not(.bg-cat-card) {
	display: flex;
}

.bg-cats .bg-cat-card {
	display: flex;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	min-height: 0;
	flex-direction: column;
	align-items: flex-start;
	padding: 22px 20px;
	border: 1px solid rgb(29 29 31 / 2%);
	border-radius: var(--bg-radius);
	background: var(--bg-wash);
	box-shadow: var(--bg-shadow);
	transition: transform 200ms ease, box-shadow 200ms ease;
}

.bg-cat-card > * {
	min-width: 0;
	max-width: 100%;
}

.bg-cat-card :is(h2, h3, h4) {
	margin: 0;
	color: var(--bg-ink);
	font-size: clamp(18px, 1.6vw, 22px);
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.4;
}

.bg-cat-card p {
	margin-block: 8px 0;
	color: var(--bg-muted);
	font-size: 14px;
	line-height: 1.7;
}

.bg-cat-card > :last-child:has(a),
.bg-cat-card > .wp-block-buttons {
	margin-top: auto;
	padding-top: 12px;
}

.bg-cat-card a,
.bg-cat-card .wp-block-button__link {
	color: var(--bg-blue);
	font-size: 14px;
	text-decoration: none;
}

.bg-cat-card :is(h2, h3, h4) a {
	color: inherit;
	font-size: inherit;
}

.bg-cat-card .wp-block-button__link {
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.bg-cat-card a:hover {
	text-decoration: underline;
}

/* Both the existing homepage Query Loop and archive part use these classes. */
.bg-latest .wp-block-post-template {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/*
 * Core's legacy flex rule (specificity 0,4,1) from 600px:
 *   .wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li
 *   { width: calc(33.33333% - .83333em); }
 * Percentage width on a grid item is relative to its *cell*, so cards collapse
 * to ~1/3 of a 1/3 column. The (0,5,1) selector below beats that at every
 * breakpoint, including 2-col and 1-col grids that still carry columns-3.
 */
.bg-latest .wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li,
.bg-latest .wp-block-post-template.is-flex-container.is-flex-container.columns-2 > li,
.bg-latest .wp-block-post-template.is-flex-container > li,
.bg-latest .wp-block-post-template > .wp-block-post {
	box-sizing: border-box;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0;
	justify-self: stretch;
	margin: 0;
}

.bg-post-card {
	display: flex;
	width: 100%;
	max-width: 100%;
	height: 100%;
	min-width: 0;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--bg-radius);
	background: var(--bg-wash);
	box-shadow: var(--bg-shadow);
	transition: transform 200ms ease, box-shadow 200ms ease;
}

/* Published homepage cards have has-global-padding but no body wrapper.
 * Use only the body padding / child margins below, not a second root gutter. */
.bg-latest .bg-post-card {
	padding: 0;
}

.bg-cat-card:focus-within,
.bg-post-card:focus-within {
	outline: 3px solid var(--bg-blue);
	outline-offset: 4px;
}

.bg-post-card .wp-block-post-featured-image {
	width: 100%;
	margin: 0 !important;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #ececf0;
}

.bg-post-card .wp-block-post-featured-image a,
.bg-post-card .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.bg-post-card-body {
	display: flex;
	width: 100%;
	min-width: 0;
	flex: 1;
	flex-direction: column;
	gap: 12px;
	margin: 0;
	padding: var(--bg-card-padding);
}

.bg-post-card-body > * {
	min-width: 0;
	margin-block: 0;
}

/* Existing page cards may have no body wrapper. */
.bg-post-card > :not(.bg-post-card-body, .wp-block-post-featured-image) {
	min-width: 0;
	/* Core's constrained-layout auto margins are !important as well. */
	margin-inline: var(--bg-card-padding) !important;
}

.bg-post-card > :first-child:not(.bg-post-card-body, .wp-block-post-featured-image),
.bg-post-card > .wp-block-post-featured-image + :not(.bg-post-card-body) {
	margin-top: var(--bg-card-padding);
}

.bg-post-card > :last-child:not(.bg-post-card-body, .wp-block-post-featured-image) {
	margin-bottom: var(--bg-card-padding);
}

.bg-post-card .wp-block-post-terms,
.entry-header .wp-block-post-terms {
	font-size: 13px;
	line-height: 1.7;
}

.bg-post-card .wp-block-post-terms a,
.entry-header .wp-block-post-terms a {
	text-decoration: none;
}

/* 13px #0071e3 on #f5f5f7 is 4.31:1; #0066cc is 5.11:1 (WCAG AA). */
.bg-post-card :is(.wp-block-post-terms a, .wp-block-post-excerpt__more-link, .wp-block-read-more, .wp-block-post-date a),
.bg-cat-card a:not(:is(h2, h3, h4) a) {
	color: var(--bg-blue-small);
}

.entry-header .wp-block-post-terms a {
	color: var(--bg-blue);
}

.bg-post-card .wp-block-post-title {
	overflow-wrap: break-word;
	word-break: normal;
	font-size: clamp(21px, 2vw, 26px);
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 1.4;
	text-wrap: pretty;
}

.bg-post-card .wp-block-post-title a {
	color: var(--bg-ink);
	text-decoration: none;
}

.bg-post-card .wp-block-post-title a:hover {
	color: var(--bg-blue);
}

.bg-post-card .wp-block-post-excerpt {
	color: var(--bg-muted);
	font-size: 16px;
	line-height: 1.7;
}

.bg-post-card .wp-block-post-excerpt__excerpt {
	margin: 0;
}

.bg-post-card .wp-block-post-date {
	margin-top: auto;
	padding-top: 12px;
	color: var(--bg-muted);
	font-size: 13px;
}

.bg-empty {
	margin-block: 0;
	padding: clamp(48px, 6vw, 80px) 24px;
	border-radius: var(--bg-radius);
	background: var(--bg-wash);
	color: var(--bg-muted);
	font-size: 17px;
	line-height: 1.7;
	text-align: center;
	text-wrap: pretty;
}

.bg-empty > :first-child {
	margin-top: 0;
}

.bg-empty > :last-child {
	margin-bottom: 0;
}

.bg-latest .wp-block-post-template:empty {
	display: none !important;
}

.bg-latest .wp-block-query-pagination {
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 48px;
	font-size: 15px;
}

.bg-latest .wp-block-query-pagination-numbers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px;
	min-width: 0;
	max-width: 100%;
}

.bg-latest .wp-block-query-pagination a,
.bg-latest .wp-block-query-pagination .page-numbers {
	display: inline-flex;
	min-width: 44px;
	min-height: 44px;
	align-items: center;
	justify-content: center;
	padding: 6px 12px;
	border-radius: 22px;
	text-decoration: none;
}

.bg-latest .wp-block-query-pagination .current {
	background: var(--bg-blue);
	color: #fff;
}

/* Quiet reading layouts for category archives, posts, and existing legal pages. */
.bg-archive,
.bg-single,
.bg-page {
	box-sizing: border-box;
	min-width: 0;
	min-height: 60vh;
	margin-block-start: 0;
	/* Root padding-inline is 0 so the header can be full-bleed; restore gutters here. */
	padding-block: clamp(56px, 7vw, 96px);
	padding-inline: var(--bg-gutter);
}

:is(.bg-single, .bg-page) :where(article, .wp-block-group, .wp-block-columns, .wp-block-column, .wp-block-post-content) {
	min-width: 0;
}

.bg-archive > .wp-block-template-part {
	max-width: var(--wp--style--global--wide-size, 1200px);
}

.bg-archive-heading {
	margin-block: 0 48px;
	text-align: center;
}

.bg-archive-heading :is(h1, p) {
	margin-top: 0;
}

.bg-archive-heading .wp-block-term-description {
	max-width: 680px;
	margin: 20px auto 0;
	color: var(--bg-muted);
}

.bg-archive-heading .wp-block-term-description:empty {
	display: none;
}

.entry-header {
	margin-bottom: 40px;
}

/* Keep every reading section on the same rail, including saved block layouts. */
:is(.bg-single, .bg-page) :is(.entry-header, .wp-block-post-content, .entry-footer, .entry-comments, .bg-post-navigation, .bg-related-posts) {
	width: 100%;
	max-width: var(--wp--style--global--content-size, 760px);
	margin-inline: auto;
}

.entry-header .wp-block-post-title {
	margin-block: 16px 24px;
	font-size: clamp(28px, 3.2vw, 44px);
	line-height: 1.25;
	overflow-wrap: break-word;
	word-break: keep-all;
	text-wrap: pretty;
}

.entry-header .wp-block-post-title:first-child {
	margin-top: 0;
}

.post-meta {
	flex-wrap: wrap;
	gap: 8px 16px;
	color: var(--bg-muted);
	font-size: 14px;
}

.post-meta > * {
	min-width: 0;
	max-width: 100%;
	margin: 0;
	overflow-wrap: anywhere;
}

.post-meta a {
	color: inherit;
	text-decoration: none;
}

.bg-article-image,
.bg-article-image img {
	border-radius: 24px;
}

.bg-article-image {
	box-sizing: border-box;
	min-width: 0;
	margin-block: 40px;
	overflow: hidden;
}

.bg-article-image img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
}

:is(.bg-single, .bg-page) .wp-block-post-content {
	font-size: 18px;
	line-height: 1.7;
	overflow-wrap: break-word;
	word-break: normal;
	text-wrap: pretty;
}

:is(.bg-single, .bg-page) .wp-block-post-content :where(a, code) {
	overflow-wrap: anywhere;
}

:is(.bg-single, .bg-page) :is(h1, h2, h3, h4, h5, h6) a {
	overflow-wrap: inherit;
}

:is(.bg-single, .bg-page) .wp-block-post-content :is(h2, h3, h4, h5, h6) {
	margin-block: 1.8em 0.6em;
	line-height: 1.35;
	overflow-wrap: break-word;
	word-break: keep-all;
	text-wrap: pretty;
}

:is(.bg-single, .bg-page) .wp-block-post-content h2 {
	font-size: clamp(22px, 2.5vw, 32px);
}

:is(.bg-single, .bg-page) .wp-block-post-content h3 {
	font-size: clamp(19px, 2vw, 24px);
}

:is(.bg-single, .bg-page) .wp-block-post-content h4 {
	font-size: 18px;
}

:is(.bg-single, .bg-page) .wp-block-post-content :is(ul, ol) {
	padding-inline-start: 1.5em;
}

:is(.bg-single, .bg-page) .wp-block-post-content li + li {
	margin-top: 0.4em;
}

.wp-block-quote {
	box-sizing: border-box;
	padding: clamp(20px, 3vw, 32px);
	border-radius: 16px;
}

.wp-block-quote > :first-child {
	margin-top: 0;
}

.wp-block-quote > :last-child {
	margin-bottom: 0;
}

:where(pre, .wp-block-code, .wp-block-preformatted) {
	box-sizing: border-box;
	min-width: 0;
	max-width: 100%;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
}

.wp-block-code,
.wp-block-preformatted {
	padding: 20px;
}

.wp-block-code code,
.wp-block-preformatted {
	white-space: pre;
	overflow-wrap: normal;
	word-break: normal;
}

/* Block figures and legacy raw tables own scrolling; the page never grows. */
.wp-block-table,
.wp-block-post-content table:where(:not(.wp-block-table table)) {
	display: block;
	box-sizing: border-box;
	min-width: 0;
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-inline: contain;
}

/* An explicit content cap overrides the generic figure width and alignwide. */
:is(.bg-single, .bg-page) .wp-block-post-content .wp-block-table,
:is(.bg-single, .bg-page) .wp-block-post-content > table {
	width: 100%;
	max-width: var(--wp--style--global--content-size, 760px);
	margin-inline: auto;
}

/* Normal tables wrap at every width; only labeled reading tables become cards. */
.wp-block-table table,
.wp-block-table table.has-fixed-layout,
.wp-block-post-content table:where(:not(.wp-block-table table)) {
	width: 100%;
	min-width: 0;
	table-layout: auto;
	border-collapse: collapse;
}

:is(.bg-single, .bg-page) .wp-block-post-content .wp-block-table thead {
	border-bottom: 1px solid var(--bg-line);
}

.wp-block-table :is(th, td),
.wp-block-post-content table:where(:not(.wp-block-table table)) :is(th, td) {
	padding: 14px 18px;
	border-color: var(--bg-line);
	vertical-align: top;
	white-space: normal;
}

:is(.bg-single, .bg-page) .wp-block-post-content .wp-block-table :is(th, td) {
	min-width: 0;
	overflow-wrap: break-word;
	word-break: normal;
}

/* Stacked card values may still break long URLs. */
.bg-table-cell-value {
	min-width: 0;
	overflow-wrap: anywhere;
	word-break: normal;
}

/* At table (non-card) widths, keep short CJK columns from collapsing to 1–2 characters. */
@media (min-width: 601px) {
	:is(.bg-single, .bg-page) .wp-block-post-content .wp-block-table :is(th, td):nth-child(-n+2) {
		white-space: nowrap;
	}
}

.entry-footer {
	margin-top: 56px;
	font-size: 14px;
}

.bg-post-navigation {
	flex-wrap: wrap;
	gap: 12px 24px;
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid var(--bg-line);
}

.bg-post-navigation > * {
	min-width: 0;
	max-width: 100%;
	overflow-wrap: anywhere;
}

.bg-post-navigation a {
	box-sizing: border-box;
	display: inline-block;
	min-height: 44px;
	padding-block: 8px;
}

/* Native comment blocks in the child template match the reading column. */
.entry-comments,
.bg-single .wp-block-comments {
	box-sizing: border-box;
	min-width: 0;
	max-width: var(--wp--style--global--content-size, 760px);
	margin: 56px auto 0;
	background: #fff;
	color: var(--bg-ink);
	font-size: 16px;
}

.comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.comment-form-cookies-consent input[type="checkbox"] {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin: 0.35em 0 0;
}

.comment-form-cookies-consent label {
	flex: 1;
	min-width: 0;
	margin: 0;
}

input,
select,
textarea {
	min-width: 0;
	max-width: 100%;
	border-color: var(--bg-line);
	border-radius: 10px;
	font-family: var(--bg-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
}

input:focus,
textarea:focus {
	border-color: var(--bg-blue);
	background: #fff;
}

input:focus-visible,
textarea:focus-visible {
	outline: 3px solid var(--bg-blue);
	outline-offset: 3px;
}

.wp-element-button,
.wp-block-button__link,
input[type="submit"] {
	max-width: 100%;
	min-height: 44px;
	font-family: var(--bg-font);
	overflow-wrap: anywhere;
}

.wp-block-button,
.wp-block-search__inside-wrapper,
.wp-block-search__input {
	min-width: 0;
	max-width: 100%;
}

.wp-block-search__inside-wrapper {
	gap: 12px;
}

/* Footer navigation uses the existing 页脚菜单, with no social placeholders. */
.site-footer {
	margin-block-start: 0;
	background: var(--bg-wash);
}

.bg-footer-inner {
	min-height: 112px;
	flex-wrap: wrap;
	gap: 16px 32px;
	padding-block: 28px;
	color: var(--bg-muted);
	font-size: 13px;
}

.site-footer .bg-footer-shell {
	padding-bottom: env(safe-area-inset-bottom, 0px);
}

.bg-copyright {
	margin: 0;
	font-size: 13px;
}

.bg-footer-nav {
	color: var(--bg-muted);
	font-size: 13px;
}

.bg-footer-nav .wp-block-navigation__container {
	flex-wrap: wrap;
	gap: 4px 24px;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	.bg-cat-card:hover,
	.bg-post-card:hover {
		transform: translateY(-3px);
		box-shadow: 0 10px 28px rgb(29 29 31 / 7%);
	}
}

@media (max-width: 1100px) {
	.bg-cats {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 959px) {
	.bg-header-inner {
		gap: 16px;
	}

	.bg-primary-nav {
		flex: 0 0 auto;
	}

	.bg-primary-nav .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}

	.bg-primary-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}

	.bg-hero {
		padding-block: clamp(112px, 18vw, 160px) !important;
	}

	.bg-hero .bg-hero-title,
	.bg-hero h1 {
		font-size: clamp(36px, 7vw, 56px) !important;
	}

	.bg-latest .wp-block-post-template {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 781px) {
	.bg-cats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 381px) and (max-width: 781px) {
	.bg-cats > :last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}
}

@media (max-width: 600px) {
	:is(.bg-single, .bg-page) .wp-block-post-content {
		font-size: 17px;
	}

	/* PHP marks only tables whose single header row maps safely to every cell. */
	:is(.bg-single, .bg-page) .wp-block-post-content .wp-block-table.bg-table-stacked {
		position: relative;
		overflow: visible;
	}

	:is(.bg-single, .bg-page) .bg-table-stacked > table,
	:is(.bg-single, .bg-page) .bg-table-stacked > table > :is(tbody, tfoot) {
		display: block;
		width: 100%;
		min-width: 0;
		border: 0;
		background: transparent;
	}

	:is(.bg-single, .bg-page) .bg-table-stacked > table > thead {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		clip-path: inset(50%);
		white-space: nowrap;
	}

	:is(.bg-single, .bg-page) .bg-table-stacked > table > :is(tbody, tfoot) > tr {
		display: block;
		margin: 0 0 12px;
		padding: 16px;
		border: 1px solid var(--bg-line);
		border-radius: 18px;
		background: var(--bg-wash);
	}

	:is(.bg-single, .bg-page) .bg-table-stacked > table > :is(tbody, tfoot):last-of-type > tr:last-child {
		margin-bottom: 0;
	}

	:is(.bg-single, .bg-page) .wp-block-post-content .bg-table-stacked td {
		display: grid;
		grid-template-columns: minmax(6em, 32%) minmax(0, 1fr);
		gap: 8px 12px;
		width: auto;
		min-width: 0;
		padding: 0;
		border: 0;
		white-space: normal;
		text-align: start;
	}

	:is(.bg-single, .bg-page) .bg-table-stacked td + td {
		margin-top: 12px;
	}

	:is(.bg-single, .bg-page) .bg-table-stacked td::before {
		content: attr(data-label);
		min-width: 0;
		color: var(--bg-muted);
		font-size: 13px;
		font-weight: 600;
		overflow-wrap: break-word;
	}

	.bg-post-card {
		--bg-card-padding: 20px;
	}

	/* WordPress's mobile admin bar scrolls away instead of remaining fixed. */
	body.admin-bar .site-header {
		top: 0;
	}

	.bg-hero {
		padding-block: 104px 112px !important;
	}

	.bg-hero .bg-hero-title {
		letter-spacing: -0.035em;
	}

	.bg-hero .bg-hero-desc {
		margin-top: 20px;
		font-size: 19px;
	}

	.bg-cats {
		gap: 12px;
	}

	.bg-cats .bg-cat-card {
		padding: 20px 16px;
	}

	.bg-latest .wp-block-post-template {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.bg-footer-inner {
		align-items: flex-start;
		flex-direction: column;
		gap: 8px;
	}

	.bg-footer-nav .wp-block-navigation__container {
		justify-content: flex-start;
		gap: 0 20px;
	}
}

@media (max-width: 380px) {
	.bg-cats {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation: none !important;
		transition: none !important;
	}
}

/* Single-post discovery stays in the reading column, with one row per article. */
.bg-single .bg-related-posts {
	margin-block-start: 48px;
	padding: clamp(20px, 3vw, 28px);
	border-radius: var(--bg-radius);
	background: var(--bg-wash);
}

.bg-single .bg-related-posts h2 {
	margin: 0 0 16px;
	font-size: clamp(22px, 2.5vw, 28px);
	line-height: 1.35;
}

.bg-single .bg-related-posts__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.bg-single .bg-related-posts__item {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	min-width: 0;
	padding-block: 16px;
}

.bg-single .bg-related-posts__item + .bg-related-posts__item {
	border-top: 1px solid var(--bg-line);
}

.bg-single .bg-related-posts__item:last-child {
	padding-bottom: 0;
}

.bg-single .bg-related-posts__thumb-link {
	flex: 0 0 auto;
	display: block;
	min-width: 0;
	line-height: 0;
	text-decoration: none;
}

.bg-single .bg-related-posts__thumbnail {
	flex: 0 0 auto;
	display: block;
	width: clamp(56px, 12vw, 72px);
	height: clamp(56px, 12vw, 72px);
	margin-top: 8px;
	border-radius: 10px;
	object-fit: cover;
}

.bg-single .bg-related-posts__text {
	flex: 1;
	min-width: 0;
}

.bg-single .bg-related-posts__title {
	display: block;
	min-height: 44px;
	padding-block: 8px;
	color: var(--bg-blue-small);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.55;
	overflow-wrap: break-word;
	word-break: keep-all;
	text-wrap: pretty;
}

.bg-single .bg-related-posts__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 12px;
	color: var(--bg-muted);
	font-size: 13px;
}

.bg-single .bg-related-posts__meta > * {
	min-width: 0;
	max-width: 100%;
	overflow-wrap: anywhere;
}

.bg-single .post-meta .bg-post-updated {
	color: var(--bg-muted);
	font-size: 14px;
}

.bg-single .bg-post-navigation .wp-block-post-navigation-link {
	flex: 1 1 260px;
	min-width: 0;
	max-width: 100%;
	text-align: start;
}

.bg-single .bg-post-navigation a {
	display: block;
	max-width: 100%;
	color: var(--bg-blue-small);
	overflow-wrap: break-word;
	word-break: keep-all;
	text-wrap: pretty;
}

.bg-single .bg-post-navigation .post-navigation-link__label {
	display: block;
	color: var(--bg-muted);
	font-size: 13px;
}

.bg-single .bg-post-navigation .post-navigation-link__title {
	font-size: 16px;
	line-height: 1.6;
}

/* The child 404 supplies its own gutters and a single, constrained search panel. */
.bg-404 {
	min-width: 0;
	min-height: 60vh;
	margin-block-start: 0;
	padding: clamp(56px, 7vw, 96px) var(--bg-gutter);
}

.bg-404 .bg-404-panel {
	min-width: 0;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 760px);
	margin-inline: auto;
	padding: clamp(20px, 4vw, 40px);
	border-radius: var(--bg-radius);
	background: var(--bg-wash);
}

.bg-404 h1 {
	margin-block: 0 20px;
	font-size: clamp(28px, 3.2vw, 44px);
	line-height: 1.25;
	overflow-wrap: break-word;
	word-break: keep-all;
}

.bg-404 p {
	color: var(--bg-muted);
	font-size: 17px;
}

.bg-404 .wp-block-search {
	max-width: 100%;
	margin-block: 28px;
}

.bg-404 .wp-block-search__label {
	display: block;
	margin-bottom: 8px;
	font-size: 16px;
}

.bg-404 .wp-block-search__inside-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.bg-404 .wp-block-search__input {
	flex: 1 1 160px;
	min-height: 44px;
	padding: 10px 12px;
	border: 1px solid var(--bg-line);
	background: #fff;
	color: var(--bg-ink);
}

.bg-404 .wp-block-search__button {
	flex: 0 0 auto;
	min-height: 44px;
	margin: 0;
	padding: 10px 20px;
	border: 0;
	border-radius: 999px;
	background: var(--bg-blue-small);
	color: #fff;
	font-size: 16px;
}

.bg-404 .bg-404-links {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 20px;
	margin-bottom: 0;
}

.bg-404-links a {
	display: inline-flex;
	align-items: center;
	min-width: 0;
	min-height: 44px;
	max-width: 100%;
	color: var(--bg-blue-small);
	font-size: 16px;
}

/* Rank Math's shortcode remains ordinary page content; no custom page is needed. */
.bg-page .wp-block-post-content :is(.rank-math-html-sitemap, .rank-math-html-sitemap__section) {
	min-width: 0;
	max-width: var(--wp--style--global--content-size, 760px);
	margin: 28px auto;
	overflow-wrap: break-word;
}

.bg-page .wp-block-post-content :is(.rank-math-html-sitemap, .rank-math-html-sitemap__section) :is(h2, h3, h4) {
	margin-block: 24px 12px;
}

.bg-page .wp-block-post-content :is(.rank-math-html-sitemap, .rank-math-html-sitemap__section) > :first-child {
	margin-top: 0;
}

.bg-page .wp-block-post-content :is(.rank-math-html-sitemap, .rank-math-html-sitemap__section) :is(ul, ol) {
	min-width: 0;
	max-width: 100%;
	margin-block: 12px;
	padding-inline-start: 1.4em;
}

.bg-page .wp-block-post-content :is(.rank-math-html-sitemap, .rank-math-html-sitemap__section) li {
	margin-block: 4px;
}

.bg-page .wp-block-post-content :is(.rank-math-html-sitemap, .rank-math-html-sitemap__section) a {
	display: inline-block;
	max-width: 100%;
	min-height: 44px;
	padding-block: 6px;
	color: var(--bg-blue-small);
	line-height: 1.7;
	overflow-wrap: break-word;
	word-break: keep-all;
	text-wrap: pretty;
}

.editor-styles-wrapper .site-header {
	position: relative;
	top: 0;
}