/**
 * Auditajus — Inner Page Content Styles
 *
 * Typography, spacing and polish for prose-heavy inner pages
 * (page-metodo, page-quem-assina, page-perguntas) that use
 * .container--narrow with raw h2/h3/p/ul content.
 *
 * @package Auditajus
 */


/* ============================================================
   1. INNER PAGE CONTENT TYPOGRAPHY
   ============================================================ */

.container--narrow h2 {
	font-family: var(--serif);
	font-size: clamp(1.5rem, 2.5vw, 2rem);
	font-weight: 300;
	color: var(--ink);
	margin: 3rem 0 1rem;
	line-height: 1.15;
	letter-spacing: -0.02em;
}

.container--narrow h2:first-of-type {
	margin-top: 0;
}

.container--narrow h3 {
	font-family: var(--serif);
	font-size: clamp(1.1rem, 1.6vw, 1.35rem);
	font-weight: 400;
	color: var(--ink);
	margin: 2.25rem 0 0.75rem;
	line-height: 1.25;
}

.container--narrow > p {
	font-size: 1.05rem;
	line-height: 1.8;
	color: var(--ink-soft);
	margin-bottom: 1.5rem;
	max-width: 65ch;
}

.container--narrow > p strong {
	color: var(--ink);
	font-weight: 500;
}

.container--narrow > ul,
.container--narrow > ol {
	margin: 0 0 1.75rem 1.25rem;
	padding: 0;
}

.container--narrow > ul li,
.container--narrow > ol li {
	font-size: 1rem;
	line-height: 1.7;
	color: var(--ink-soft);
	margin-bottom: 0.5rem;
	padding-left: 0.25rem;
}

.container--narrow > ul li::marker {
	color: var(--brass);
}


/* ============================================================
   2. DEFINITION__WHEN — checkmark variant (page-quem-assina)
   Overrides the existing dash (—) marker with a ✓ in moss.
   ============================================================ */

.definition__when li {
	padding-left: 1.5rem;
}

.definition__when li::before {
	content: "\2713";
	color: var(--moss);
	font-weight: bold;
}


/* ============================================================
   3. PAGE HERO COMPACT — eyebrow polish
   ============================================================ */

.page-hero--compact .eyebrow {
	color: var(--brass);
}

.page-hero--compact .eyebrow::before {
	content: "";
	display: inline-block;
	width: 2rem;
	height: 1px;
	background: var(--brass);
	vertical-align: middle;
	margin-right: 0.75rem;
}


/* ============================================================
   4. INNER PAGE SECTION SPACING
   ============================================================ */

body:not(.home) .section {
	padding: clamp(3rem, 6vw, 5rem) 0;
}

body:not(.home) .section:nth-of-type(even) {
	background: var(--bone-warm);
}

body:not(.home) .section + .section {
	border-top: none;
}


/* ============================================================
   5. RESPONSIVE — max-width 680px
   ============================================================ */

@media (max-width: 680px) {

	.container--narrow h2 {
		font-size: clamp(1.3rem, 5vw, 1.65rem);
		margin: 2rem 0 0.75rem;
	}

	.container--narrow h3 {
		font-size: clamp(1rem, 3.5vw, 1.2rem);
		margin: 1.75rem 0 0.5rem;
	}

	.container--narrow > p {
		font-size: 0.97rem;
		line-height: 1.7;
	}

	.container--narrow > ul,
	.container--narrow > ol {
		margin-left: 1rem;
		margin-bottom: 1.25rem;
	}

	.container--narrow > ul li,
	.container--narrow > ol li {
		font-size: 0.93rem;
	}

	body:not(.home) .section {
		padding: clamp(2rem, 5vw, 3.5rem) 0;
	}
}