/*
 * Cridare News — páginas institucionais e páginas comuns.
 */

.cn-page {
	padding-block: clamp(2rem, 5vw, 4.5rem);
}

.cn-page__shell {
	width: min(calc(100% - 2rem), 50rem);
	margin-inline: auto;
}

.cn-page__breadcrumb {
	margin-block-end: var(--cn-space-5);
	color: var(--cn-text-muted);
	font-family: var(--cn-font-ui);
	font-size: 0.78rem;
}

.cn-page__breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: var(--cn-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.cn-page__breadcrumb li:not(:last-child)::after {
	margin-inline-start: var(--cn-space-2);
	content: "/";
}

.cn-page__breadcrumb a {
	color: inherit;
	text-underline-offset: 0.15em;
}

.cn-page__breadcrumb a:hover,
.cn-page__breadcrumb a:focus-visible {
	color: var(--cn-brand-secondary);
}

.cn-page__header {
	margin-block-end: clamp(1.75rem, 4vw, 3rem);
}

.cn-page__title {
	margin: 0;
	color: var(--cn-brand-primary);
	font-family: var(--cn-font-ui);
	font-size: clamp(2rem, 5vw, 3.6rem);
	font-weight: 800;
	line-height: 1.05;
	overflow-wrap: break-word;
}

.cn-page__header::after {
	display: block;
	width: 3rem;
	height: 0.25rem;
	margin-block-start: var(--cn-space-3);
	background: var(--cn-brand-secondary);
	content: "";
}

.cn-page__content {
	color: var(--cn-text);
	font-family: var(--cn-font-editorial);
	font-size: clamp(1.05rem, 1.5vw, 1.18rem);
	line-height: 1.72;
	overflow-wrap: anywhere;
}

.cn-page__content > * {
	max-width: 100%;
}

.cn-page__content p,
.cn-page__content ul,
.cn-page__content ol,
.cn-page__content blockquote,
.cn-page__content figure,
.cn-page__content pre,
.cn-page__content table {
	margin-block: 0 var(--cn-space-5);
}

.cn-page__content h2,
.cn-page__content h3,
.cn-page__content h4 {
	margin-block: var(--cn-space-7) var(--cn-space-3);
	color: var(--cn-brand-primary);
	font-family: var(--cn-font-ui);
	line-height: 1.18;
}

.cn-page__content h2 { font-size: clamp(1.5rem, 3vw, 2rem); }
.cn-page__content h3 { font-size: clamp(1.25rem, 2.4vw, 1.6rem); }
.cn-page__content h4 { font-size: 1.15rem; }

.cn-page__content ul,
.cn-page__content ol {
	padding-inline-start: 1.4em;
}

.cn-page__content a {
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.12em;
}

.cn-page__content blockquote {
	margin-inline: 0;
	padding-inline-start: var(--cn-space-5);
	border-inline-start: 3px solid var(--cn-brand-secondary);
	color: var(--cn-brand-primary);
	font-size: 1.12em;
	font-style: italic;
}

.cn-page__content img,
.cn-page__content video,
.cn-page__content iframe {
	display: block;
	max-width: 100%;
	height: auto;
	margin-inline: auto;
}

.cn-page__content .wp-block-table {
	overflow-x: auto;
}

.cn-page__content table {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--cn-font-ui);
	font-size: 0.9em;
}

.cn-page__content th,
.cn-page__content td {
	padding: var(--cn-space-2) var(--cn-space-3);
	border: 1px solid var(--cn-border);
	text-align: start;
	vertical-align: top;
}

.cn-page__content th {
	background: var(--cn-surface-muted);
	color: var(--cn-brand-primary);
}

.cn-page__content .wp-block-button__link {
	font-family: var(--cn-font-ui);
}

.cn-page__content pre {
	max-width: 100%;
	padding: var(--cn-space-4);
	overflow-x: auto;
}

.cn-page__content .alignwide,
.cn-page__content .alignfull {
	width: auto;
	margin-inline: 0;
}

.cn-page__pagination {
	display: flex;
	flex-wrap: wrap;
	gap: var(--cn-space-2);
	align-items: center;
	margin-block-start: var(--cn-space-6);
	font-family: var(--cn-font-ui);
	font-size: 0.85rem;
}

.cn-page__pagination a,
.cn-page__pagination span {
	display: inline-block;
	padding: 0.35rem 0.65rem;
	border: 1px solid var(--cn-border);
	text-decoration: none;
}

@media (max-width: 479px) {
	.cn-page__shell {
		width: min(calc(100% - 1.25rem), 50rem);
	}
}