/* ==========================================================================
   ProLogics — page sections built with blocks (patterns in inc/patterns.php)
   Loaded on the site and inside the block editor. Colours fall back to the
   brand defaults where the main stylesheet isn't present (editor).
   ========================================================================== */

/* Layout: full-width sections, normal blocks at container width ----------- */
.entry-blocks > :not(.alignfull) {
	width: min(100% - 2 * var(--gutter, 24px), var(--container, 1280px));
	margin-inline: auto;
}

.entry-blocks > * + * {
	margin-top: 0;
}

.entry-blocks > :not(.alignfull) + :not(.alignfull) {
	margin-top: 1.2em;
}

.alignfull {
	width: 100%;
	max-width: none;
}

.pl-section {
	--pl-pad: max(var(--gutter, 24px), calc((100% - var(--container, 1280px)) / 2));
	margin: 0;
	padding: clamp(64px, 8vw, 112px) var(--pl-pad);
	background: var(--paper, #fff);
	color: var(--text, #0b0a10);
}

.pl-section--slim {
	padding-block: clamp(40px, 5vw, 64px);
}

.pl-section--tint {
	background: var(--tint, #f6f4fe);
}

.pl-section--dark,
.pl-hero,
.pl-cta {
	background:
		radial-gradient(55% 90% at 88% 0%, rgba(var(--purple-rgb, 109, 40, 217), 0.4), transparent 70%),
		var(--ink, #0b0a10);
	color: #fff;
}

.pl-section > * {
	max-width: 100%;
}

/* First dark header sits under the fixed site header */
.entry-blocks > .pl-hero:first-child {
	padding-top: calc(var(--header-h, 76px) + clamp(64px, 9vw, 112px));
}

/* Type -------------------------------------------------------------------- */
.pl-section .wp-block-heading {
	margin: 0;
	letter-spacing: -0.02em;
	line-height: 1.08;
}

.pl-eyebrow {
	margin: 0 0 16px;
	color: var(--purple, #6d28d9);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.pl-section--dark .pl-eyebrow,
.pl-hero .pl-eyebrow,
.pl-cta .pl-eyebrow {
	color: var(--lavender, #c4b5fd);
}

.pl-hero__title {
	max-width: 900px;
	font-size: clamp(38px, 5.4vw, 68px);
}

.pl-title,
.pl-cta__title {
	max-width: 780px;
	font-size: clamp(32px, 4.4vw, 52px);
}

.pl-lead {
	max-width: 640px;
	margin: 20px 0 0;
	color: var(--muted, #57526b);
	font-size: clamp(17px, 1.6vw, 20px);
	line-height: 1.6;
}

.pl-hero .pl-lead,
.pl-cta .pl-lead,
.pl-section--dark .pl-lead {
	color: var(--muted-dark, #b9b4cc);
}

.pl-section p {
	line-height: 1.65;
}

/* Buttons ----------------------------------------------------------------- */
.pl-section .wp-block-buttons,
.entry-blocks .wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 32px;
}

.wp-block-button .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	min-height: 50px;
	padding: 0 26px;
	border: 1.5px solid transparent;
	border-radius: 999px;
	background: var(--purple, #6d28d9);
	color: #fff;
	font-family: inherit;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
	transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}

.wp-block-button .wp-block-button__link:hover {
	background: var(--purple-dark, #5b21b6);
	color: #fff;
}

.wp-block-button.is-style-outline .wp-block-button__link {
	border-color: currentColor;
	background: transparent;
	color: var(--text, #0b0a10);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--text, #0b0a10);
	color: #fff;
}

.pl-hero .wp-block-button.is-style-outline .wp-block-button__link,
.pl-cta .wp-block-button.is-style-outline .wp-block-button__link,
.pl-section--dark .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: rgba(255, 255, 255, 0.35);
	color: #fff;
}

.pl-hero .wp-block-button.is-style-outline .wp-block-button__link:hover,
.pl-cta .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: #fff;
	color: var(--ink, #0b0a10);
}

/* Columns ----------------------------------------------------------------- */
.pl-section .wp-block-columns {
	gap: 24px;
	margin: 0;
}

.pl-section .wp-block-columns + .wp-block-columns {
	margin-top: 24px;
}

.pl-section .pl-title + .pl-lead + .wp-block-columns,
.pl-section .pl-title + .wp-block-columns,
.pl-section .pl-lead + .wp-block-columns {
	margin-top: clamp(36px, 5vw, 56px);
}

.pl-split {
	align-items: center !important;
	gap: clamp(32px, 6vw, 88px) !important;
}

.pl-split--faq {
	align-items: flex-start !important;
}

.pl-rounded img,
.wp-block-image.pl-rounded img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--radius, 20px);
}

.pl-section .wp-block-image {
	margin: 0;
}

/* Stats ------------------------------------------------------------------- */
.pl-stats .wp-block-column {
	padding-left: 20px;
	border-left: 2px solid var(--lavender, #c4b5fd);
}

.pl-stat__num {
	margin: 0;
	color: var(--purple, #6d28d9);
	font-size: clamp(36px, 4.6vw, 56px);
	font-weight: 800;
	line-height: 1;
}

.pl-stat__label {
	margin: 8px 0 0;
	color: var(--muted, #57526b);
}

/* Cards ------------------------------------------------------------------- */
.pl-card {
	height: 100%;
	padding: 30px;
	border: 1px solid var(--line, #e6e2f2);
	border-radius: var(--radius, 20px);
	background: var(--paper, #fff);
	transition: border-color 0.3s, box-shadow 0.3s;
}

.pl-card:hover {
	border-color: var(--lavender, #c4b5fd);
	box-shadow: 0 24px 50px rgba(var(--deep-rgb, 76, 29, 149), 0.1);
}

.pl-card__title {
	font-size: 22px;
}

.pl-card p {
	margin: 12px 0 0;
	color: var(--muted, #57526b);
}

.pl-section--tint .pl-card {
	border-color: transparent;
}

/* Steps ------------------------------------------------------------------- */
.pl-step__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin: 0 0 20px;
	border: 2px solid var(--lavender, #c4b5fd);
	border-radius: 50%;
	color: #fff;
	font-weight: 800;
}

.pl-step__title {
	font-size: 22px;
}

.pl-steps p:not(.pl-step__num) {
	margin: 10px 0 0;
	color: var(--muted-dark, #b9b4cc);
}

/* Team -------------------------------------------------------------------- */
.pl-member__photo img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: var(--radius, 20px);
}

.pl-member__name {
	margin-top: 18px !important;
	font-size: 20px;
}

.pl-member__role {
	margin: 4px 0 0;
	color: var(--purple, #6d28d9);
	font-weight: 600;
}

/* FAQ --------------------------------------------------------------------- */
.pl-faq .wp-block-details {
	margin: 0;
	padding: 0;
	border-bottom: 1px solid var(--line, #e6e2f2);
}

.pl-faq .wp-block-details:first-child {
	border-top: 1px solid var(--line, #e6e2f2);
}

.pl-faq summary {
	position: relative;
	padding: 22px 40px 22px 0;
	font-size: 18px;
	font-weight: 700;
	list-style: none;
	cursor: pointer;
}

.pl-faq summary::-webkit-details-marker {
	display: none;
}

.pl-faq summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 6px;
	color: var(--purple, #6d28d9);
	font-size: 26px;
	font-weight: 400;
	line-height: 1;
	transform: translateY(-50%);
	transition: transform 0.25s;
}

.pl-faq details[open] summary::after {
	transform: translateY(-50%) rotate(45deg);
}

.pl-faq details p {
	margin: 0 0 22px;
	color: var(--muted, #57526b);
}

/* Checklist --------------------------------------------------------------- */
.pl-checklist {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pl-checklist li {
	position: relative;
	padding: 14px 0 14px 40px;
	border-bottom: 1px solid var(--line, #e6e2f2);
	font-size: 17px;
}

.pl-checklist li::before {
	content: "";
	position: absolute;
	top: 15px;
	left: 0;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center / 14px no-repeat,
		var(--purple, #6d28d9);
}

/* Product price ----------------------------------------------------------- */
.pl-price {
	margin: 24px 0 0;
	color: var(--muted-dark, #b9b4cc);
	font-size: 16px;
}

.pl-price strong {
	margin-right: 6px;
	color: #fff;
	font-size: 40px;
	font-weight: 800;
}

/* Quote ------------------------------------------------------------------- */
.pl-quote {
	max-width: 900px;
	margin: 0 auto;
	padding: 0;
	border: 0;
	text-align: center;
}

.pl-quote p {
	margin: 0;
	font-size: clamp(22px, 2.6vw, 32px);
	font-weight: 600;
	line-height: 1.4;
}

.pl-quote p::before {
	content: "\201C";
	display: block;
	color: var(--purple, #6d28d9);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 80px;
	font-weight: 700;
	line-height: 0.8;
}

.pl-quote cite {
	display: block;
	margin-top: 20px;
	color: var(--muted, #57526b);
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
}

/* CTA --------------------------------------------------------------------- */
.pl-cta {
	text-align: center;
}

.pl-cta .pl-cta__title,
.pl-cta .pl-lead {
	margin-inline: auto;
}

.pl-cta .wp-block-buttons {
	justify-content: center;
}

/* Small screens ----------------------------------------------------------- */
@media (max-width: 781px) {
	.pl-stats {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pl-team {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
