/* Coprocar · sistema de diseño "dark premium carnicería"
   Tokens del canvas aprobado. Dark es el modo por defecto; [data-tema="claro"]
   redefine el lienzo (papel en vez de carbón) manteniendo rojo, tipografía y piezas.
   Los widgets HTML del sitio consumen estas variables, así el toggle los repinta solos. */

:root {
	--cpr-fondo: #120D0A;
	--cpr-fondo-2: #0D0A08;
	--cpr-panel: #191310;
	--cpr-panel-2: #211913;
	--cpr-linea: rgba(243, 235, 221, 0.14);
	--cpr-linea-fuerte: #3A2E24;
	--cpr-rojo: #9E1B22;
	--cpr-rojo-2: #C22F28;
	--cpr-acento: #E0736B;
	--cpr-titulo: #F3EBDD;
	--cpr-texto: #CBBDA9;
	--cpr-mudo: #A2917C;
	--cpr-papel: #EFE5D6;
	--cpr-papel-tinta: #1B1410;
	--cpr-papel-texto: #4A4038;
	--cpr-grano: rgba(243, 235, 221, 0.045);
	--cpr-tinta: #6E5AA6;   /* tinta de timbre de inspección */

	/* La dirección tipográfica vive acá: el resto del sistema la consume por
	   variable, igual que los colores.

	   Dos familias, tres registros. Anton es la letra de cartel de carnicería y
	   sólo habla en los títulos. Todo lo demás es Yantramanav, cambiando de
	   registro por peso, caja y tracking: el dato rotulado se distingue del
	   texto corrido sin traer una tercera fuente. (Se probó una monoespaciada
	   de máquina de escribir para ese rol y se descartó: hoy es un cliché tan
	   reconocible como la numeración decorativa que este sistema vino a matar.) */
	--cpr-display: Anton, 'Arial Narrow', Impact, sans-serif;
	--cpr-dato: Yantramanav, system-ui, sans-serif;
	--cpr-cuerpo: Yantramanav, system-ui, sans-serif;
}

/* Anton viene con un solo peso y muy cerrada: pide algo de aire entre letras y
   nunca los pesos falsos que pedía la escala anterior. */
[style*="--cpr-display"], .cpr-t-titulo .elementor-heading-title,
.elementor-widget-heading .elementor-heading-title,
.cpr-nombre, .cpr-nombre-xl, .cpr-puerta__tit, .cpr-pack__tit, .cpr-cond__val,
.cpr-post__navtit, .cpr-post__reltit, .cpr-art__cta-tit, .cpr-faq summary,
.cpr-blog__tab, .cpr-card__titulo a, .cpl__title, .cpl__q, .cpl__done h3 {
	font-weight: 400 !important;
}

.cpr-t-titulo .elementor-heading-title,
.elementor-widget-heading .elementor-heading-title {
	letter-spacing: 0.005em;
	max-width: 20ch;
}

/* El quiebre equilibrado se reserva a los títulos largos: aplicado a todos
   hacía caer casi cada h2 en dos líneas del mismo largo, que es exactamente el
   tipo de uniformidad que este rediseño vino a romper. */
.elementor-widget-heading h1.elementor-heading-title { text-wrap: balance; }

/* el h1 de cada página sí queda en registro de cartel */
.elementor-widget-heading h1.elementor-heading-title {
	text-transform: uppercase;
	max-width: 14ch;
}

html[data-tema="claro"] {
	--cpr-fondo: #F4ECDF;
	--cpr-fondo-2: #EDE3D2;
	--cpr-panel: #FFFFFF;
	--cpr-panel-2: #F8F2E7;
	--cpr-linea: rgba(27, 20, 16, 0.16);
	--cpr-linea-fuerte: rgba(27, 20, 16, 0.22);
	--cpr-acento: #9E1B22;
	--cpr-titulo: #1B1410;
	--cpr-texto: #4A4038;
	--cpr-mudo: #665A4C;
	--cpr-grano: rgba(27, 20, 16, 0.05);
	--cpr-tinta: #574593;
}

body {
	background: var(--cpr-fondo);
	-webkit-font-smoothing: antialiased;
}

html, body {
	overflow-x: hidden;
	overflow-x: clip;
	max-width: 100%;
}

.elementor-widget-text-editor p {
	line-height: 1.7;
}

/* ------------------------------------------------- secciones por rol (clases del builder) */

.cpr-dark {
	background-color: var(--cpr-fondo) !important;
}

.cpr-dark-2 {
	background-color: var(--cpr-fondo-2) !important;
}

/* el papel de carnicería es papel en ambos modos: es una pieza, no un tema */
.cpr-paper {
	background-color: var(--cpr-papel) !important;
	background-image:
		repeating-linear-gradient(97deg, rgba(27, 20, 16, 0.035) 0 1px, transparent 1px 7px),
		repeating-linear-gradient(3deg, rgba(27, 20, 16, 0.028) 0 1px, transparent 1px 11px),
		repeating-linear-gradient(41deg, rgba(122, 90, 60, 0.03) 0 2px, transparent 2px 23px);
}

.cpr-red {
	background-color: var(--cpr-rojo) !important;
}

.cpr-grano-bg {
	background-image:
		repeating-linear-gradient(93deg, var(--cpr-grano) 0 1px, transparent 1px 9px),
		repeating-linear-gradient(7deg, var(--cpr-grano) 0 1px, transparent 1px 13px);
}

/* ------------------------------------------------- texto por rol (widgets nativos) */

.cpr-t-titulo .elementor-heading-title, .cpr-t-titulo { color: var(--cpr-titulo) !important; }
.cpr-t-texto .elementor-heading-title, .cpr-t-texto, .cpr-t-texto p { color: var(--cpr-texto) !important; }
.cpr-t-mudo .elementor-heading-title, .cpr-t-mudo, .cpr-t-mudo p { color: var(--cpr-mudo) !important; }
.cpr-t-acento .elementor-heading-title, .cpr-t-acento { color: var(--cpr-acento) !important; }
.cpr-t-rojo2 .elementor-heading-title, .cpr-t-rojo2 { color: var(--cpr-rojo-2) !important; }

html[data-tema="claro"] .cpr-t-rojo2 .elementor-heading-title,
html[data-tema="claro"] .cpr-t-rojo2 { color: var(--cpr-rojo) !important; }

/* dentro de las secciones papel el rol de color es fijo */
.cpr-paper .cpr-t-titulo .elementor-heading-title { color: var(--cpr-papel-tinta) !important; }
.cpr-paper .cpr-t-texto, .cpr-paper .cpr-t-texto p { color: var(--cpr-papel-texto) !important; }
.cpr-paper .cpr-t-acento .elementor-heading-title, .cpr-paper .cpr-t-acento { color: var(--cpr-rojo) !important; }

/* líneas divisorias tokenizadas */
.cpr-borde-top { border-top: 1px solid var(--cpr-linea); }

/* ------------------------------------------------- header propio */

.cpr-header {
	background-color: var(--cpr-fondo) !important;
	border-bottom: 1px solid var(--cpr-linea);
}

/* Las tres columnas traen distinta altura de contenido (logo 72px, menú 70px,
   grupo derecho 46px). Sin centrarlas explícitamente, Elementor las alinea al
   tope y el logo cuelga ~13px por debajo del eje del menú y del CTA. */
.cpr-header > .elementor-container { align-items: center; }
.cpr-header .elementor-column > .elementor-widget-wrap {
	align-content: center;
	align-items: center;
}
.cpr-header .elementor-widget-wrap > .elementor-widget { margin-bottom: 0; }

.cpr-header .jkit-menu > li > a,
.cpr-header .jkit-menu-wrapper .jkit-menu li a {
	font-family: var(--cpr-display) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	color: var(--cpr-titulo) !important;
}

.cpr-header .jkit-menu > li.current-menu-item > a,
.cpr-header .jkit-menu > li > a:hover {
	color: var(--cpr-acento) !important;
}

/* logo dual: blanco en dark, color en claro */
.cpr-logo-oscuro { display: block; }
.cpr-logo-claro { display: none; }
html[data-tema="claro"] .cpr-logo-claro { display: block; }
html[data-tema="claro"] .cpr-logo-oscuro { display: none; }

/* hamburguesa del jkit en ambos temas */
.cpr-header .jkit-hamburger-menu { color: var(--cpr-titulo) !important; }
.cpr-header .jkit-menu-wrapper { background: var(--cpr-fondo) !important; }

/* En móvil el header es UNA fila: logo · hamburguesa · toggle · CTA.
   Sin esto las tres columnas de Elementor se apilan y el header mide 3 alturas. */
@media (max-width: 1024px) {
	.cpr-header .elementor-container {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 10px;
		padding: 0 16px;
	}

	.cpr-header .elementor-column {
		width: auto !important;
		flex: 0 0 auto !important;
	}

	.cpr-header .cpr-logo-oscuro,
	.cpr-header .cpr-logo-claro { height: 50px !important; }

	.cpr-header a[href="#cotizar"] {
		padding: 10px 14px !important;
		font-size: 11px !important;
		letter-spacing: 0.1em !important;
	}

	/* el menú desplegable del jkit ocupa el ancho completo bajo el header */
	.cpr-header .jkit-menu-wrapper { padding: 12px 18px; }
}

/* En pantallas chicas el protagonista es COTIZAR: el toggle pasa a mini (solo
   el ícono del modo al que cambiarías), sin píldora ni borde. */
@media (max-width: 520px) {
	.cpr-header a[href="#cotizar"] {
		display: inline-block !important;
		padding: 9px 12px !important;
		font-size: 10.5px !important;
		letter-spacing: 0.08em !important;
	}

	.cpr-header .cpr-logo-oscuro, .cpr-header .cpr-logo-claro { height: 46px !important; }
}

/* toggle sol/luna: discreto — un solo ícono de 18px que muestra el modo al que
   cambiarías; nunca compite con el CTA */
.cpr-toggle {
	background: transparent !important;
	display: inline-flex;
	align-items: center;
	border: none !important;
	box-shadow: none !important;
	padding: 6px !important;
	cursor: pointer;
	opacity: 0.75;
	transition: opacity .15s;
}

.cpr-toggle:hover { opacity: 1; }
.cpr-toggle svg { display: block; width: 18px; height: 18px; }
.cpr-toggle .cpr-sol { display: none; }
.cpr-toggle .cpr-luna { display: block; }
html[data-tema="claro"] .cpr-toggle .cpr-sol { display: block; }
html[data-tema="claro"] .cpr-toggle .cpr-luna { display: none; }
.cpr-toggle .cpr-sol circle, .cpr-toggle .cpr-sol path,
.cpr-toggle .cpr-luna path { stroke: var(--cpr-titulo); }

/* ------------------------------------------------- footer */

.cpr-footer {
	background-color: var(--cpr-fondo-2) !important;
	border-top: 1px solid var(--cpr-linea);
}

.cpr-footer, .cpr-footer p, .cpr-footer .elementor-icon-list-text { color: var(--cpr-texto); }
.cpr-footer a { color: var(--cpr-titulo); }
.cpr-footer a:hover { color: var(--cpr-acento); }

/* ------------------------------------------------- formulario en modo claro */

html[data-tema="claro"] .cpl {
	--carbon: #FFFFFF !important;
	--panel: #F8F2E7 !important;
	--linea: rgba(27, 20, 16, 0.16) !important;
	--rojosel: #9E1B22 !important;
	--acento: #9E1B22 !important;
	--hueso: #1B1410 !important;
	--suave: #5F5348 !important;
	--mudo: #7A6B5B !important;
	/* el hover de los tiles heredaba el carbón del tema oscuro: dejaba texto
	   oscuro sobre fondo oscuro (1.1:1) en el único tile bajo el cursor */
	--hover: #EDE3D2 !important;
	box-shadow: 0 24px 60px rgba(27, 20, 16, 0.14) !important;
}

.cpl { max-width: 100%; }

.cpl .cpl__tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 600px) {
	.cpl .cpl__tiles { grid-template-columns: 1fr; }
}

/* ------------------------------------------------- botones jkit (sistema único) */

.jkit-button .jkit-button-wrapper { border-radius: 2px !important; }

@media (max-width: 767px) {
	.elementor-widget-jkit_button.elementor-widget__width-auto,
	.elementor-widget-jkit_button { width: 100% !important; max-width: 100% !important; }
	.elementor-widget-jkit_button .jkit-button,
	.elementor-widget-jkit_button .jkit-button-wrapper {
		display: flex; width: 100%; justify-content: center; text-align: center; box-sizing: border-box;
	}
	.elementor-widget-jkit_button + .elementor-widget-jkit_button { margin-top: 12px; }
	.elementor-section.elementor-top-section { padding-left: 0; padding-right: 0; }
}

/* ------------------------------------------------- accesibilidad */

a:focus-visible, button:focus-visible, .jkit-button a:focus-visible {
	outline: 3px solid var(--cpr-rojo-2);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}
}


/* ------------------------------------------------- artículo: una página del sitio

   El artículo se servía como una hoja de papel de 780px flotando sobre el fondo:
   leía como una pieza ajena al sitio. Ahora sigue la misma gramática que el
   resto de las páginas — hero oscuro con eyebrow, bandas a ancho completo y el
   mismo cierre rojo — y el tema sólo aporta el contenedor. */

body.single-post .site-main,
body.single-post main.site-main {
	max-width: none;
	margin: 0;
	padding: 0;
	background: transparent;
	color: var(--cpr-texto);
	box-shadow: none;
}

/* el tema imprime su propio título y meta antes del contenido */
body.single-post .page-header,
body.single-post .entry-header,
body.single-post .post-thumbnail { display: none; }

/* las bandas rompen el contenedor para ocupar el ancho de la ventana */
.cpr-art__hero,
.cpr-art__cta {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	width: 100vw;
}

.cpr-art__hero {
	background-color: var(--cpr-fondo);
	background-image:
		repeating-linear-gradient(93deg, var(--cpr-grano) 0 1px, transparent 1px 9px),
		repeating-linear-gradient(7deg, var(--cpr-grano) 0 1px, transparent 1px 13px);
	border-bottom: 1px solid var(--cpr-linea);
	padding: 72px 0 64px;
}

.cpr-art__wrap { max-width: 1140px; margin: 0 auto; padding: 0 24px; }

.cpr-art__meta {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.cpr-art__hero a.cpr-art__cat,
.cpr-art__cat {
	background: var(--cpr-rojo);
	color: #FFFFFF;
	font-family: var(--cpr-dato);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	padding: 7px 15px;
	text-decoration: none;
}

.cpr-art__hero a.cpr-art__cat:hover { background: var(--cpr-rojo-2); color: #FFFFFF; }

.cpr-art__fecha {
	font-family: var(--cpr-dato);
	font-weight: 500;
	font-size: 12px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--cpr-mudo);
}

.cpr-art__hero h1 {
	font-family: var(--cpr-display);
	font-size: clamp(2.1rem, 5.2vw, 3.6rem);
	font-weight: 400;
	line-height: 0.96;
	text-transform: uppercase;
	color: var(--cpr-titulo);
	margin: 0;
	text-wrap: balance;
}

/* foto de apertura con el marco desplazado del sistema */
.cpr-art__foto {
	position: relative;
	max-width: 1140px;
	margin: 56px auto 0;
	padding: 0 24px;
}

.cpr-art__foto img {
	position: relative;
	width: 100%;
	height: 420px;
	object-fit: cover;
	display: block;
}

.cpr-art__foto::before {
	content: "";
	position: absolute;
	top: 22px;
	left: 46px;
	right: 2px;
	bottom: -22px;
	border: 2px solid var(--cpr-rojo);
}


/* dos columnas: el artículo y la columna de sugeridos que lo hace navegable */
.cpr-art__cols {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 56px;
	max-width: 1140px;
	margin: 0 auto;
	padding: 56px 24px 0;
	align-items: start;
}

.cpr-art__aside { position: sticky; top: 24px; }

.cpr-art__caja {
	background: var(--cpr-panel);
	border: 1px solid var(--cpr-linea-fuerte);
	padding: 24px 22px;
}

.cpr-art__caja + .cpr-art__caja { margin-top: 18px; }

.cpr-art__caja h2 {
	font-family: var(--cpr-dato);
	font-weight: 500;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cpr-rojo-2);
	margin: 0 0 16px;
	padding: 0;
	border: 0;
}

.cpr-art__sug {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	padding: 14px 0;
	border-top: 1px solid var(--cpr-linea);
	text-decoration: none;
}

.cpr-art__sug:first-of-type { border-top: 0; padding-top: 0; }

/* el kit subraya cualquier <a>: los sugeridos son tarjetas, no enlaces de texto */
.cpr-art__cols a.cpr-art__sug,
.cpr-art__cols a.cpr-art__sug span,
.cpr-art__cols a.cpr-art__asidebtn { text-decoration: none; }

.cpr-art__sug img {
	width: 68px;
	height: 68px;
	object-fit: cover;
	flex: none;
	display: block;
}

.cpr-art__sug span {
	font-family: var(--cpr-display);
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.25;
	text-transform: uppercase;
	color: var(--cpr-titulo);
	transition: color 0.15s;
}

.cpr-art__sug:hover span { color: var(--cpr-acento); }

.cpr-art__caja--cta { background: var(--cpr-rojo); border-color: var(--cpr-rojo); }
.cpr-art__caja--cta h2 { color: rgba(255, 255, 255, 0.75); }

.cpr-art__caja--cta p {
	font-family: var(--cpr-cuerpo);
	font-size: 15px;
	font-weight: 300;
	line-height: 1.6;
	color: #FFFFFF;
	margin: 0 0 16px;
}

.cpr-art__cols a.cpr-art__asidebtn {
	display: block;
	background: #120D0A;
	color: #F3EBDD;
	font-family: var(--cpr-display);
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-align: center;
	padding: 14px 18px;
	text-decoration: none;
}

.cpr-art__cols a.cpr-art__asidebtn:hover { background: #1B1410; color: #FFFFFF; }

@media (max-width: 900px) {
	.cpr-art__cols { grid-template-columns: 1fr; gap: 40px; padding: 40px 20px 0; }
	.cpr-art__aside { position: static; }
}

/* cuerpo del artículo */
.cpr-art__cuerpo {
	min-width: 0;
}

.cpr-art__cuerpo p,
.cpr-art__cuerpo li {
	font-family: var(--cpr-cuerpo);
	font-size: 18px;
	font-weight: 300;
	line-height: 1.78;
	color: var(--cpr-texto);
}

.cpr-art__cuerpo p { margin: 0 0 20px; }

.cpr-art__cuerpo h2,
.cpr-art__cuerpo h3 {
	font-family: var(--cpr-display);
	font-weight: 600;
	text-transform: uppercase;
	line-height: 1.15;
	color: var(--cpr-titulo);
	border-left: 3px solid var(--cpr-rojo-2);
	padding-left: 16px;
	margin: 44px 0 14px;
}

.cpr-art__cuerpo h2 { font-size: 1.65rem; }
.cpr-art__cuerpo h3 { font-size: 1.3rem; }

.cpr-art__cuerpo strong, .cpr-art__cuerpo b { color: var(--cpr-titulo); font-weight: 500; }
.cpr-art__cuerpo em { color: var(--cpr-texto); }
.cpr-art__cuerpo a { color: var(--cpr-acento); }
.cpr-art__cuerpo ul { padding-left: 22px; margin: 0 0 22px; }
.cpr-art__cuerpo li { margin-bottom: 10px; }
.cpr-art__cuerpo li::marker { color: var(--cpr-rojo-2); }
.cpr-art__cuerpo img { max-width: 100%; height: auto; }

/* el párrafo de cierre en cursiva es la bajada comercial del artículo */
.cpr-art__cuerpo > p:last-child em {
	display: block;
	border-left: 3px solid var(--cpr-rojo-2);
	padding-left: 18px;
	font-style: normal;
	color: var(--cpr-titulo);
}

/* cierre rojo, el mismo de todas las páginas */
.cpr-art__cta {
	background: var(--cpr-rojo);
	margin-top: 64px;
	padding: 60px 0;
}

.cpr-art__cta .cpr-art__wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 26px;
	flex-wrap: wrap;
}

.cpr-art__cta-tit {
	font-family: var(--cpr-display);
	font-size: clamp(1.6rem, 3.6vw, 2.6rem);
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.1;
	color: #FFFFFF;
	margin: 0;
}

.cpr-art__cta a {
	background: #120D0A;
	color: #F3EBDD;
	font-family: var(--cpr-display);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	padding: 19px 40px;
	text-decoration: none;
	white-space: nowrap;
}

.cpr-art__cta a:hover { background: #1B1410; color: #FFFFFF; }

/* pie del artículo: navegación y relacionados */
.cpr-art__pie {
	max-width: 1140px;
	margin: 0 auto;
	padding: 56px 24px 88px;
}

@media (max-width: 767px) {
	.cpr-art__hero { padding: 48px 0 44px; }
	.cpr-art__wrap { padding: 0 20px; }
	.cpr-art__foto { margin-top: 36px; padding: 0 20px; }
	.cpr-art__foto img { height: 240px; }
	.cpr-art__foto::before { top: 12px; left: 32px; bottom: -12px; }
	.cpr-art__cuerpo { padding: 40px 20px 0; }
	.cpr-art__cuerpo p, .cpr-art__cuerpo li { font-size: 16.5px; }
	.cpr-art__cuerpo h2 { font-size: 1.35rem; margin-top: 34px; }
	.cpr-art__cta { padding: 44px 0; margin-top: 48px; }
	.cpr-art__pie { padding: 44px 20px 64px; }
}

/* el archive nativo (categorías, fechas) hereda el mismo tratamiento */
body.archive .site-main, body.blog .site-main {
	max-width: 900px; margin: 48px auto; background: var(--cpr-papel);
	color: var(--cpr-papel-texto); padding: 48px;
}

/* ------------------------------------------------- blog: grid de la página */

.cpr-blog-grid .jkit-post-title,
.cpr-blog-grid .jkit-post-title a { font-family: var(--cpr-display) !important; text-transform: uppercase; color: #F3EBDD !important; }
.cpr-blog-grid .jkit-post-title a:hover { color: #E0736B !important; }
.cpr-blog-grid .jkit-post-excerpt, .cpr-blog-grid .jkit-post-excerpt p { color: #B5A48F !important; font-family: var(--cpr-cuerpo); }
.cpr-blog-grid .jkit-post-meta, .cpr-blog-grid .jkit-post-meta a, .cpr-blog-grid .jkit-meta { color: #8A7A66 !important; }
.cpr-blog-grid .jkit-postblock-content, .cpr-blog-grid .jkit-post-content {
	background: #191310 !important; border: 1px solid #3A2E24;
}
.cpr-blog-grid article, .cpr-blog-grid .jkit-post { background: transparent; }
.cpr-blog-grid .jkit-readmore, .cpr-blog-grid .jkit-post-readmore a, .cpr-blog-grid .jkit-readmore a {
	font-family: var(--cpr-display) !important; letter-spacing: 0.14em; text-transform: uppercase; color: #C22F28 !important;
}


/* blog corporativo: sin comentarios */
.comments-area, #comments, .comment-respond { display: none !important; }


/* ------------------------------------------------- barra de acción móvil

   En móvil el header no queda fijo: pasado el hero, el visitante recorre 6-7
   pantallas sin ningún acceso a cotizar salvo la burbuja de WhatsApp. La barra
   aparece al dejar atrás el hero y ofrece las dos rutas del funnel: cotizar
   (formulario) y pedir la lista de la semana.

   Mide menos de 92px: es la altura que el FAB de WhatsApp asume al subir con
   `body.has-sticky-cta` (regla propia del plugin mm-wa-attribution). */

.cpr-sticky {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9990;
	display: none;
	gap: 10px;
	padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
	background: rgba(13, 10, 8, 0.94);
	border-top: 1px solid rgba(243, 235, 221, 0.16);
	backdrop-filter: blur(10px);
	transform: translateY(100%);
	transition: transform 0.24s ease;
}

html[data-tema="claro"] .cpr-sticky {
	background: rgba(244, 236, 223, 0.95);
	border-top-color: rgba(27, 20, 16, 0.18);
}

.cpr-sticky.is-on { transform: translateY(0); }

.cpr-sticky a {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 12px 10px;
	font-family: var(--cpr-display);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	text-align: center;
	line-height: 1.15;
	border-radius: 2px;
}

.cpr-sticky .cpr-sticky__cotiza { background: #9E1B22; color: #FFFFFF; flex: 1.15; }
.cpr-sticky .cpr-sticky__lista {
	background: transparent;
	color: var(--cpr-titulo);
	border: 1px solid var(--cpr-linea-fuerte);
}

/* La burbuja de WhatsApp vive abajo a la derecha: se le cede el espacio. */
body.has-sticky-cta .cpr-sticky { padding-right: 78px; }

@media (max-width: 900px) {
	.cpr-sticky { display: flex; }
}

/* Con el modal abierto el fondo queda fijo: la barra sobraría sobre el diálogo. */
body.cpl-modal-abierto .cpr-sticky { transform: translateY(100%); }


/* ------------------------------------------------- preguntas frecuentes

   <details>/<summary> nativo: accesible por teclado y sin depender de JS.
   El marcador propio reemplaza el triángulo del navegador. */

.cpr-faq { border-top: 1px solid var(--cpr-linea); }

.cpr-faq details {
	border-bottom: 1px solid var(--cpr-linea);
	padding: 0;
}

.cpr-faq summary {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	padding: 22px 0;
	cursor: pointer;
	list-style: none;
	font-family: var(--cpr-display);
	font-size: 19px;
	font-weight: 500;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--cpr-titulo);
	transition: color 0.15s;
}

.cpr-faq summary::-webkit-details-marker { display: none; }
.cpr-faq summary:hover { color: var(--cpr-acento); }

.cpr-faq summary::after {
	content: "+";
	flex: none;
	font-size: 26px;
	font-weight: 300;
	line-height: 0.9;
	color: var(--cpr-rojo-2);
	transition: transform 0.2s ease;
}

.cpr-faq details[open] summary::after { transform: rotate(45deg); }

.cpr-faq .cpr-faq__r {
	padding: 0 0 24px;
	max-width: 68ch;
	font-family: var(--cpr-cuerpo);
	font-size: 16.5px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cpr-texto);
}

.cpr-faq .cpr-faq__r a { color: var(--cpr-acento); text-decoration: underline; }
.cpr-faq .cpr-faq__r b { color: var(--cpr-titulo); font-weight: 500; }

@media (max-width: 767px) {
	.cpr-faq summary { font-size: 16.5px; padding: 18px 0; }
	.cpr-faq .cpr-faq__r { font-size: 15.5px; padding-bottom: 20px; }
}


/* ------------------------------------------------- correcciones post-auditoría

   1. El kit define `.elementor-kit-5 a { color:#A6231F }` con especificidad
   (0,1,1), que pisa el color declarado en las clases de una sola clase de las
   tarjetas. Resultado: los CTA salían rojos — sobre la celda roja de Pollo
   quedaban en 1.6:1, ilegibles. Se sube la especificidad en vez de recurrir a
   !important para que el hover siga funcionando. */

.cpr-celda a.cpr-cotizar,
.cpr-grid a.cpr-cotizar { color: #F3EBDD; }
.cpr-celda a.cpr-cotizar:hover,
.cpr-grid a.cpr-cotizar:hover { color: #FFFFFF; }

.cpr-celda a.cpr-cotizar-blanco,
.cpr-grid a.cpr-cotizar-blanco { color: #FFFFFF; }
.cpr-celda a.cpr-cotizar-blanco:hover,
.cpr-grid a.cpr-cotizar-blanco:hover { color: #9E1B22; }

/* 2. La barra fija tapaba el remate legal del footer: el documento terminaba
   justo donde empieza la barra y "Política de privacidad" quedaba detrás, sin
   scroll posible para revelarlo. El colchón es permanente bajo 900px para que
   el contenido no salte cuando la barra entra. */
@media (max-width: 900px) {
	body { padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)); }
}

/* 3. La reserva a la derecha era para la burbuja de WhatsApp, pero con la barra
   activa la burbuja sube por encima: sólo dejaba un 20% del ancho vacío. */
body.has-sticky-cta .cpr-sticky { padding-right: 14px; }

/* 4. Los CTA alineados a la derecha en layouts de dos columnas quedaban
   flotando al centro-derecha cuando la columna colapsa en móvil. */
.cpr-cta-der { text-align: right; }
@media (max-width: 767px) { .cpr-cta-der { text-align: left; } }

/* 5. El panel del menú móvil medía 360px de ancho y 844 de alto arrancando en
   y=-20: dejaba una franja viva de la página a la derecha y otra abajo, con el
   borde del botón COTIZA asomando. */
@media (max-width: 1024px) {
	/* `inset` en lugar de alto calculado, y sin el margen negativo del kit
	   (margin-top:-20px), que corría el panel entero hacia arriba y dejaba una
	   banda viva de la página al pie.

	   El cierre se hace con transform, NO soltando la posición: el kit cerraba
	   desplazando el panel con `left`, y al fijarlo con inset dejaba de poder
	   sacarlo de pantalla — el menú se quedaba abierto para siempre. */
	.cpr-header .jkit-menu-wrapper {
		inset: 0 !important;
		margin: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		overflow-y: auto !important;
		transform: translateX(-100%);
		transition: transform 0.28s ease, visibility 0.28s;
		visibility: hidden;
	}

	.cpr-header .jkit-menu-wrapper.active {
		transform: translateX(0);
		visibility: visible;
	}

	/* El logo del panel lo fija el widget del kit (una sola imagen, la blanca):
	   sobre el papel del modo claro quedaba invisible. */
	html[data-tema="claro"] .cpr-header .jkit-menu-wrapper img {
		content: url("https://coprocar.cl/wp-content/uploads/2026/08/coprocar-logo-color.png");
	}

	/* Con el menú abierto la barra fija no tiene por qué seguir encima. */
	body:has(.jkit-menu-wrapper.active) .cpr-sticky { transform: translateY(100%); }
}


/* ------------------------------------------------- footer en móvil

   Al apilarse las cuatro columnas, el bloque de contacto —el que trae el
   teléfono y el botón de cotizar— quedaba al final de todo. En móvil sube
   justo debajo de la marca, antes de los listados de navegación. */

@media (max-width: 600px) {
	.cpr-fgrid > div:nth-child(1) { order: 1; }
	.cpr-fgrid > div:nth-child(4) { order: 2; }   /* contacto + CTA */
	.cpr-fgrid > div:nth-child(2) { order: 3; }   /* navegación */
	.cpr-fgrid > div:nth-child(3) { order: 4; }   /* líneas */
}


/* ------------------------------------------------- páginas de texto largo

   Política de privacidad y artículos del blog: el tema servía el contenido a
   todo el ancho del contenedor (1140px), muy por encima del largo de línea
   legible, y con colores propios en vez de los del sistema. */

.cpr-texto-legal {
	max-width: 780px;
	margin: 0 auto;
	padding: 64px 24px 88px;
}

.cpr-texto-legal h1 {
	font-family: var(--cpr-display);
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.05;
	color: var(--cpr-titulo);
	margin: 0 0 10px;
	text-wrap: balance;
}

.cpr-texto-legal .cpr-legal__sub {
	border-left: 3px solid var(--cpr-rojo-2);
	padding-left: 18px;
	margin-bottom: 40px;
	font-family: var(--cpr-cuerpo);
	font-size: 16.5px;
	font-weight: 300;
	line-height: 1.65;
	color: var(--cpr-texto);
}

.cpr-texto-legal h2 {
	font-family: var(--cpr-display);
	font-size: 1.5rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	color: var(--cpr-titulo);
	margin: 40px 0 12px;
	padding-top: 24px;
	border-top: 1px solid var(--cpr-linea);
}

.cpr-texto-legal p,
.cpr-texto-legal li {
	font-family: var(--cpr-cuerpo);
	font-size: 17px;
	font-weight: 300;
	line-height: 1.75;
	color: var(--cpr-texto);
}

.cpr-texto-legal strong, .cpr-texto-legal b { color: var(--cpr-titulo); font-weight: 500; }
.cpr-texto-legal a { color: var(--cpr-acento); }
.cpr-texto-legal li::marker { color: var(--cpr-rojo-2); }
.cpr-texto-legal ul { padding-left: 20px; }

@media (max-width: 767px) {
	.cpr-texto-legal { padding: 40px 20px 64px; }
	.cpr-texto-legal h2 { font-size: 1.25rem; margin-top: 30px; }
}


/* ------------------------------------------------- artículo del blog */

/* foto de apertura: la misma imagen que anuncia el artículo en el listado */
.cpr-post__foto {
	position: relative;
	margin: 0 0 34px;
}

.cpr-post__foto img {
	width: 100%;
	height: 380px;
	object-fit: cover;
	display: block;
}


/* navegación entre artículos */
.cpr-post__nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
	margin-top: 40px;
	padding-top: 28px;
	border-top: 1px solid var(--cpr-linea);
}

.cpr-post__nav a {
	display: block;
	padding: 20px 22px;
	background: var(--cpr-panel);
	border: 1px solid var(--cpr-linea-fuerte);
	text-decoration: none;
	transition: border-color 0.18s, transform 0.18s;
}

.cpr-post__nav a:hover { border-color: var(--cpr-rojo); transform: translateY(-2px); }
.cpr-post__nav a.cpr-post__nav--sig { text-align: right; }

.cpr-post__nav .cpr-post__navetq {
	display: block;
	font-family: var(--cpr-dato);
	font-weight: 500;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cpr-rojo-2);
	margin-bottom: 8px;
}

.cpr-post__nav .cpr-post__navtit {
	font-family: var(--cpr-display);
	font-size: 17px;
	font-weight: 500;
	line-height: 1.25;
	text-transform: uppercase;
	color: var(--cpr-titulo);
}

/* artículos relacionados con imagen */
.cpr-post__rel {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
	margin-top: 16px;
}

.cpr-post__rel a {
	display: block;
	text-decoration: none;
	background: var(--cpr-panel);
	border: 1px solid var(--cpr-linea-fuerte);
	overflow: hidden;
	transition: border-color 0.18s, transform 0.18s;
}

.cpr-post__rel a:hover { border-color: var(--cpr-rojo); transform: translateY(-2px); }
.cpr-post__rel img { width: 100%; height: 150px; object-fit: cover; display: block; }
.cpr-post__rel .cpr-post__reltit {
	display: block;
	padding: 16px 18px 18px;
	font-family: var(--cpr-display);
	font-size: 17px;
	font-weight: 500;
	line-height: 1.25;
	text-transform: uppercase;
	color: var(--cpr-titulo);
}

@media (max-width: 600px) {
	.cpr-post__foto img { height: 240px; }
	.cpr-post__nav, .cpr-post__rel { grid-template-columns: 1fr; }
	.cpr-post__nav a.cpr-post__nav--sig { text-align: left; }
}


/* ------------------------------------------------- registro de dato

   Datos y rótulos que seguían hablando en la voz de los títulos. */

.cpr-tel {
	font-family: var(--cpr-dato) !important;
	font-weight: 500 !important;
	letter-spacing: 0.06em !important;
}

/* Las preguntas frecuentes salen de la caja alta, igual que los h2 de sección */
.cpr-faq summary { text-transform: none; letter-spacing: 0; font-size: 21px; }
@media (max-width: 767px) { .cpr-faq summary { font-size: 17.5px; } }


/* ------------------------------------------------- legibilidad del cuerpo

   El texto de lectura estaba en peso 300 y en tamaños de 15-16px. El contraste
   ya cumplía de sobra (7,97:1), así que lo que costaba no era el color sino el
   grosor y el cuerpo de la letra: en pantalla y pasados los 40, una Light chica
   obliga a acercarse o a hacer zoom. El texto corrido sube a 400 y se fija un
   piso de tamaño; los títulos y las etiquetas no se tocan. */

.elementor-widget-text-editor p,
.cpr-puerta__txt, .cpr-pack__txt, .cpr-cond__nota, .cpr-card__resumen,
.cpr-faq .cpr-faq__r, .cpr-texto-legal p, .cpr-texto-legal li,
.cpr-art__cuerpo p, .cpr-art__cuerpo li,
body.single-post .site-main p, body.single-post .site-main li {
	font-weight: 400 !important;
	letter-spacing: 0.004em;
}

/* piso de tamaño para el texto que se lee de corrido */
.elementor-widget-text-editor p { font-size: 19px !important; line-height: 1.72 !important; }
.cpr-puerta__txt, .cpr-pack__txt { font-size: 16.5px !important; line-height: 1.62 !important; }
.cpr-cond__nota { font-size: 16.5px !important; line-height: 1.6 !important; }
.cpr-card__resumen { font-size: 16.5px !important; line-height: 1.62 !important; }
.cpr-faq .cpr-faq__r { font-size: 17.5px !important; line-height: 1.72 !important; }
.cpr-art__cuerpo p, .cpr-art__cuerpo li { font-size: 18.5px; line-height: 1.78; }
.cpr-texto-legal p, .cpr-texto-legal li { font-size: 17.5px; line-height: 1.78; }

/* en móvil el cuerpo no baja de 16.5px */
@media (max-width: 767px) {
	.elementor-widget-text-editor p { font-size: 17.5px; }
	.cpr-puerta__txt, .cpr-pack__txt, .cpr-cond__nota, .cpr-card__resumen { font-size: 16.5px; }
	.cpr-art__cuerpo p, .cpr-art__cuerpo li { font-size: 17.5px; }
}


/* ------------------------------------------------- presencia del logotipo

   El logotipo ocupaba 72px dentro de una banda de 117px y quedaba chico para lo
   que la marca pesa. Sube a 92px y la banda se ajusta para que lo enmarque sin
   apretarlo: la marca pasa a ser el elemento dominante del encabezado. */

.cpr-header .cpr-logo-oscuro,
.cpr-header .cpr-logo-claro { height: 92px !important; width: auto; }
.cpr-header > .elementor-container { min-height: 116px; }

@media (max-width: 1024px) {
	.cpr-header .cpr-logo-oscuro,
	.cpr-header .cpr-logo-claro { height: 62px !important; }
}

@media (max-width: 520px) {
	.cpr-header .cpr-logo-oscuro,
	.cpr-header .cpr-logo-claro { height: 54px !important; }
}

/* el logotipo del pie acompaña la misma jerarquía */
.cpr-footer .cpr-logo-oscuro,
.cpr-footer .cpr-logo-claro { height: 78px !important; width: auto; }


/* Texto suelto dentro de las piezas HTML: mismo criterio de lectura. */
.cpr-dark [style*="var(--cpr-cuerpo)"],
.cpr-paper [style*="var(--cpr-cuerpo)"],
.cpr-footer [style*="var(--cpr-cuerpo)"] { font-weight: 400 !important; }
.cpr-pizarra { font-size: 17px !important; }
.cpr-fgrid a, .cpr-fgrid div { font-weight: 400 !important; }


/* ------------------------------------------------- guía de cortes

   Material de apoyo pedido por el cliente: el comprador no siempre sabe qué
   pedir, y saber para qué sirve cada corte es lo que destraba la decisión.
   Se lee como ficha técnica, no como tarjeta de catálogo. */

.cpr-guia { max-width: 1140px; margin: 0 auto; padding: 0 24px; }

.cpr-guia__linea { padding: 56px 0; border-top: 1px solid var(--cpr-linea); }
.cpr-guia__linea:first-child { border-top: 0; padding-top: 24px; }

.cpr-guia__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 30px;
}

.cpr-guia__head h2 {
	font-family: var(--cpr-display);
	font-size: clamp(1.9rem, 4vw, 2.8rem);
	font-weight: 400;
	line-height: 1;
	color: var(--cpr-titulo);
	margin: 0;
}

.cpr-guia a.cpr-guia__cta {
	font-family: var(--cpr-dato);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--cpr-titulo);
	text-decoration: none;
	border-bottom: 2px solid var(--cpr-rojo-2);
	padding-bottom: 5px;
	white-space: nowrap;
}

.cpr-guia a.cpr-guia__cta:hover { color: var(--cpr-acento); }

.cpr-guia__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	background: var(--cpr-linea-fuerte);
	border: 1px solid var(--cpr-linea-fuerte);
}

.cpr-guia__corte { background: var(--cpr-fondo); padding: 26px 24px 24px; }

.cpr-guia__corte h3 {
	font-family: var(--cpr-display);
	font-size: 21px;
	font-weight: 400;
	line-height: 1.1;
	color: var(--cpr-titulo);
	margin: 0 0 12px;
	padding: 0;
	border: 0;
}

.cpr-guia__def {
	font-family: var(--cpr-cuerpo);
	font-size: 16.5px !important;
	font-weight: 400 !important;
	line-height: 1.62;
	color: var(--cpr-texto);
	margin: 0 0 16px;
}

.cpr-guia__usos {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	padding: 0;
	margin: 0 0 14px;
}

.cpr-guia__usos li {
	font-family: var(--cpr-dato);
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cpr-acento);
	border: 1px solid var(--cpr-linea-fuerte);
	padding: 5px 11px;
}

.cpr-guia__tip {
	font-family: var(--cpr-cuerpo);
	font-size: 15.5px !important;
	font-weight: 400 !important;
	line-height: 1.6;
	color: var(--cpr-mudo);
	border-left: 2px solid var(--cpr-rojo);
	padding-left: 13px;
	margin: 0;
}

@media (max-width: 1024px) { .cpr-guia__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) {
	.cpr-guia { padding: 0 20px; }
	.cpr-guia__grid { grid-template-columns: 1fr; }
	.cpr-guia__linea { padding: 40px 0; }
}

/* encabezado propio de la guía */
.cpr-guia__hero {
	background-color: var(--cpr-fondo);
	background-image:
		repeating-linear-gradient(93deg, var(--cpr-grano) 0 1px, transparent 1px 9px),
		repeating-linear-gradient(7deg, var(--cpr-grano) 0 1px, transparent 1px 13px);
	border-bottom: 1px solid var(--cpr-linea);
	padding: 72px 0 60px;
}

.cpr-guia__herowrap { max-width: 1140px; margin: 0 auto; padding: 0 24px; }

.cpr-guia__etq {
	font-family: var(--cpr-dato);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cpr-acento);
	margin-bottom: 18px;
}

.cpr-guia__hero h1 {
	font-family: var(--cpr-display);
	font-size: clamp(2.4rem, 6vw, 4.2rem);
	font-weight: 400;
	line-height: 0.96;
	text-transform: uppercase;
	color: var(--cpr-titulo);
	margin: 0 0 20px;
}

.cpr-guia__hero p {
	font-family: var(--cpr-cuerpo);
	font-size: 18.5px !important;
	font-weight: 400 !important;
	line-height: 1.7;
	color: var(--cpr-texto);
	max-width: 62ch;
	margin: 0;
}

.cpr-guia__cierre {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 22px;
	flex-wrap: wrap;
	border-top: 1px solid var(--cpr-linea);
	margin-top: 8px;
	padding: 44px 0 88px;
}

.cpr-guia__cierre p {
	font-family: var(--cpr-cuerpo);
	font-size: 18px !important;
	font-weight: 400 !important;
	color: var(--cpr-titulo);
	margin: 0;
}

.cpr-guia .cpr-guia__cierre a {
	background: var(--cpr-rojo);
	color: #FFFFFF;
	font-family: var(--cpr-dato);
	font-size: 13.5px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 17px 34px;
	text-decoration: none;
	white-space: nowrap;
}

.cpr-guia .cpr-guia__cierre a:hover { background: var(--cpr-rojo-2); color: #FFFFFF; }

@media (max-width: 767px) {
	.cpr-guia__hero { padding: 48px 0 42px; }
	.cpr-guia__herowrap { padding: 0 20px; }
	.cpr-guia__hero p { font-size: 17px !important; }
	.cpr-guia__cierre { padding: 34px 0 64px; }
}

/* Con seis entradas el menú ya no cabe en una línea a tamaño de cartel. */
@media (min-width: 1025px) {
	.cpr-header .jkit-menu > li > a {
		font-size: 13px !important;
		letter-spacing: 0.09em !important;
		white-space: nowrap;
	}
	.cpr-header .jkit-menu > li { margin: 0 !important; }
	.cpr-header .jkit-menu > li > a { padding: 0 13px !important; }
}