/**
 * Hero section styles
 * Loaded when: core/cover block with .campbell-fse-hero is present
 */

.campbell-fse-hero {
	/* Gradient overlay — diagonal per Figma */
	&::before {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(218.8deg, rgba(255, 255, 255, 0) 18.6%, var(--wp--preset--color--primary) 74.5%);
		mix-blend-mode: multiply;
		z-index: 1;
		pointer-events: none;
	}

	/* Decorative C logo — pinned to the right edge of the 1200px content area */
	.wp-block-cover__inner-container {
		position: relative;
		z-index: 2;

		&::before {
			content: '';
			position: absolute;
			top: 50%;
			/* Centre of viewport minus half the contentSize (1200px / 2 = 600px),
			   then offset by the logo width so its right edge aligns with the content edge */
			right: calc(50vw - 600px);
			transform: translateY(-50%);
			width: 361px;
			height: 392px;
			background: url('/wp-content/themes/campbell-fse/assets/svg/c-logo-filled.svg') no-repeat center / contain;
			opacity: 0.6;
			mix-blend-mode: multiply;
			z-index: 0;
			pointer-events: none;
		}
	}

	.wp-block-cover__image-background,
	.wp-block-cover__video-background {
		opacity: 1 !important;
	}
}

.hero-heading {
	max-width: 601px;
}

.hero-description {
	color: var(--wp--preset--color--white);
	max-width: 672px;
}

.stats-bar {
	border-top: 5px solid var(--wp--preset--color--header-accent);
}

.stats-number {
	font-variant-numeric: tabular-nums;
}

@media (max-width: 781px) {
	.campbell-fse-hero {
		min-height: 500px !important;

		h1 {
			font-size: 28px !important;
		}

		/* On mobile, shrink logo and let it sit behind the text */
		.wp-block-cover__inner-container::before {
			width: 200px;
			height: 220px;
			right: -10px;
			top: 50%;
			opacity: 0.3;
		}
	}
}
