/*
Theme Name: Home for Liberty BuddyBoss Child
Theme URI: https://home4liberty.org/
Description: Brand child theme for Home for Liberty (BuddyBoss), styled from the HFL style guide.
Author: People for Liberty
Template: buddyboss-theme
Version: 1.3.7
Text Domain: home4liberty-buddyboss-child
*/

:root {
	--hfl-navy: #17324d;
	--hfl-gold: #d6a84b;
	--hfl-red: #a6423a;
	--hfl-parchment: #f5f1e8;
	--hfl-slate: #667788;
	--hfl-ink: #18232d;
	--hfl-white: #ffffff;
	--hfl-font-display: "Playfair Display", Georgia, "Times New Roman", serif;
	--hfl-font-body: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* Base surfaces */
body,
body.buddypress,
#buddypress {
	background-color: var(--hfl-parchment);
	color: var(--hfl-ink);
	font-family: var(--hfl-font-body);
}

h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.bb-template-v2 .entry-title,
.page-title,
.bb-page-title {
	font-family: var(--hfl-font-display);
	color: var(--hfl-navy);
	font-weight: 600;
}

a {
	color: var(--hfl-navy);
}

a:hover,
a:focus {
	color: var(--hfl-red);
}

/* Header */
.site-header,
#masthead,
.bb-mobile-panel-wrapper,
.header-aside,
.bb-header-buttons {
	background-color: var(--hfl-parchment);
}

.site-header {
	border-bottom: 1px solid rgba(23, 50, 77, 0.12);
}

.site-header a,
#masthead a,
.bb-header-menu a,
.primary-menu > li > a {
	color: var(--hfl-navy);
}

.site-header a:hover,
#masthead a:hover,
.bb-header-menu a:hover,
.primary-menu > li > a:hover,
.primary-menu > li.current-menu-item > a {
	color: var(--hfl-gold);
}

.site-title,
.site-title a {
	font-family: var(--hfl-font-display);
	color: var(--hfl-navy);
	letter-spacing: 0.02em;
}

.custom-logo-link,
#site-logo,
.site-header .bb-logo,
.site-header .bb-mobile-logo {
	overflow: visible;
}

.custom-logo-link img,
.site-header .bb-logo img,
.site-header .bb-mobile-logo img,
#site-logo .bb-logo img,
#site-logo .bb-mobile-logo img {
	max-height: 88px;
	width: auto;
	height: auto;
	object-fit: contain;
	object-position: left center;
	padding: 4px 0;
}

/* Primary CTAs only — do not paint every button gold (breaks Like/Comment). */
input[type="submit"],
.bp-nouveau .activity-update-form #whats-new-submit input,
.bb-rl-header .bb-rl-button--secondaryFill,
.bb-rl-header .bb-rl-button--brand,
.bb-rl-button--secondaryFill,
.bb-rl-button.bb-rl-button--secondaryFill,
a.signup.bb-rl-button,
button.nouveau-search-submit,
.bb-rl-activity-filters button,
.bb-rl-activity-filters .bb-rl-button {
	background-color: var(--hfl-gold) !important;
	border-color: var(--hfl-gold) !important;
	color: var(--hfl-navy) !important;
	font-family: var(--hfl-font-body);
	font-weight: 600;
	border-radius: 4px;
}

input[type="submit"]:hover,
.bb-rl-header .bb-rl-button--secondaryFill:hover,
.bb-rl-button--secondaryFill:hover,
a.signup.bb-rl-button:hover {
	background-color: #c4963f !important;
	border-color: #c4963f !important;
	color: var(--hfl-navy) !important;
}

/* Activity Like / Comment — readable, spaced, not filled gold */
.bb-rl-activity-footer-actions .activity-meta,
.bb-rl-activity-footer-actions .bp-generic-meta,
.bb-rl-activity-footer-actions .bp-generic-meta.action,
.activity-list .activity-meta,
.activity-list .bp-generic-meta {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	flex-wrap: wrap !important;
}

.bb-rl-activity-footer-actions .generic-button,
.activity-list .generic-button {
	margin: 0 !important;
	float: none !important;
	display: inline-flex !important;
}

.bb-rl-activity-footer-actions .generic-button a,
.bb-rl-activity-footer-actions .generic-button button,
.bb-rl-activity-footer-actions a.button,
.bb-rl-activity-footer-actions button.button,
.bb-rl-activity-footer-actions .bp-generic-meta .generic-button a,
.activity-list .activity-meta a.button,
.activity-list .bp-generic-meta a.button,
.activity-list a.bp-like-button,
.activity-list a.bp-secondary-action,
.activity-list a.acomment-reply,
a.button.fav,
a.button.unfav,
a.button.acomment-reply,
a.bp-like-button {
	background: transparent !important;
	background-color: transparent !important;
	border: 1px solid rgba(23, 50, 77, 0.35) !important;
	color: var(--hfl-navy) !important;
	box-shadow: none !important;
	padding: 8px 14px !important;
	margin: 0 !important;
	border-radius: 6px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	position: static !important;
	float: none !important;
	min-height: 36px;
}

.bb-rl-activity-footer-actions .generic-button a:hover,
.bb-rl-activity-footer-actions .bp-generic-meta .generic-button a:hover,
.activity-list .activity-meta a.button:hover,
.activity-list a.bp-like-button:hover,
.activity-list a.acomment-reply:hover,
a.button.fav:hover,
a.button.acomment-reply:hover,
a.bp-like-button:hover {
	background: rgba(23, 50, 77, 0.06) !important;
	border-color: var(--hfl-navy) !important;
	color: var(--hfl-navy) !important;
}

.bb-rl-activity-footer-actions .generic-button a i,
.bb-rl-activity-footer-actions .generic-button a span,
.bb-rl-activity-footer-actions .bp-generic-meta .generic-button a span,
.bb-rl-activity-footer-actions .bp-generic-meta .generic-button a .like-count,
.bb-rl-activity-footer-actions .bp-generic-meta .generic-button a .comment-count,
.activity-list .activity-meta a i,
.activity-list .activity-meta a span,
.activity-list a.bp-like-button i,
.activity-list a.bp-like-button span,
a.button.fav i,
a.button.fav span,
a.button.acomment-reply span,
a.bp-like-button i,
a.bp-like-button span {
	color: var(--hfl-navy) !important;
}

.bb-rl-activity-footer-actions .bp-generic-meta .generic-button a.bp-like-button [class*="bb-icon"]:before,
.bb-rl-activity-footer-actions .bp-generic-meta .generic-button a.acomment-reply:before {
	color: var(--hfl-navy) !important;
}

/* Secondary / outline actions */
.button.outline,
.buddypress .buddypress-wrap .button.outline,
a.button.outline {
	background-color: transparent !important;
	border: 1px solid var(--hfl-navy) !important;
	color: var(--hfl-navy) !important;
}

/* Cards / content panels */
.bb-single-member-nav,
.bb-profile-grid,
.activity-list .activity-item,
.groups-list .item-entry,
.members-list .item-entry,
.bb-card,
.widget,
.bb-cover-container,
.bp-feedback,
#buddypress .activity-list .activity-item {
	background-color: var(--hfl-white);
	border-color: rgba(102, 119, 136, 0.25);
}

/* Navigation / sidenav accents */
.buddypanel,
.bb-mobile-panel-inner {
	background-color: var(--hfl-white);
}

.buddypanel .bb-primary-menu > li.current-menu-item > a,
.buddypanel .side-panel-menu > li.current-menu-item > a,
.buddypanel .bb-primary-menu > li > a:hover {
	background-color: var(--hfl-navy) !important;
	color: var(--hfl-white) !important;
}

/* Notices / accents */
.bp-feedback.info,
.bp-messages.info {
	border-left-color: var(--hfl-gold);
}

.bp-feedback.error,
.bp-messages.error {
	border-left-color: var(--hfl-red);
}

/* Footer — Liberty Navy */
.footer-bottom,
#footer-wrap,
.footer-widget-area,
.bb-footer {
	background-color: var(--hfl-navy) !important;
	color: var(--hfl-parchment);
}

.footer-bottom a,
#footer-wrap a,
.bb-footer a,
.footer-widget-area a {
	color: var(--hfl-gold);
}

.footer-bottom a:hover,
#footer-wrap a:hover,
.bb-footer a:hover {
	color: var(--hfl-white);
}

/* Forms */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
textarea,
select,
.buddypress-wrap .standard-form input[type="text"],
.buddypress-wrap .standard-form input[type="email"],
.buddypress-wrap .standard-form input[type="password"],
.buddypress-wrap .standard-form textarea,
.buddypress-wrap .standard-form select {
	border-color: rgba(102, 119, 136, 0.35);
	color: var(--hfl-ink);
	background: var(--hfl-white);
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--hfl-gold) !important;
	box-shadow: 0 0 0 1px var(--hfl-gold);
}

/* Register / login surfaces */
.login,
.register,
#register-page,
.bs-bp-container-reg {
	background-color: var(--hfl-parchment);
}

/* Soft parchment page canvas behind BuddyBoss shell */
#page,
.site,
.bb-buddypanel-site {
	background-color: var(--hfl-parchment);
}

/* Heritage red for secondary labels / required markers */
.bp-required-field-label,
label .bp-required-field-label,
.required {
	color: var(--hfl-red);
}

/* ReadyLaunch social shell */
body.bb-rl-template,
.bb-rl-template,
.bb-readylaunch,
body.bb-readylaunch-template {
	--hfl-rl-header-height: clamp(168px, 18vw, 220px);
	--hfl-rl-adminbar-height: 32px;
	background-color: var(--hfl-parchment) !important;
	font-family: var(--hfl-font-body);
}

/* Full-bleed header — HTML type + cropped art */
.bb-rl-header,
header.bb-rl-header {
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	max-width: none !important;
	height: var(--hfl-rl-header-height) !important;
	min-height: var(--hfl-rl-header-height) !important;
	max-height: var(--hfl-rl-header-height) !important;
	padding: 0 !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	display: flex !important;
	align-items: stretch !important;
	background: var(--hfl-parchment) !important;
	border-bottom: 1px solid rgba(23, 50, 77, 0.12);
	overflow: hidden;
}

.bb-rl-header-container {
	position: relative !important;
	display: block !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

#site-logo.bb-rl-site-branding.hfl-brand-banner,
.bb-rl-header .hfl-brand-banner {
	position: absolute !important;
	left: 0 !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	transform: none !important;
	margin: 0 !important;
	z-index: 1;
	max-width: none !important;
	width: 100% !important;
	height: 100% !important;
	text-align: left !important;
}

.hfl-brand-banner__title-wrap {
	margin: 0 !important;
	height: 100%;
	font-weight: inherit;
}

.hfl-brand-banner__inner {
	position: relative;
	display: flex;
	align-items: center;
	gap: clamp(12px, 1.6vw, 28px);
	height: 100%;
	width: 100%;
	padding: 12px clamp(14px, 2vw, 28px);
	box-sizing: border-box;
	overflow: hidden;
	background: var(--hfl-parchment);
}

.hfl-brand-banner__logo {
	display: flex;
	align-items: center;
	gap: 0;
	flex: 0 0 auto;
	max-width: none;
	text-decoration: none !important;
	color: var(--hfl-navy) !important;
	z-index: 2;
}

/* AB variant A — single brand lockup image */
.hfl-brand-banner__logo--lockup {
	margin: 0 !important;
	padding: 0 !important;
}

.hfl-brand-banner__lockup {
	display: block !important;
	width: auto !important;
	height: clamp(110px, 13vw, 168px) !important;
	max-width: min(420px, 46vw) !important;
	max-height: calc(var(--hfl-rl-header-height) - 16px) !important;
	object-fit: contain !important;
	object-position: left center !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
}

.hfl-brand-banner__logo--html {
	gap: 10px;
}

.hfl-brand-banner__torch {
	display: block !important;
	flex: 0 0 auto;
	width: auto !important;
	height: clamp(110px, 12.5vw, 152px) !important;
	max-width: none !important;
	max-height: calc(var(--hfl-rl-header-height) - 16px) !important;
	object-fit: contain !important;
	object-position: center center !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
}

.hfl-brand-banner__wordmark {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	flex: 0 0 auto;
	min-width: max-content;
	/* Variant B: tight lockup — sit next to torch */
	margin-left: 0 !important;
	padding-left: 0;
}

.hfl-brand-banner__name {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: max-content;
	line-height: 0.92;
}

.hfl-brand-banner__name-line {
	font-family: var(--hfl-font-display);
	font-weight: 700;
	font-size: clamp(18px, 2.1vw, 34px);
	letter-spacing: 0.04em;
	color: var(--hfl-navy);
	white-space: nowrap;
}

/* Stretch HOME to the same width as LIBERTY */
.hfl-brand-banner__name-line--home {
	display: flex;
	justify-content: space-between;
	width: 100%;
	letter-spacing: 0;
}

.hfl-brand-banner__name-line--home > span {
	display: block;
}

.hfl-brand-banner__name-line--liberty {
	letter-spacing: 0.04em;
}

.hfl-brand-banner__for {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 2px 0;
}

.hfl-brand-banner__for-rule {
	flex: 1 1 auto;
	height: 1px;
	background: var(--hfl-navy);
	opacity: 0.85;
}

.hfl-brand-banner__for-text {
	font-family: var(--hfl-font-display);
	font-weight: 600;
	font-size: clamp(11px, 1.1vw, 15px);
	letter-spacing: 0.18em;
	color: var(--hfl-navy);
	line-height: 1;
}

.hfl-brand-banner__pillars {
	font-family: var(--hfl-font-body);
	font-weight: 700;
	font-size: clamp(8px, 0.72vw, 11px);
	letter-spacing: 0.12em;
	color: var(--hfl-red);
	white-space: nowrap;
	line-height: 1.2;
}

.hfl-brand-banner__divider {
	flex: 0 0 1px;
	align-self: stretch;
	width: 1px;
	margin: clamp(12px, 2vw, 28px) 0;
	background: var(--hfl-gold);
	opacity: 0.85;
	z-index: 2;
}

.hfl-brand-banner__mission {
	flex: 1 1 auto;
	min-width: 0;
	max-width: 520px;
	z-index: 2;
	padding-right: clamp(8px, 8vw, 120px);
}

.hfl-brand-banner__headline {
	margin: 0 0 6px;
	font-family: var(--hfl-font-display);
	font-weight: 600;
	font-size: clamp(16px, 1.7vw, 28px);
	line-height: 1.15;
	color: var(--hfl-navy);
}

.hfl-brand-banner__body {
	margin: 0 0 8px;
	font-family: var(--hfl-font-body);
	font-weight: 400;
	font-size: clamp(11px, 0.85vw, 14px);
	line-height: 1.35;
	color: var(--hfl-ink);
	max-width: 42em;
}

.hfl-brand-banner__actions {
	margin: 0;
	font-family: var(--hfl-font-body);
	font-weight: 700;
	font-size: clamp(9px, 0.78vw, 12px);
	letter-spacing: 0.14em;
	color: var(--hfl-red);
	line-height: 1.2;
}

.hfl-brand-banner__art {
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: min(40%, 480px);
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 12px 8px 12px 0;
	box-sizing: border-box;
	pointer-events: none;
	z-index: 1;
}

.hfl-brand-banner__art img {
	display: block !important;
	width: auto !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
	object-position: right center !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
}

/* Keep search / auth controls on the right without shrinking the banner */
.bb-rl-header #header-aside,
.bb-rl-header .header-aside {
	position: absolute !important;
	right: 12px !important;
	top: 16px !important;
	transform: none !important;
	z-index: 3;
	margin: 0 !important;
	background: rgba(245, 241, 232, 0.92) !important;
	border-radius: 8px;
	padding: 6px 8px;
}

.bb-rl-header .bb-rl-left-panel-mobile {
	position: absolute !important;
	left: 0 !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	z-index: 3;
}

.site.bb-readylaunch {
	margin-top: var(--hfl-rl-header-height) !important;
	min-height: calc(100vh - var(--hfl-rl-header-height)) !important;
}

.bb-rl-left-panel {
	top: var(--hfl-rl-header-height) !important;
	height: calc(100% - var(--hfl-rl-header-height)) !important;
	background: var(--hfl-white);
}

body.admin-bar .bb-rl-left-panel {
	top: calc(var(--hfl-rl-header-height) + var(--hfl-rl-adminbar-height)) !important;
	height: calc(100% - var(--hfl-rl-header-height) - var(--hfl-rl-adminbar-height)) !important;
}

.bb-rl-side-panel,
.bb-rl-nav {
	background: var(--hfl-white);
}

.bb-rl-left-panel a.is-active,
.bb-rl-nav .current-menu-item > a,
.bb-rl-left-panel li.selected > a {
	background: rgba(23, 50, 77, 0.08) !important;
	color: var(--hfl-navy) !important;
}

.bb-rl-button-brand,
.bb-rl-header .bb-rl-button--secondaryFill,
.bb-rl-header a.signup,
a.bb-rl-button.bb-rl-button--brand {
	background: var(--hfl-gold) !important;
	border-color: var(--hfl-gold) !important;
	color: var(--hfl-navy) !important;
}

.bb-rl-header .bb-rl-button--tertiaryLink,
.bb-rl-header a.signin-button {
	background: transparent !important;
	border: 1px solid var(--hfl-navy) !important;
	color: var(--hfl-navy) !important;
}

@media screen and (max-width: 900px) {
	.hfl-brand-banner__mission {
		max-width: 360px;
	}

	.hfl-brand-banner__body {
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
}

@media screen and (max-width: 782px) {
	body.bb-rl-template,
	body.bb-readylaunch-template {
		--hfl-rl-adminbar-height: 46px;
		--hfl-rl-header-height: clamp(120px, 28vw, 160px);
	}

	.hfl-brand-banner__divider,
	.hfl-brand-banner__mission {
		display: none;
	}

	.hfl-brand-banner__logo {
		max-width: none;
	}

	.hfl-brand-banner__lockup {
		height: clamp(88px, 22vw, 120px) !important;
		max-width: min(320px, 70vw) !important;
	}

	.hfl-brand-banner__logo--html {
		gap: 6px;
	}

	.hfl-brand-banner__wordmark {
		margin-left: 0 !important;
	}

	.hfl-brand-banner__art {
		width: 48%;
		opacity: 0.9;
	}

	.bb-rl-header #header-aside,
	.bb-rl-header .header-aside {
		top: 8px !important;
		right: 8px !important;
		padding: 4px;
	}
}

/* -------------------------------------------------------------------------
   Auth surfaces (login + register) — same HFL header as the community shell
   ------------------------------------------------------------------------- */
body.login,
body.bb-rl-register,
body.registration {
	--hfl-rl-header-height: clamp(168px, 18vw, 220px);
	background: var(--hfl-parchment) !important;
	font-family: var(--hfl-font-body);
}

body.login #login h1,
body.login h1.wp-login-logo,
body.bb-rl-register .register-page-logo {
	display: none !important;
}

.hfl-auth-header.bb-rl-login-header {
	position: relative;
	display: block;
	width: 100%;
	min-height: var(--hfl-rl-header-height);
	height: var(--hfl-rl-header-height);
	margin: 0;
	padding: 0;
	background: var(--hfl-parchment);
	border-bottom: 1px solid rgba(23, 50, 77, 0.12);
	overflow: hidden;
	box-sizing: border-box;
}

body.login .hfl-auth-header .hfl-brand-banner,
body.bb-rl-register .hfl-auth-header .hfl-brand-banner {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	transform: none !important;
}

.hfl-auth-header__actions {
	position: absolute;
	top: 12px;
	right: 16px;
	z-index: 5;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	justify-content: flex-end;
	max-width: min(420px, 46vw);
}

.hfl-auth-header__hint {
	color: var(--hfl-slate);
	font-size: 13px;
	font-family: var(--hfl-font-body);
}

.hfl-auth-btn,
.hfl-auth-header .bb-rl-button {
	background: var(--hfl-gold) !important;
	border-color: var(--hfl-gold) !important;
	color: var(--hfl-navy) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	border-radius: 4px !important;
	padding: 8px 14px !important;
}

.hfl-auth-btn:hover,
.hfl-auth-header .bb-rl-button:hover {
	background: #c4963f !important;
	border-color: #c4963f !important;
	color: var(--hfl-navy) !important;
}

body.login #login {
	margin-top: 36px !important;
	width: min(400px, 92vw);
	padding: 24px 28px 32px !important;
	background: var(--hfl-white);
	border: 1px solid rgba(23, 50, 77, 0.12);
	border-radius: 8px;
	box-shadow: 0 8px 28px rgba(23, 50, 77, 0.08);
}

body.login #login .login-heading h2,
body.login #login .message {
	color: var(--hfl-navy);
	font-family: var(--hfl-font-display);
}

body.login form .button-primary,
body.login #wp-submit {
	background: var(--hfl-gold) !important;
	border-color: var(--hfl-gold) !important;
	color: var(--hfl-navy) !important;
	font-weight: 600 !important;
	text-shadow: none !important;
	box-shadow: none !important;
}

body.login form .button-primary:hover,
body.login #wp-submit:hover {
	background: #c4963f !important;
	border-color: #c4963f !important;
}

body.bb-rl-register .register-page-main {
	margin-top: 28px;
	background: var(--hfl-parchment);
}

body.bb-rl-register .register-page-main h1 {
	font-family: var(--hfl-font-display);
	color: var(--hfl-navy);
}

@media (max-width: 782px) {
	body.login,
	body.bb-rl-register,
	body.registration {
		--hfl-rl-header-height: clamp(120px, 28vw, 160px);
	}

	.hfl-auth-header__hint {
		display: none;
	}

	.hfl-auth-header__actions {
		top: 8px;
		right: 8px;
	}
}

/* -------------------------------------------------------------------------
   About Us board (static leadership page)
   ------------------------------------------------------------------------- */
.hfl-about-board {
	max-width: 880px;
	margin: 0 auto;
	padding: 8px 4px 48px;
	color: var(--hfl-ink);
	font-family: var(--hfl-font-body);
}

.hfl-about-board__lede {
	font-size: 1.125rem;
	line-height: 1.65;
	color: var(--hfl-ink);
	margin: 0 0 1.75rem;
}

.hfl-about-board__section-title {
	font-family: var(--hfl-font-display);
	font-size: clamp(1.6rem, 2.4vw, 2rem);
	font-weight: 600;
	color: var(--hfl-navy);
	margin: 0 0 1.5rem;
	padding-bottom: 0.65rem;
	border-bottom: 2px solid var(--hfl-gold);
}

.hfl-about-board__member {
	display: grid;
	grid-template-columns: minmax(140px, 200px) 1fr;
	gap: 1.25rem 1.75rem;
	align-items: start;
	padding: 1.5rem 0;
	border-bottom: 1px solid rgba(23, 50, 77, 0.12);
	background: transparent;
}

.hfl-about-board__member:last-child {
	border-bottom: none;
}

.hfl-about-board__photo {
	margin: 0;
}

.hfl-about-board__photo img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: center top;
	border: 1px solid rgba(23, 50, 77, 0.15);
	border-radius: 4px;
	background: var(--hfl-white);
	box-shadow: 0 4px 16px rgba(23, 50, 77, 0.08);
}

.hfl-about-board__name {
	font-family: var(--hfl-font-display);
	font-size: 1.35rem;
	font-weight: 600;
	color: var(--hfl-navy);
	margin: 0 0 0.25rem;
}

.hfl-about-board__role {
	margin: 0 0 0.85rem;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--hfl-red);
}

.hfl-about-board__body p {
	margin: 0 0 0.85rem;
	line-height: 1.65;
	color: var(--hfl-ink);
}

.hfl-about-board__body p:last-child {
	margin-bottom: 0;
}

@media (max-width: 640px) {
	.hfl-about-board__member {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.hfl-about-board__photo {
		max-width: 220px;
	}
}