.ss-persona {
	--ss-persona-accent: #f5b301;
	--ss-persona-ink: #1e1b16;
	--ss-persona-muted: #524d45;
	--ss-persona-rule: #d9d9d9;
	--ss-persona-surface: #f7f5f0;
	--ss-persona-hero-bg: #ebf8cd;
	--ss-persona-hero-ink: var(--ss-persona-ink);
	--ss-persona-radius: 16px;
	--ss-persona-max: 1120px;
	--ss-persona-gap: 48px;
	color: var(--ss-persona-ink);
	line-height: 1.55;
}

.ss-persona > * {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--ss-persona-max);
	margin-inline: auto;
	padding-inline: 16px;
}

.ss-persona__hero {
	max-width: none;
	padding-block: 64px;
	padding-inline: max(16px, calc((100% - var(--ss-persona-max)) / 2));
	background-color: var(--ss-persona-hero-bg);
	background-position: center;
	background-size: cover;
	color: var(--ss-persona-hero-ink);
}

.ss-persona__avatar {
	display: block;
	width: 104px;
	height: 104px;
	margin-bottom: 16px;
	border-radius: 50%;
	object-fit: cover;
}

.ss-persona__name {
	margin: 0 0 8px;
	font-size: clamp(2.25rem, 5vw, 3.5rem);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.02em;
}

.ss-persona__role {
	margin: 0 0 14px;
	font-size: 1rem;
	font-weight: 500;
}

.ss-persona__bio {
	max-width: 720px;
	font-size: 1.125rem;
}

.ss-persona__bio > :first-child { margin-top: 0; }
.ss-persona__bio > :last-child { margin-bottom: 0; }

.ss-persona__stats {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ss-persona-gap);
	margin-block: 0;
	padding-block: 44px;
	list-style: none;
}

.ss-stat {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.ss-stat + .ss-stat::before {
	content: "";
	position: absolute;
	left: calc(var(--ss-persona-gap) / -2);
	top: 50%;
	height: 44px;
	border-left: 1px solid var(--ss-persona-rule);
	transform: translateY(-50%);
}

.ss-stat__num { font-size: 2.5rem; font-weight: 700; line-height: 1; }
.ss-stat__label { font-size: 0.875rem; color: var(--ss-persona-muted); }

.ss-persona__mission {
	max-width: none;
	padding-block: 48px;
	padding-inline: max(16px, calc((100% - var(--ss-persona-max)) / 2));
	background: var(--ss-persona-surface);
}

.ss-persona__eyebrow {
	margin: 0 0 8px;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ss-persona-muted);
}

.ss-persona__mission-text {
	max-width: 720px;
	margin: 0;
	font-size: 1.5rem;
	line-height: 1.35;
}

.ss-persona__quote {
	margin-block: 56px;
	padding-block: 0;
	padding-inline: 16px;
	border-left: 4px solid var(--ss-persona-accent);
}

.ss-persona__quote-text {
	max-width: 760px;
	margin: 0 0 12px;
	font-size: 1.75rem;
	font-weight: 600;
	line-height: 1.3;
}

.ss-persona__quote-cite { font-style: normal; color: var(--ss-persona-muted); }

.ss-persona__picks,
.ss-persona__articles {
	padding-block: 32px;
}

.ss-persona__heading { margin: 0 0 8px; font-size: 1.75rem; }
.ss-persona__intro { margin: 0 0 20px; color: var(--ss-persona-muted); }

.ss-persona__cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
	gap: 24px;
	margin-top: 20px;
}

.ss-persona__cards--products {
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr));
}

.ss-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.ss-card__image { display: block; overflow: hidden; border-radius: var(--ss-persona-radius); }
.ss-card__image img { display: block; width: 100%; height: 190px; object-fit: cover; }
.ss-card__title { margin: 4px 0 0; font-size: 1.125rem; line-height: 1.3; }
.ss-card__title a { color: inherit; text-decoration: none; }
.ss-card__title a:hover { text-decoration: underline; }
.ss-card__excerpt { margin: 0; color: var(--ss-persona-muted); font-size: 0.9375rem; }
.ss-card__price { margin: 0; font-weight: 600; }

@media (max-width: 600px) {
	.ss-persona__hero { padding-block: 40px; }
	.ss-persona__stats { gap: 28px; }
	.ss-stat + .ss-stat::before { display: none; }
}
