/* Smart Shop Flow — author photos, publisher logos, profile header, "About the author" cards */
.ssf-pp {
	--h: 220;
	display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; overflow: hidden;
	width: 100%; height: 100%; border-radius: 50%; background: #f1f3f7; color: #fff;
}
.ssf-pp .ssf-pp__img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; margin: 0 !important; border-radius: inherit; }
.ssf-pp--publisher { border-radius: 18px; background: #fff; }
.ssf-pp--publisher .ssf-pp__img { object-fit: contain; padding: 10%; box-sizing: border-box; }
.ssf-pp.is-initial {
	background: linear-gradient(135deg, hsl(var(--h) 62% 52%), hsl(calc(var(--h) + 40) 66% 42%));
	font-weight: 800; letter-spacing: -.02em; line-height: 1; font-size: 2.4em;
}
.ssf-pp--publisher.is-initial { background: linear-gradient(135deg, hsl(var(--h) 30% 30%), hsl(var(--h) 34% 20%)); }

/* ------------------------------------------------------------ profile header (author / publisher page) */
.ssf-prof {
	--pb: var(--ssf-brand, #1d3a9e);
	position: relative; overflow: hidden; isolation: isolate;
	display: flex; align-items: flex-start; gap: 26px; margin: 0 0 16px; padding: 26px 28px; border-radius: 24px;
	background:
		radial-gradient(110% 130% at 100% 0%, color-mix(in srgb, var(--pb) 15%, transparent), transparent 55%),
		radial-gradient(80% 120% at 0% 100%, rgba(249, 115, 22, .09), transparent 60%),
		linear-gradient(180deg, #fbfcff, #f3f6fd);
	border: 1px solid color-mix(in srgb, var(--pb) 12%, #fff);
}
.ssf-prof__media {
	flex: 0 0 auto; width: 132px; height: 132px; font-size: 22px;
	border-radius: 50%; padding: 5px; background: #fff;
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--pb) 14%, #fff), 0 18px 34px -20px rgba(15, 23, 42, .55);
}
.ssf-prof--publisher .ssf-prof__media { border-radius: 24px; }
.ssf-prof__body { min-width: 0; flex: 1 1 auto; padding-top: 4px; }
.ssf-prof__role {
	display: inline-block; margin: 0 0 6px; padding: 3px 10px; border-radius: 999px; background: #fff;
	border: 1px solid color-mix(in srgb, var(--pb) 18%, #fff); color: var(--pb);
	font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
}
.ssf-shopx h1.ssf-prof__name, h1.ssf-prof__name {
	margin: 0 0 6px !important; padding: 0 !important; text-align: left !important; color: #0f172a !important;
	font-size: clamp(24px, 1.5vw + 16px, 34px) !important; line-height: 1.15 !important; font-weight: 800 !important; letter-spacing: -.02em;
}
.ssf-prof__meta { margin: 0 0 10px !important; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 14.5px; color: #475569; }
.ssf-prof__tag { font-weight: 600; color: #334155; }
.ssf-prof__tag + .ssf-shop-hero__count::before { content: "·"; margin-right: 10px; color: #94a3b8; }
.ssf-prof .ssf-shop-hero__count b { color: var(--pb); font-weight: 800; }
.ssf-prof__desc, .ssf-about__desc { position: relative; max-width: 78ch; color: #334155; font-size: 15px; line-height: 1.7; }
.ssf-prof__desc p, .ssf-about__desc p { margin: 0 0 .7em !important; }
.ssf-prof__desc p:last-child, .ssf-about__desc p:last-child { margin-bottom: 0 !important; }
.ssf-prof__desc.is-clamped:not(.is-open), .ssf-about__desc.is-clamped:not(.is-open) {
	max-height: 6.8em; overflow: hidden;
	-webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent);
}
button.ssf-prof__more, .ssf-prof button.ssf-prof__more, .ssf-about button.ssf-prof__more {
	all: unset; cursor: pointer; display: inline-flex !important; align-items: center; gap: 4px; margin: 6px 0 0 !important; padding: 0 !important;
	width: auto !important; height: auto !important; min-height: 0 !important; border: 0 !important; border-radius: 0 !important;
	background: none !important; box-shadow: none !important; text-transform: none !important; letter-spacing: 0 !important;
	color: var(--ssf-brand, #1d3a9e) !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1.4 !important;
}
button.ssf-prof__more::after { content: "▾"; font-size: 12px; transition: transform .2s; }
button.ssf-prof__more[aria-expanded="true"]::after { transform: rotate(180deg); }
button.ssf-prof__more:hover { text-decoration: underline; }

/* ------------------------------------------------------------ product page */
.ssf-byline .ssf-pp--xs {
	width: 22px; height: 22px; font-size: 11px; vertical-align: -6px; margin-right: 5px;
	box-shadow: 0 0 0 1px #e5e7eb;
}
.ssf-byline .ssf-pp--publisher.ssf-pp--xs { border-radius: 5px; }

.ssf-about { clear: both; display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; margin: 34px 0 10px; }
.ssf-about__card {
	display: flex; gap: 18px; align-items: flex-start; padding: 20px; border-radius: 20px;
	background: #fff; border: 1px solid #eceef3; box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.ssf-about__card--author { background: linear-gradient(180deg, #fbfcff, #fff 60%); }
a.ssf-about__media { flex: 0 0 auto; width: 88px; height: 88px; font-size: 15px; border-radius: 50%; padding: 3px; background: #fff; box-shadow: 0 0 0 1px #e6e8ef, 0 12px 24px -16px rgba(15, 23, 42, .5); text-decoration: none !important; }
.ssf-about__card--publisher a.ssf-about__media { border-radius: 18px; }
.ssf-about__body { min-width: 0; flex: 1 1 auto; }
.ssf-about__k { display: block; margin: 0 0 2px; color: #64748b; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
h3.ssf-about__name { margin: 0 0 2px !important; font-size: 19px !important; font-weight: 800 !important; line-height: 1.25 !important; }
h3.ssf-about__name a { color: #0f172a !important; text-decoration: none !important; }
h3.ssf-about__name a:hover { color: var(--ssf-brand, #1d3a9e) !important; }
.ssf-about__tag { margin: 0 0 8px !important; color: #475569; font-size: 14px; font-weight: 600; }
.ssf-about__desc { font-size: 14.5px; margin-top: 6px; }
.ssf-about__desc.is-clamped:not(.is-open) { max-height: 5.2em; }
a.ssf-about__all { display: inline-flex; margin-top: 10px; color: var(--ssf-brand, #1d3a9e) !important; font-size: 14px; font-weight: 700; text-decoration: none !important; }
a.ssf-about__all:hover { text-decoration: underline !important; }
.ssf-about__body button.ssf-prof__more { display: flex; }

@media (max-width: 768px) {
	.ssf-prof { display: grid; grid-template-columns: 84px 1fr; column-gap: 14px; align-items: center; padding: 16px; border-radius: 18px; }
	.ssf-prof__media { grid-row: 1 / span 2; width: 84px; height: 84px; padding: 3px; font-size: 14px; }
	.ssf-prof--publisher .ssf-prof__media { border-radius: 18px; }
	.ssf-prof__body { display: contents; }
	.ssf-prof__role { display: none; }
	.ssf-shopx h1.ssf-prof__name, h1.ssf-prof__name { grid-column: 2; align-self: end; font-size: 21px !important; margin-bottom: 2px !important; }
	.ssf-prof__meta { grid-column: 2; align-self: start; font-size: 13.5px; margin-bottom: 0 !important; }
	.ssf-prof__desc, button.ssf-prof__more { grid-column: 1 / -1; }
	.ssf-prof__desc { font-size: 14.5px; margin-top: 12px; }
	button.ssf-prof__more { justify-self: start; }
	.ssf-about { grid-template-columns: 1fr; margin-top: 24px; }
	.ssf-about__card { padding: 16px; gap: 14px; border-radius: 18px; }
	a.ssf-about__media { width: 64px; height: 64px; font-size: 12px; }
	h3.ssf-about__name { font-size: 17px !important; }
}