/**
 * Página genérica (page.php) — tipografía y espaciado de contenido largo.
 *
 * Antes esta plantilla no tenía NINGÚN estilo propio: el título y el
 * contenido quedaban pegados al menú, sin aire, y listas/tablas salían
 * con el estilo por defecto del navegador. Pensado para páginas de
 * texto largo (legales, políticas) — columna angosta para lectura
 * cómoda, con más aire arriba/abajo y tipografía consistente con el
 * resto del tema.
 *
 * @package HospediaPro
 * @since   1.0.0
 */

.page-main {
	padding-top: var(--hp-space-16, 4rem);
	padding-bottom: var(--hp-space-24, 6rem);
}

.page-article {
	max-width: 760px;
	margin: 0 auto;
}

.page-article .entry-header {
	margin-bottom: var(--hp-space-8, 2rem);
	padding-bottom: var(--hp-space-6, 1.5rem);
	border-bottom: 1px solid var(--hp-color-border, #e5e7eb);
}

.page-article .entry-title {
	margin: 0;
	font-size: var(--hp-fs-4xl, 2.5rem);
	line-height: 1.15;
}

.page-article .entry-thumbnail {
	margin-bottom: var(--hp-space-8, 2rem);
	border-radius: var(--hp-radius-lg, 16px);
	overflow: hidden;
}

/* ── Tipografía del contenido ─────────────────────────────────────── */

.page-article .entry-content {
	font-size: var(--hp-fs-base, 1rem);
	line-height: 1.75;
	color: var(--hp-color-text, #1a1a1a);
}

.page-article .entry-content > *:first-child {
	margin-top: 0;
}

.page-article .entry-content h2 {
	margin-top: var(--hp-space-12, 3rem);
	margin-bottom: var(--hp-space-4, 1rem);
	font-size: var(--hp-fs-2xl, 1.5rem);
	padding-top: var(--hp-space-4, 1rem);
}

.page-article .entry-content h3 {
	margin-top: var(--hp-space-8, 2rem);
	margin-bottom: var(--hp-space-3, .75rem);
	font-size: var(--hp-fs-xl, 1.25rem);
}

.page-article .entry-content p {
	margin: 0 0 var(--hp-space-4, 1rem);
	color: var(--hp-color-text-muted, #555555);
}

.page-article .entry-content strong {
	color: var(--hp-color-text, #1a1a1a);
	font-weight: 700;
}

.page-article .entry-content a {
	text-decoration: underline;
	text-decoration-color: rgba(59, 130, 246, .35);
	text-underline-offset: 2px;
}

.page-article .entry-content ul,
.page-article .entry-content ol {
	margin: 0 0 var(--hp-space-6, 1.5rem);
	padding-left: 1.3rem;
	color: var(--hp-color-text-muted, #555555);
}

.page-article .entry-content li {
	margin-bottom: var(--hp-space-2, .5rem);
	line-height: 1.65;
}

.page-article .entry-content li > ul,
.page-article .entry-content li > ol {
	margin-top: var(--hp-space-2, .5rem);
	margin-bottom: 0;
}

.page-article .entry-content hr {
	margin: var(--hp-space-12, 3rem) 0;
	border: none;
	border-top: 1px solid var(--hp-color-border, #e5e7eb);
}

.page-article .entry-content blockquote {
	margin: var(--hp-space-6, 1.5rem) 0;
	padding: var(--hp-space-4, 1rem) var(--hp-space-6, 1.5rem);
	border-left: 3px solid var(--hp-color-primary, #3B82F6);
	background: #f8faff;
	border-radius: 0 var(--hp-radius-md, 10px) var(--hp-radius-md, 10px) 0;
	color: var(--hp-color-text-muted, #555555);
}

/* ── Tablas (usadas en las páginas legales) ───────────────────────── */

.page-article .entry-content .wp-block-table,
.page-article .entry-content table {
	margin: 0 0 var(--hp-space-6, 1.5rem);
	width: 100%;
	overflow-x: auto;
	display: block;
}

.page-article .entry-content table {
	border-collapse: collapse;
	font-size: var(--hp-fs-sm, .875rem);
}

.page-article .entry-content table th,
.page-article .entry-content table td {
	padding: var(--hp-space-3, .75rem) var(--hp-space-4, 1rem);
	border: 1px solid var(--hp-color-border, #e5e7eb);
	text-align: left;
	vertical-align: top;
}

.page-article .entry-content table th {
	background: #f8faff;
	font-family: var(--hp-font-heading, sans-serif);
	font-weight: 600;
	color: var(--hp-color-text, #1a1a1a);
	white-space: nowrap;
}

.page-article .entry-content table tr:nth-child(even) td {
	background: #fafbfc;
}

/* ── Responsive ────────────────────────────────────────────────────── */

@media (max-width: 640px) {
	.page-main {
		padding-top: var(--hp-space-8, 2rem);
		padding-bottom: var(--hp-space-12, 3rem);
	}
	.page-article .entry-title {
		font-size: var(--hp-fs-3xl, 2rem);
	}
	.page-article .entry-content table th,
	.page-article .entry-content table td {
		padding: var(--hp-space-2, .5rem) var(--hp-space-3, .75rem);
	}
}