/* /subscribe page-only styles. The pricing table itself lives in
   assets/css/pricing-table.css (shared with the homepage). */

/* ── Purple page banner: headline lives here on /subscribe ──────────── */
/* The theme gives this banner a fixed 350px height sized for one short title;
   let it grow with the eyebrow + headline + lede instead. */
.oss-subscribe-page .page-banner.blog-details-banner {
	height: auto;
	min-height: 350px;
	padding: 150px 16px 72px;
}
.oss-subscribe-page .page-banner.blog-details-banner .page-title-wrapper { margin-top: 0; }

.oss-sub-hero { font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif; }
.oss-sub-hero .oss-sub-hero__eyebrow,
.oss-sub-hero .oss-sub-hero__title,
.oss-sub-hero .oss-sub-hero__lede { position: relative; z-index: 2; } /* above the banner's circles */
.oss-sub-hero .oss-sub-hero__eyebrow {
	margin: 0 0 12px;
	color: #6b4ef6;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .18em;
	text-transform: uppercase;
}
.oss-sub-hero .oss-sub-hero__title {
	margin: 0 auto 16px;
	max-width: 24em;
	color: #221f4a;
	font-size: clamp(28px, 4.2vw, 42px);
	font-weight: 700;
	line-height: 1.15;
}
.oss-sub-hero .oss-sub-hero__lede {
	margin: 0 auto;
	max-width: 26em;
	color: #5f5d78;
	font-size: 16px;
	line-height: 1.6;
}

/* The headline sits in the banner, so the table starts closer to it. */
.oss-subscribe-page .oss-pt { padding-top: 64px; }

/* Without the full nav menu the header collapses and the logo + CTA sit flush
   against the top of the window; give the resting header some room. */
.oss-subscribe-page .site-header:not(.pix-header-fixed) .header-inner { padding-top: 24px; }

@media (max-width: 760px) {
	.oss-subscribe-page .page-banner.blog-details-banner { padding: 120px 16px 56px; }
	.oss-subscribe-page .site-header:not(.pix-header-fixed) .header-inner { padding-top: 12px; }
	.oss-subscribe-page .oss-pt { padding-top: 40px; }
}