/**
 * GDC Zone 2: The Hook — Styles
 * S7 §Z2: Narrative hook paragraph styling
 *
 * @package GDC
 * @since   5.0.0
 */

/* S7 §Z2: Zone container */
.gdc-zone-2-hook {
	background: var(--gdc-bg-deep);
}

/* S7 §Z2.2: Inner wrapper — centered, constrained */
.gdc-hook-inner {
	max-width: var(--gdc-max-narrow);
	margin: 0 auto;
	padding: var(--gdc-section-py-mobile) var(--gdc-section-px-mobile);
}

/* S7 §Z2.2: Lead paragraph — body font, 1.1rem, 1.8 line-height, left-aligned */
.gdc-hook-lead {
	font-family: var(--gdc-font-body);
	font-size: 1.1rem;
	font-weight: var(--gdc-font-regular);
	line-height: 1.8;
	color: var(--gdc-white-muted);
	margin: 0 0 var(--gdc-space-3);
	text-align: left;
}

/* S7 §Z2.4: Partner variant line */
.gdc-hook-partner {
	font-family: var(--gdc-font-body);
	font-size: 1rem;
	line-height: 1.8;
	color: var(--gdc-white-muted);
	margin: 0 0 var(--gdc-space-3);
	text-align: left;
	font-style: italic;
}

/* S7 §Z2.6: Attribution line */
.gdc-hook-attribution {
	font-family: var(--gdc-font-body);
	font-size: var(--gdc-text-sm);
	color: var(--gdc-alpha-50);
	margin: var(--gdc-space-2) 0 0;
	text-align: left;
}

/* Tablet+ (768px) */
@media (min-width: 768px) {
	.gdc-hook-inner {
		padding: var(--gdc-space-10) var(--gdc-space-4);
	}

	.gdc-hook-lead {
		font-size: 1.15rem;
	}
}

/* Desktop (1200px+) */
@media (min-width: 1200px) {
	.gdc-hook-inner {
		padding: var(--gdc-section-py-desktop) var(--gdc-space-4);
	}

	.gdc-hook-lead {
		font-size: 1.2rem;
	}
}

/* S7 §Z2.8: Scroll fade-in (shared with other zones via se-visible class) */
@media (prefers-reduced-motion: no-preference) {
	.gdc-hook-inner {
		opacity: 0;
		transform: translateY(var(--gdc-scroll-slide-distance));
		transition:
			opacity var(--gdc-scroll-fade-duration) var(--gdc-ease-default),
			transform var(--gdc-scroll-fade-duration) var(--gdc-ease-default);
	}

	.gdc-hook-inner.se-visible {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.gdc-hook-inner {
		opacity: 1;
		transform: none;
	}
}
