/*
Theme Name: Bryan Glant
Theme URI: https://bryanglant.com
Author: Red Banyan
Description: A dark, editorial block theme for Bryan Glant's personal site: hiking, cooking and travel. Black and gray backgrounds, off-white and gold type, Cormorant Garamond and Jost.
Version: 1.0.1
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bryan-glant
*/

/* ---------- Base ---------- */
.wp-site-blocks > * + * { margin-block-start: 0; }
main.wp-block-group > * { margin-block-start: 0; }
main.wp-block-group > * + * { margin-block-start: 0; }
::selection { background: #D4B26A; color: #0B0B0C; }
:where(a, button, input, textarea, select):focus-visible { outline: 2px solid #EBD39C; outline-offset: 3px; }
img { max-width: 100%; height: auto; }

.bg-gold { color: var(--wp--preset--color--accent); }
em.bg-gold { font-style: italic; }

.bg-eyebrow,
.bg-eyebrow a {
	font-size: 13px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	text-decoration: none;
	font-weight: 400;
}
.bg-lead { font-size: 20px; color: var(--wp--preset--color--muted); }
.bg-lead--bright { color: var(--wp--preset--color--contrast); }
.bg-muted { color: var(--wp--preset--color--muted); }

.bg-section { padding-block: clamp(64px, 9vw, 104px); }
.bg-surface {
	background: var(--wp--preset--color--surface);
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
}
.bg-surface + .bg-surface { border-top: 0; }

/* ---------- Header ---------- */
.bg-header { border-bottom: 1px solid var(--wp--preset--color--line); padding-block: 14px; }
.bg-header-row { gap: 16px; }
.bg-logo { margin: 0; font-family: var(--wp--preset--font-family--display); font-size: 26px; font-weight: 600; letter-spacing: 0.04em; line-height: 1.2; }
.bg-logo a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.bg-logo a:hover { color: var(--wp--preset--color--contrast); }

.bg-nav .wp-block-navigation__container { gap: 4px; }
.bg-nav .wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 16px;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	border-bottom: 1px solid transparent;
}
.bg-nav .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--accent); }
body.home .bg-nav-home .wp-block-navigation-item__content,
body.blog .bg-nav-blog .wp-block-navigation-item__content,
body.single-post .bg-nav-blog .wp-block-navigation-item__content,
body.category .bg-nav-blog .wp-block-navigation-item__content,
body.archive .bg-nav-blog .wp-block-navigation-item__content {
	color: var(--wp--preset--color--accent);
	border-bottom-color: var(--wp--preset--color--accent);
}
@media (max-width: 480px) {
	.bg-nav .wp-block-navigation-item__content { padding: 0 10px; letter-spacing: 0.12em; }
}

/* ---------- Buttons ---------- */
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: transparent;
	color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
}
.wp-block-button__link { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; }

/* ---------- Hero ---------- */
.bg-hero .wp-block-columns { gap: clamp(40px, 6vw, 72px); }
.bg-hero h1 { margin-block: 22px 26px; }
.bg-hero .bg-lead { max-width: 520px; margin-bottom: 30px; }
.bg-framed { position: relative; max-width: 460px; margin: 0 18px 18px auto; }
.bg-framed::before {
	content: "";
	position: absolute;
	inset: 18px -18px -18px 18px;
	border: 1px solid var(--wp--preset--color--accent);
	pointer-events: none;
}
.bg-framed img {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	object-position: 52% center;
	border: 1px solid #2E2E33;
	filter: saturate(0.85);
}
@media (max-width: 781px) { .bg-framed { margin: 8px 18px 18px 0; } }

/* ---------- About ---------- */
.bg-about .wp-block-columns { gap: clamp(40px, 6vw, 72px); }
.bg-about h2 { margin-block: 16px 24px; }
.bg-about .bg-copy p { color: var(--wp--preset--color--soft); margin-block: 0 22px; }
.bg-about .bg-copy p:first-child { font-size: 20px; color: var(--wp--preset--color--contrast); }
.bg-pills { gap: 10px; }
.bg-pill {
	margin: 0;
	padding: 6px 14px;
	border: 1px solid #3A3A3F;
	font-size: 13px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--soft);
}

/* ---------- Section heads ---------- */
.bg-section-head { gap: 24px; margin-bottom: 48px; }
.bg-section-head h2 { margin: 14px 0 0; }

/* ---------- Carousel ---------- */
.bg-carousel-nav { display: flex; gap: 10px; }
.bg-arrow {
	width: 48px;
	height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 1px solid var(--wp--preset--color--line-strong);
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
	padding: 0;
}
.bg-arrow:hover { border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--accent); }
.bg-arrow--fill { background: var(--wp--preset--color--accent); border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--base); }
.bg-arrow--fill:hover { background: var(--wp--preset--color--accent-light); border-color: var(--wp--preset--color--accent-light); color: var(--wp--preset--color--base); }

.bg-carousel .wp-block-post-template {
	display: flex;
	gap: 24px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	list-style: none;
	margin: 0;
	padding: 0 0 4px;
}
.bg-carousel .wp-block-post-template::-webkit-scrollbar { display: none; }
.bg-carousel .wp-block-post-template > li { flex: 0 0 min(360px, 82%); scroll-snap-align: start; margin: 0; display: flex; }
.bg-view-all { margin-top: 40px; }

/* ---------- Cards ---------- */
.bg-card {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	transition: border-color .2s ease;
}
.bg-card:hover { border-color: var(--wp--preset--color--line-strong); }
.bg-card > * { margin-block: 0 !important; }
.bg-card .wp-block-post-featured-image { margin: 0; border-bottom: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--raised); }
.bg-card .wp-block-post-featured-image img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.bg-card-body { padding: 26px 26px 30px; gap: 12px; flex-grow: 1; align-items: stretch !important; }
.bg-card-body > * { margin: 0 !important; }
.bg-card .wp-block-post-title { font-size: 28px; line-height: 1.15; }
.bg-card .wp-block-post-title a:hover { color: var(--wp--preset--color--accent-light); }
.bg-card .wp-block-post-excerpt { color: var(--wp--preset--color--muted); font-size: 16px; flex-grow: 1; }
.bg-card .wp-block-post-excerpt__excerpt { margin: 0; }
.bg-card .wp-block-post-excerpt__more-text { display: none; }
.bg-meta-row { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; }
.bg-meta-row .wp-block-post-date { color: var(--wp--preset--color--subtle); font-size: 12px; }

.bg-terms, .bg-terms a {
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}
.bg-terms .wp-block-post-terms__separator { color: var(--wp--preset--color--subtle); }
.wp-block-read-more.bg-readmore,
.bg-readmore {
	font-size: 13px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	text-decoration: none;
	margin-top: 8px !important;
}
.bg-readmore:hover { color: var(--wp--preset--color--accent-light); }

/* ---------- Blog index ---------- */
.bg-blog-intro { padding-block: clamp(56px, 8vw, 88px) 48px; }
.bg-blog-intro h1 { margin-block: 18px 22px; }
.bg-blog-intro .bg-lead { max-width: 620px; margin: 0; }
.bg-filter-row {
	gap: 10px;
	padding-block: 20px;
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
}
.bg-all { margin: 0; }
.bg-filter { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 0; padding: 0; }
.bg-filter li { margin: 0; }
.bg-all a,
.bg-filter li a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 20px;
	box-sizing: border-box;
	border: 1px solid #3A3A3F;
	color: var(--wp--preset--color--soft);
	font-size: 13px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	text-decoration: none;
}
.bg-all a:hover,
.bg-filter li a:hover { border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--accent); }
body.blog .bg-all a,
.bg-filter li.current-cat a {
	background: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	font-weight: 500;
}

.bg-feature-wrap { padding-top: 56px; }
.bg-feature-wrap .wp-block-post-template { list-style: none; margin: 0; padding: 0; }
.bg-feature {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	transition: border-color .2s ease;
}
.bg-feature:hover { border-color: var(--wp--preset--color--line-strong); }
.bg-feature > * { margin: 0 !important; }
.bg-feature .wp-block-post-featured-image { margin: 0; min-height: 380px; background: var(--wp--preset--color--raised); }
.bg-feature .wp-block-post-featured-image a,
.bg-feature .wp-block-post-featured-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bg-feature-body { padding: 48px 44px; gap: 16px; justify-content: center; align-items: stretch !important; }
.bg-feature-body > * { margin: 0 !important; }
.bg-feature .wp-block-post-title { font-size: clamp(32px, 3.4vw, 42px); line-height: 1.1; }
.bg-feature .wp-block-post-excerpt { color: var(--wp--preset--color--muted); }
.bg-feature .wp-block-post-excerpt__excerpt { margin: 0; }
.bg-feature .wp-block-post-excerpt__more-text { display: none; }
.bg-badge-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.bg-badge { margin: 0; padding: 4px 10px; background: var(--wp--preset--color--accent); color: var(--wp--preset--color--base); font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 500; }
@media (max-width: 781px) {
	.bg-feature { grid-template-columns: 1fr; }
	.bg-feature .wp-block-post-featured-image { min-height: 240px; }
	.bg-feature-body { padding: 32px 26px; }
}

.bg-grid-wrap { padding-block: 48px 96px; }
.bg-grid .wp-block-post-template { gap: 28px; list-style: none; margin: 0; padding: 0; }
.bg-grid .wp-block-post-template > li { margin: 0; display: flex; }
body.blog:not(.paged) .bg-grid .wp-block-post-template > li.sticky { display: none; }
.bg-pagination { margin-top: 48px; gap: 10px; font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; }
.bg-pagination a, .bg-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 44px; min-height: 44px; padding: 0 14px; box-sizing: border-box;
	border: 1px solid var(--wp--preset--color--line-strong);
	color: var(--wp--preset--color--contrast); text-decoration: none;
}
.bg-pagination .page-numbers.current { background: var(--wp--preset--color--accent); border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--base); }
.bg-pagination .page-numbers.dots { border: 0; }

/* ---------- Single post ---------- */
.bg-post-head { padding-block: 64px 48px; text-align: center; }
.bg-post-head > * { margin-inline: auto; }
.bg-back { margin: 0 0 18px; }
.bg-back a { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--wp--preset--color--muted); text-decoration: none; }
.bg-back a:hover { color: var(--wp--preset--color--accent); }
.bg-post-meta { justify-content: center; gap: 12px 22px; font-size: 13px; letter-spacing: 0.2em; text-transform: uppercase; }
.bg-post-meta .wp-block-post-date { font-size: 13px; }
.bg-post-head .wp-block-post-title { font-size: clamp(42px, 6.2vw, 76px); line-height: 1.04; letter-spacing: -0.01em; margin-block: 22px; }
.bg-byline { justify-content: center; gap: 14px; margin-top: 6px; }
.bg-avatar { margin: 0 !important; }
.bg-avatar img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; object-position: 52% 30%; border: 1px solid var(--wp--preset--color--accent); display: block; }
.bg-avatar--lg img { width: 72px; height: 72px; }
.bg-byline-text { text-align: left; gap: 0; }
.bg-byline-text p { margin: 0; line-height: 1.35; }
.bg-byline-name { font-size: 15px; font-weight: 400; color: var(--wp--preset--color--contrast); }
.bg-byline-place { font-size: 13px; color: var(--wp--preset--color--subtle); }
.bg-post-hero { margin-block: 0 !important; }
.bg-post-hero img { display: block; width: 100%; object-fit: cover; border: 1px solid var(--wp--preset--color--line); }

.bg-prose { padding-block: 72px 24px; font-size: 19px; line-height: 1.8; color: var(--wp--preset--color--soft); }
.bg-prose > * + * { margin-block-start: 28px; }
.bg-prose > p:first-child { font-size: 22px; line-height: 1.7; color: var(--wp--preset--color--contrast); }
.bg-prose h2 { margin-top: 52px; font-size: 36px; line-height: 1.15; }
.bg-prose h3 { margin-top: 44px; }
.bg-prose ul, .bg-prose ol { padding-left: 22px; }
.bg-prose li + li { margin-top: 8px; }
.bg-prose figure { margin-block: 44px; }
.bg-prose figcaption { margin-top: 12px; }
.bg-prose .wp-block-pullquote { padding: 36px 0; margin-block: 52px; text-align: center; color: var(--wp--preset--color--contrast); }
.bg-prose .wp-block-pullquote blockquote { margin: 0; }
.bg-prose .wp-block-pullquote p { font-size: 34px; line-height: 1.3; }
.bg-prose .wp-block-pullquote cite { font-family: var(--wp--preset--font-family--body); font-style: normal; font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--wp--preset--color--subtle); }

.bg-author { gap: 20px; padding-block: 24px 8px; flex-wrap: nowrap !important; }
.bg-author-text p { margin: 0; font-size: 16px; line-height: 1.55; color: var(--wp--preset--color--muted); }
.bg-author-text .bg-author-name { font-family: var(--wp--preset--font-family--display); font-size: 24px; color: var(--wp--preset--color--contrast); margin-bottom: 4px; }

.bg-post-nav { padding-top: 56px; }
.bg-post-nav .wp-block-columns { gap: 24px; }
.bg-post-nav .wp-block-post-navigation-link {
	display: flex; flex-direction: column; gap: 8px;
	padding: 28px 30px; border: 1px solid var(--wp--preset--color--line);
	height: 100%; box-sizing: border-box;
}
.bg-post-nav .wp-block-post-navigation-link:hover { border-color: var(--wp--preset--color--line-strong); }
.bg-post-nav .post-navigation-link__label { font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--wp--preset--color--accent); }
.bg-post-nav .post-navigation-link__title,
.bg-post-nav .wp-block-post-navigation-link a { font-family: var(--wp--preset--font-family--display); font-size: 26px; line-height: 1.2; color: var(--wp--preset--color--contrast); text-decoration: none; }
.bg-post-nav .wp-block-post-navigation-link a:hover { color: var(--wp--preset--color--accent-light); }
.bg-post-nav .post-navigation-link-next { text-align: right; align-items: flex-end; }
.bg-post-nav .wp-block-post-navigation-link:empty { display: none; }

.bg-more { padding-block: 96px 104px; }
.bg-more-head { gap: 20px; margin-bottom: 40px; }
.bg-more-head h2 { margin: 0; font-size: 44px; }
.bg-link-caps { margin: 0; }
.bg-link-caps a { font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; text-decoration: none; }

/* ---------- Contact ---------- */
.bg-contact .wp-block-columns { gap: clamp(40px, 6vw, 72px); }
.bg-contact h2 { margin-block: 16px 18px; }
.bg-contact .bg-muted { max-width: 380px; }
.bg-form-note {
	padding: 32px; border: 1px dashed var(--wp--preset--color--line-strong);
	color: var(--wp--preset--color--subtle); font-size: 15px;
}
.wpcf7 form .bg-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; }
.wpcf7 .bg-field { display: flex; flex-direction: column; gap: 8px; }
.wpcf7 .bg-field--full { grid-column: 1 / -1; }
.wpcf7 label { font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--wp--preset--color--soft); font-weight: 400; }
.wpcf7 .wpcf7-form-control-wrap { display: block; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
	width: 100%; box-sizing: border-box; min-height: 48px; padding: 12px 16px;
	background: var(--wp--preset--color--base) !important;
	border: 1px solid #3A3A3F !important;
	border-radius: 0 !important;
	color: var(--wp--preset--color--contrast) !important;
	font: inherit;
}
.wpcf7 textarea { resize: vertical; min-height: 160px; }
.wpcf7 input:focus, .wpcf7 textarea:focus { outline: none; border-color: var(--wp--preset--color--accent) !important; }
.wpcf7 input[type="submit"] {
	min-height: 52px; padding: 0 36px; cursor: pointer;
	border: 0 !important; border-radius: 0 !important;
	background: var(--wp--preset--color--accent) !important;
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--body); font-size: 13px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase;
}
.wpcf7 input[type="submit"]:hover { background: var(--wp--preset--color--accent-light) !important; }
.wpcf7 .wpcf7-spinner { margin: 0 0 0 16px; vertical-align: middle; }
.wpcf7 .wpcf7-not-valid-tip { color: #F0A58A; font-size: 14px; margin-top: 6px; }
.wpcf7 form .wpcf7-response-output { margin: 24px 0 0; padding: 16px 20px; border: 1px solid var(--wp--preset--color--accent); color: var(--wp--preset--color--contrast); }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { border-color: #F0A58A; }

/* ---------- Footer ---------- */
.bg-footer { border-top: 1px solid var(--wp--preset--color--line); padding-block: 40px 32px; }
.bg-footer-row { gap: 16px 24px; }
.bg-footer .bg-logo { font-size: 22px; font-weight: 500; }
.bg-social { margin: 0 -12px 0 0; display: flex; flex-wrap: wrap; }
.bg-social a {
	display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px;
	font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--wp--preset--color--soft); text-decoration: none;
}
.bg-social a:hover { color: var(--wp--preset--color--accent); }
.bg-copyright { margin: 24px 0 0; padding-top: 20px; border-top: 1px solid #1F1F22; font-size: 14px; color: var(--wp--preset--color--subtle); }
@media (max-width: 600px) { .bg-social { margin-left: -12px; } }

/* ---------- Generic pages ---------- */
.bg-page { padding-block: clamp(56px, 8vw, 88px) 96px; }
.bg-page .wp-block-post-title { margin-bottom: 40px; }
