/* =========================================================
   hero.css — editorial statement hero
   ========================================================= */

.as-hero {
	position: relative;
	min-height: 100vh;
	display: flex;
	align-items: center;
	padding-top: 80px;
	padding-bottom: 120px;
}

.as-hero__inner {
	width: 100%;
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 var(--gutter);
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: 32px;
}

.as-hero__content {
	grid-column: 1 / span 10;
	max-width: 1040px;
}

.as-hero__h1 {
	font-size: var(--f-display-xl);
	line-height: 1.02;
	letter-spacing: -0.02em;
	margin: 0 0 0;
	font-weight: 400;
	font-family: var(--f-display);
}

.as-hero__intro {
	max-width: 560px;
	font-size: var(--f-body-l);
	line-height: 1.55;
	color: var(--c-paper-muted);
	margin: 28px 0 0 0;
}
.as-section--paper .as-hero__intro { color: var(--c-ink-muted); }

.as-hero__cta {
	margin-top: 40px;
	display: inline-flex;
	gap: 32px;
	align-items: center;
	flex-wrap: wrap;
}

/* Smaller hero (inner pages) — padding-bottom dla counter (pozycjonowany: bottom 40px) */
.as-hero--inner {
	min-height: auto;
	padding-top: 40px;
	padding-bottom: 96px;
}
.as-hero--inner .as-hero__h1 {
	font-size: var(--f-display-l);
}

/* Page hero content full-width on inner pages */
.as-hero--inner .as-hero__content {
	grid-column: 1 / span 10;
}