/**
 * Pilar Vicente — Páginas interiores (rediseño 2026).
 *
 * Hoja compartida por Nosotros, Contacto y Tasación: los tres prototipos usan
 * el mismo armazón (contenedor 1200px, hero split rojo, tarjetas blancas) y no
 * tiene sentido una hoja por página con los mismos valores repetidos.
 *
 * Fuente de verdad: disenos/Nosotros.dc.html · Contacto.dc.html · Tasacion.dc.html.
 * Depende de pv-ds.css (tokens, botones, formularios).
 *
 * @package PilarVicente\Core
 */

/* ═══════════════════════════════════════════════════════════════════════════
   0 · ARMAZÓN — estas páginas usan 1200px, no los 1360px del home
   ═══════════════════════════════════════════════════════════════════════════ */

.pv-pag { background: var(--pv-marfil); }
.pv-pag__wrap {
	max-width: 1200px;
	margin: 0 auto;
	padding-left: 32px;
	padding-right: 32px;
	width: 100%;
}

/* ═══════════════════════════════════════════════════════════════════════════
   1 · HERO SPLIT (Nosotros)
   ═══════════════════════════════════════════════════════════════════════════ */

.pv-pag__hero {
	display: grid;
	grid-template-columns: 1.1fr .9fr;
	margin-top: 32px;
	border-radius: 28px;
	overflow: hidden;
}
.pv-pag__hero-panel {
	background: var(--pv-marca);
	color: var(--pv-sobre-rojo);
	padding: 64px 56px;
}
.pv-pag__hero-titulo {
	font-family: var(--pv-display);
	font-weight: 800;
	font-size: 56px;
	line-height: 1;
	letter-spacing: -.03em;
	margin: 18px 0 0;
	color: var(--pv-sobre-rojo);
	text-wrap: balance;
}
.pv-pag__hero-bajada {
	font-size: 18px;
	line-height: 1.6;
	color: var(--pv-sobre-rojo-p);
	margin: 22px 0 0;
	max-width: 480px;
}
.pv-pag__hero-foto {
	background-size: cover;
	background-position: center;
	background-color: var(--pv-arena);
	min-height: 400px;
}

/* Encabezado simple (Contacto / Tasación): kicker + h1 sobre marfil */
.pv-pag__intro { padding-top: 48px; }
.pv-pag__titulo {
	font-family: var(--pv-display);
	font-weight: 800;
	font-size: 52px;
	line-height: 1;
	letter-spacing: -.03em;
	margin: 14px 0 0;
	color: var(--pv-txt);
	text-wrap: balance;
}

/* ═══════════════════════════════════════════════════════════════════════════
   2 · STATS
   ═══════════════════════════════════════════════════════════════════════════ */

.pv-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	padding-top: 56px;
}
.pv-stat {
	background: #fff;
	border-radius: 18px;
	padding: 28px;
	text-align: center;
	box-shadow: var(--pv-sh-suave);
}
.pv-stat__valor {
	font-family: var(--pv-display);
	font-size: 40px;
	font-weight: 800;
	color: var(--pv-marca);
	line-height: 1.05;
}
.pv-stat__label { font-size: 14px; color: var(--pv-txt-3); margin-top: 4px; }

/* ═══════════════════════════════════════════════════════════════════════════
   3 · FRASE CENTRADA
   ═══════════════════════════════════════════════════════════════════════════ */

.pv-frase {
	max-width: 900px;
	margin: 0 auto;
	padding: 64px 32px 0;
	text-align: center;
}
.pv-frase p {
	font-family: var(--pv-display);
	font-weight: 500;
	font-size: 26px;
	line-height: 1.5;
	color: var(--pv-txt);
	text-wrap: balance;
}

/* Prosa institucional (página Nosotros) */
.pv-pag__prosa {
	max-width: 760px;
	margin: 64px auto 0;
}
.pv-pag__prosa p {
	font-size: 17px;
	line-height: 1.75;
	color: var(--pv-txt-2);
	margin: 0 0 16px;
}
.pv-pag__prosa p:last-child { margin-bottom: 0; }

/* ═══════════════════════════════════════════════════════════════════════════
   4 · SECCIONES CON CABECERA CENTRADA
   ═══════════════════════════════════════════════════════════════════════════ */

.pv-pag__seccion { padding-top: 72px; }
.pv-pag__head {
	text-align: center;
	max-width: 600px;
	margin: 0 auto 40px;
}
.pv-pag__h2 {
	font-family: var(--pv-display);
	font-weight: 800;
	font-size: 42px;
	letter-spacing: -.02em;
	margin: 8px 0 0;
	color: var(--pv-txt);
	text-wrap: balance;
}

/* ── Valores ─────────────────────────────────────────────────────────────── */
.pv-valores { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.pv-valor {
	background: #fff;
	border-radius: var(--pv-r-card);
	padding: 32px;
	box-shadow: var(--pv-sh-suave);
}
.pv-valor__icono { font-size: 30px; line-height: 1; }
.pv-valor__titulo {
	font-family: var(--pv-display);
	font-weight: 700;
	font-size: 22px;
	margin-top: 14px;
	color: var(--pv-txt);
}
.pv-valor__texto { font-size: 15px; line-height: 1.6; color: var(--pv-txt-2); margin: 10px 0 0; }

/* ── Equipo ──────────────────────────────────────────────────────────────── */
.pv-equipo { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.pv-persona {
	background: #fff;
	border-radius: var(--pv-r-card);
	overflow: hidden;
	box-shadow: var(--pv-sh-suave);
}
.pv-persona__retrato {
	height: 260px;
	background: var(--pv-arena);
	background-size: cover;
	background-position: center;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--pv-display);
	font-weight: 800;
	font-size: 48px;
	color: var(--pv-marca);
}
.pv-persona__body { padding: 22px; }
.pv-persona__nombre {
	font-family: var(--pv-display);
	font-weight: 700;
	font-size: 20px;
	color: var(--pv-txt);
}
.pv-persona__rol { font-size: 14px; color: var(--pv-marca); font-weight: 600; margin-top: 2px; }
.pv-persona__bio { font-size: 14px; line-height: 1.55; color: var(--pv-txt-3); margin: 12px 0 0; }

/* ═══════════════════════════════════════════════════════════════════════════
   5 · CTA
   ═══════════════════════════════════════════════════════════════════════════ */

.pv-pag__cta { padding-top: 72px; }
.pv-pag__cta-caja {
	background: var(--pv-marca);
	color: var(--pv-sobre-rojo);
	border-radius: var(--pv-r-bloque);
	padding: 56px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 32px;
	flex-wrap: wrap;
}
.pv-pag__cta-titulo {
	font-family: var(--pv-display);
	font-weight: 800;
	font-size: 36px;
	letter-spacing: -.02em;
	margin: 0;
	color: var(--pv-sobre-rojo);
	text-wrap: balance;
}
.pv-pag__cta-bajada { font-size: 17px; color: var(--pv-sobre-rojo-p); margin: 12px 0 0; }
.pv-pag__cta-btns { display: flex; gap: 12px; flex-wrap: wrap; }
.pv-pag__cta-btns .pv-btn { font-size: 16px; padding: 16px 30px; }

/* ═══════════════════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 1100px) {
	.pv-pag__hero-panel { padding: 48px 40px; }
	.pv-pag__hero-titulo { font-size: 44px; }
	.pv-pag__titulo { font-size: 42px; }
	.pv-stats { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
	.pv-pag__hero { grid-template-columns: 1fr; }
	.pv-pag__hero-foto { min-height: 260px; order: -1; }
	.pv-valores,
	.pv-equipo { grid-template-columns: repeat(2, 1fr); }
	.pv-pag__h2 { font-size: 32px; }
	.pv-frase p { font-size: 22px; }
	.pv-pag__cta-caja { padding: 40px 32px; }
	.pv-pag__cta-titulo { font-size: 28px; }
}

@media (max-width: 640px) {
	.pv-pag__wrap { padding-left: 20px; padding-right: 20px; }

	.pv-pag__hero { margin-top: 8px; border-radius: 22px; }
	.pv-pag__hero-panel { padding: 28px 24px 32px; }
	.pv-pag__hero-titulo { font-size: 32px; letter-spacing: -.02em; margin-top: 12px; }
	.pv-pag__hero-bajada { font-size: 15px; margin-top: 14px; }
	.pv-pag__hero-foto { min-height: 200px; }

	.pv-pag__intro { padding-top: 28px; }
	.pv-pag__titulo { font-size: 30px; }

	.pv-stats { grid-template-columns: repeat(2, 1fr); gap: 12px; padding-top: 32px; }
	.pv-stat { padding: 18px 12px; border-radius: 14px; }
	.pv-stat__valor { font-size: 28px; }
	.pv-stat__label { font-size: 12px; }

	.pv-frase { padding: 36px 8px 0; }
	.pv-frase p { font-size: 18px; line-height: 1.45; }
	.pv-pag__prosa { margin-top: 36px; }
	.pv-pag__prosa p { font-size: 16px; line-height: 1.7; }

	.pv-pag__seccion { padding-top: 40px; }
	.pv-pag__head { margin-bottom: 22px; }
	.pv-pag__h2 { font-size: 24px; }

	.pv-valores,
	.pv-equipo { grid-template-columns: 1fr; gap: 14px; }
	.pv-valor { padding: 24px; }
	.pv-valor__titulo { font-size: 19px; }
	.pv-persona__retrato { height: 180px; font-size: 38px; }

	.pv-pag__cta { padding-top: 40px; }
	.pv-pag__cta-caja { padding: 28px 24px; border-radius: 20px; }
	.pv-pag__cta-titulo { font-size: 24px; }
	.pv-pag__cta-bajada { font-size: 15px; }
	.pv-pag__cta-btns { width: 100%; }
	.pv-pag__cta-btns .pv-btn { flex: 1; justify-content: center; font-size: 15px; padding: 15px 20px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   6 · CONTACTO
   Fuente: disenos/Contacto.dc.html
   ═══════════════════════════════════════════════════════════════════════════ */

.pv-contacto__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: start;
	margin-top: 40px;
}

/* Canales: teléfono · WhatsApp · correo · Instagram */
.pv-canales { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.pv-canal {
	display: block;
	background: #fff;
	border-radius: 16px;
	padding: 22px;
	box-shadow: var(--pv-sh-suave);
	color: var(--pv-txt);
}
.pv-canal:hover { box-shadow: var(--pv-sh-card); color: var(--pv-txt); }
.pv-canal__icono { font-size: 24px; line-height: 1; }
.pv-canal__titulo {
	font-family: var(--pv-display);
	font-weight: 700;
	font-size: 16px;
	margin-top: 10px;
}
.pv-canal__valor { font-size: 14px; color: var(--pv-marca); font-weight: 600; margin-top: 3px; word-break: break-word; }

/* Tarjeta blanca genérica de estas páginas (formulario, oficina, horarios) */
.pv-tarjeta {
	background: #fff;
	border-radius: var(--pv-r-card);
	padding: 28px;
	box-shadow: var(--pv-sh-suave);
	margin-top: 16px;
}
.pv-tarjeta__h2 {
	font-family: var(--pv-display);
	font-weight: 700;
	font-size: 22px;
	margin: 0 0 18px;
	color: var(--pv-txt);
}
.pv-tarjeta__h3 {
	font-family: var(--pv-display);
	font-weight: 700;
	font-size: 20px;
	color: var(--pv-txt);
}

.pv-contacto__mapa {
	height: 360px;
	border-radius: var(--pv-r-card);
	overflow: hidden;
	box-shadow: var(--pv-sh-suave);
	background: var(--pv-arena);
}
.pv-contacto__direccion { font-size: 15px; color: var(--pv-txt-2); margin-top: 8px; line-height: 1.6; }

.pv-horario { margin-top: 20px; padding-top: 20px; border-top: 1px solid rgba(42, 21, 18, .1); }
.pv-horario__titulo {
	font-family: var(--pv-display);
	font-weight: 700;
	font-size: 16px;
	margin-bottom: 10px;
	color: var(--pv-txt);
}
.pv-horario__fila {
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	color: var(--pv-txt-2);
	padding: 5px 0;
}
.pv-horario__fila--cerrado { color: var(--pv-txt-3); }
.pv-horario__fila span:last-child { font-weight: 600; }

/* El botón de Contacto lleva 15px (Tasación usa 16px) */
.pv-contacto__enviar { padding: 15px; margin-top: 20px; }
.pv-contacto__mensaje { min-height: 96px; }

/* ═══════════════════════════════════════════════════════════════════════════
   7 · TASACIÓN
   Fuente: disenos/Tasacion.dc.html
   ═══════════════════════════════════════════════════════════════════════════ */

.pv-tasacion__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: start;
	padding-top: 40px;
}
.pv-tasacion__copy { padding-top: 20px; }
.pv-tasacion__titulo {
	font-family: var(--pv-display);
	font-weight: 800;
	font-size: 56px;
	line-height: 1;
	letter-spacing: -.03em;
	margin: 16px 0 0;
	color: var(--pv-txt);
	text-wrap: balance;
}
.pv-tasacion__bajada {
	font-size: 18px;
	line-height: 1.6;
	color: var(--pv-txt-2);
	margin: 22px 0 0;
	max-width: 460px;
}

/* Los 3 pasos */
.pv-pasos { display: flex; flex-direction: column; gap: 18px; margin-top: 36px; }
.pv-paso { display: flex; align-items: flex-start; gap: 16px; }
.pv-paso__num {
	width: 38px;
	height: 38px;
	flex-shrink: 0;
	border-radius: var(--pv-r-pill);
	background: var(--pv-marca);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--pv-display);
	font-weight: 800;
	font-size: 17px;
}
.pv-paso__titulo {
	font-family: var(--pv-display);
	font-weight: 700;
	font-size: 17px;
	color: var(--pv-txt);
}
.pv-paso__desc { font-size: 14px; color: var(--pv-txt-3); margin-top: 2px; }

.pv-tasacion__cifras {
	display: flex;
	gap: 32px;
	margin-top: 40px;
	padding-top: 32px;
	border-top: 1px solid rgba(42, 21, 18, .1);
	flex-wrap: wrap;
}
.pv-tasacion__cifra-num {
	display: block;
	font-family: var(--pv-display);
	font-size: 32px;
	font-weight: 800;
	color: var(--pv-marca);
	line-height: 1.05;
}
.pv-tasacion__cifra-label { display: block; font-size: 13px; color: var(--pv-txt-3); }

/* Tarjeta del formulario: radio 24, sombra flotante */
.pv-form-card {
	background: #fff;
	border-radius: var(--pv-r-bloque);
	padding: 36px;
	box-shadow: 0 24px 60px rgba(60, 20, 20, .12);
}
.pv-form-card__h2 {
	font-family: var(--pv-display);
	font-weight: 800;
	font-size: 26px;
	letter-spacing: -.02em;
	margin: 0 0 4px;
	color: var(--pv-txt);
}
.pv-form-card__intro { font-size: 14px; color: var(--pv-txt-3); margin: 0 0 24px; }

/* ═══════════════════════════════════════════════════════════════════════════
   RESPONSIVE de Contacto y Tasación
   ═══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 900px) {
	.pv-contacto__grid,
	.pv-tasacion__grid { grid-template-columns: 1fr; gap: 32px; }
	.pv-tasacion__copy { padding-top: 0; }
	.pv-tasacion__titulo { font-size: 42px; }
	.pv-form-card { padding: 28px; }
}

@media (max-width: 640px) {
	.pv-contacto__grid { margin-top: 24px; gap: 24px; }
	.pv-canales { gap: 12px; }
	.pv-canal { padding: 16px; border-radius: 14px; }
	.pv-canal__titulo { font-size: 15px; }
	.pv-canal__valor { font-size: 13px; }

	.pv-tarjeta { padding: 22px; border-radius: 18px; }
	.pv-tarjeta__h2 { font-size: 19px; margin-bottom: 14px; }
	.pv-contacto__mapa { height: 240px; border-radius: 18px; }

	.pv-tasacion__grid { padding-top: 24px; gap: 24px; }
	.pv-tasacion__titulo { font-size: 30px; }
	.pv-tasacion__bajada { font-size: 15px; margin-top: 14px; }
	.pv-pasos { margin-top: 24px; gap: 14px; }
	.pv-tasacion__cifras { margin-top: 28px; padding-top: 22px; gap: 24px; }
	.pv-tasacion__cifra-num { font-size: 26px; }

	.pv-form-card { padding: 22px; border-radius: 20px; }
	.pv-form-card__h2 { font-size: 21px; }

	/* Los formularios se apilan: dos campos por fila no caben a 375px */
	.pv-form__fila,
	.pv-form__fila--3 { grid-template-columns: 1fr; gap: 12px; }
	.pv-form__fila + .pv-form__fila,
	.pv-form__campo + .pv-form__campo,
	.pv-form__fila + .pv-form__campo,
	.pv-form__campo + .pv-form__fila { margin-top: 12px; }
}