/*
 * PMM Trabajos — estilos de las tarjetas, filtros, bloque destacado y página de cada trabajo.
 * Los colores salen de los colores globales de Elementor (Ajustes del sitio → Colores globales):
 * si cambias allí un color, cambia también aquí. El segundo valor es solo un respaldo.
 */
.pmm-trabajos,
.pmm-rejilla,
.pmm-caso,
.pmm-trabajo {
	--pmm-acero: var(--e-global-color-pmm_acero, #15191E);
	--pmm-naranja: var(--e-global-color-pmm_naranja, #C2501A);
	--pmm-gris: var(--e-global-color-pmm_gris, #5A626B);
	--pmm-borde: var(--e-global-color-pmm_borde, #DADDE0);
	--pmm-blanco: var(--e-global-color-pmm_blanco, #FFFFFF);
	--pmm-titulos: "Barlow Condensed", sans-serif;
	font-family: "Barlow", system-ui, sans-serif;
	color: var(--pmm-acero);
}

/* Filtros */
.pmm-trabajos { display: flex; flex-direction: column; gap: 28px; }
.pmm-filtros { display: flex; flex-wrap: wrap; gap: 16px 32px; align-items: center; justify-content: space-between; }
.pmm-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.pmm-trabajos .pmm-chip {
	font: inherit; font-weight: 600; font-size: 15px; line-height: 1.2;
	padding: 10px 18px; min-height: 44px; cursor: pointer; border-radius: 0;
	text-transform: none; letter-spacing: 0; /* el tema pone los botones en mayúsculas */
	border: 1px solid #B9BEC4; background: var(--pmm-blanco); color: var(--pmm-acero);
}
.pmm-trabajos .pmm-chip:hover { border-color: var(--pmm-acero); }
.pmm-trabajos .pmm-chip[aria-pressed="true"] { background: var(--pmm-acero); border-color: var(--pmm-acero); color: var(--pmm-blanco); }
.pmm-trabajos .pmm-chip:focus-visible { outline: 2px solid var(--pmm-naranja); outline-offset: 2px; }
.pmm-contador, .pmm-vacio { font-size: 15px; color: var(--pmm-gris); margin: 0; }

/* Tarjetas */
.pmm-rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 24px; }
.pmm-rejilla--destacados { grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); }
.pmm-tarjeta { display: flex; flex-direction: column; background: var(--pmm-blanco); border: 1px solid var(--pmm-borde); color: var(--pmm-acero); text-decoration: none; }
.pmm-tarjeta[hidden] { display: none; }
.pmm-tarjeta:hover .pmm-tarjeta__titulo { color: var(--pmm-naranja); }
.pmm-tarjeta__foto { height: 270px; background: #2B3138; overflow: hidden; }
/* Selectores reforzados: el tema y Elementor ponen "height: auto" a las imágenes. */
.pmm-rejilla .pmm-tarjeta .pmm-tarjeta__foto img { width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; }
.pmm-tarjeta__texto { padding: 22px 24px 26px; display: flex; flex-direction: column; gap: 8px; }
.pmm-meta { font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--pmm-gris); }
.pmm-tarjeta__titulo { margin: 0; font-family: var(--pmm-titulos); font-weight: 700; font-size: 27px; line-height: 1.1; color: var(--pmm-acero); }
.pmm-tarjeta__desc { margin: 0; font-size: 16px; line-height: 1.5; color: var(--pmm-gris); }

/* Bloque "Proyecto destacado" */
.pmm-caso { display: flex; flex-wrap: wrap; background: var(--pmm-blanco); border: 1px solid var(--pmm-borde); }
.pmm-caso__fotos { flex: 1 1 560px; min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 4px; }
.pmm-caso__foto { height: 160px; background: #39414A; overflow: hidden; }
.pmm-caso__foto--grande { grid-column: 1 / -1; height: 340px; }
.pmm-caso .pmm-caso__foto img { width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; }
.pmm-caso__fotos--1 { grid-template-columns: 1fr; }
.pmm-caso__fotos--1 .pmm-caso__foto--grande { height: 100%; min-height: 420px; }
.pmm-caso__texto { flex: 1 1 420px; min-width: 0; padding: 40px; display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.pmm-etiqueta { font-size: 13px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--pmm-naranja); }
.pmm-caso__titulo { margin: 0; font-family: var(--pmm-titulos); font-weight: 700; font-size: 40px; line-height: 1.05; color: var(--pmm-acero); }
.pmm-caso__desc { margin: 0; color: var(--pmm-gris); font-size: 17px; line-height: 1.55; }
.pmm-ficha { margin: 0; width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; border-top: 1px solid var(--pmm-borde); padding-top: 20px; }
.pmm-ficha dt { font-size: 13px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--pmm-gris); }
.pmm-ficha dd { margin: 2px 0 0; font-weight: 600; }
.pmm-enlace { font-weight: 600; color: var(--pmm-acero); text-decoration: none; border-bottom: 2px solid var(--pmm-naranja); padding-bottom: 4px; }
.pmm-enlace:hover { color: var(--pmm-naranja); }
@media (max-width: 600px) {
	.pmm-caso__foto--grande, .pmm-caso__fotos--1 .pmm-caso__foto--grande { height: 240px; min-height: 0; }
	.pmm-caso__foto { height: 120px; }
	.pmm-caso__texto { padding: 28px 22px; }
	.pmm-caso__titulo { font-size: 32px; }
}

/* Página de cada trabajo */
.pmm-trabajo { display: flex; flex-direction: column; gap: 32px; }
.pmm-galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr)); gap: 6px; }
.pmm-galeria__foto { display: block; height: 200px; overflow: hidden; background: #2B3138; }
.pmm-galeria__foto--grande { grid-column: 1 / -1; height: auto; max-height: 640px; }
.pmm-trabajo .pmm-galeria__foto img { width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; }
.single-trabajo .entry-title { font-family: "Barlow Condensed", sans-serif; font-weight: 700; text-transform: none; font-size: clamp(34px, 5vw, 52px); line-height: 1.05; color: #15191E; }
.pmm-trabajo__info { display: flex; flex-direction: column; gap: 16px; max-width: 760px; }
.pmm-cta { background: var(--pmm-acero); color: var(--pmm-blanco); padding: 40px; display: flex; flex-wrap: wrap; gap: 24px; align-items: center; justify-content: space-between; }
.pmm-cta h2 { margin: 0 0 6px; font-family: var(--pmm-titulos); font-weight: 700; font-size: 36px; line-height: 1.08; color: var(--pmm-blanco); }
.pmm-cta p { margin: 0; color: #C9CED4; }
.pmm-cta__botones { display: flex; flex-wrap: wrap; gap: 12px; }
.pmm-boton { display: inline-flex; align-items: center; min-height: 44px; padding: 13px 24px; box-sizing: border-box; font-weight: 600; text-decoration: none; background: var(--pmm-naranja); color: var(--pmm-blanco); border: 1px solid var(--pmm-naranja); }
.pmm-boton:hover { filter: brightness(1.1); color: var(--pmm-blanco); }
.pmm-boton--borde { background: transparent; border-color: #5A626B; }

/* Cabecera fija (Elementor Header & Footer Builder no la trae en la versión gratuita). */
body.ehf-header #masthead { position: sticky; top: 0; z-index: 999; }
body.admin-bar.ehf-header #masthead { top: 32px; }
@media (max-width: 782px) { body.admin-bar.ehf-header #masthead { top: 0; } }
/* Que la cabecera fija no tape el título al saltar a una sección (#contacto, #servicios…). */
body.ehf-header .elementor-element[id] { scroll-margin-top: 140px; }
@media (max-width: 767px) { body.ehf-header .elementor-element[id] { scroll-margin-top: 80px; } }
/* Icono del menú del móvil sin el borde que le pone el tema. */
body.ehf-header .hfe-nav-menu__toggle, body.ehf-header .hfe-nav-menu-icon { border: 0 !important; background: transparent !important; }