/*
 * MultiAceros: puente entre el HTML de los bloques de WordPress (wp-block-*) y las clases ma-*
 * del sistema de diseño. Solo lo que bundle.css no cubre por diferencias de estructura.
 *
 * Se carga en las páginas cuyo contenido está en bloques y en el editor (add_editor_style).
 * En el sitio, los filtros de inc/bloques.php ya convierten botones y grupos de botones en el
 * marcado del sistema (ma-boton, ma-enlace, sin envoltorios), y theme.json deja en 0 el espacio
 * entre bloques: el espaciado lo ponen las clases del sistema.
 *
 * Medido en la etapa 3 con la Home (Edge, 1440 px), quitando cada regla del sitio:
 * - Sin 1 (márgenes de <figure>): la foto destacada de cada noticia gana 8 px y la página crece.
 * - Sin 2 (lista de noticias): las tarjetas no se estiran a la fila (274 px en vez de 318).
 * Una regla para Forminator no cambiaba nada y se quitó. El resto de los componentes de la Home
 * se ve igual que el prototipo sin puente, gracias a los filtros de inc/bloques.php.
 *
 * Usa solo var(--…) del sistema.
 */

/* 1. Imagen y foto destacada: los bloques usan <figure>, que trae margen del navegador y del
      CSS del bloque (se imprime después del sistema). */
.ma-sitio-contenido figure:is(.wp-block-image, .wp-block-post-featured-image) {
	margin-block: 0;
	margin-inline: 0;
}

.ma-sitio-contenido figure.ma-tarjeta__medio {
	margin: var(--espacio-2) var(--espacio-2) 0;
}

.ma-sitio-contenido .ma-tarjeta--horizontal figure.ma-tarjeta__medio {
	margin: var(--espacio-2);
}

/* El dibujo de cada perfil conserva el margen del sistema (TablaTecnica), que la regla de arriba
   quitaría; en móvil pasa a la derecha de la cabeza, sin margen. */
.ma-sitio-contenido figure.ma-perfil__foto {
	margin-block: var(--espacio-3);
}

@media (max-width: 734px) {
	.ma-sitio-contenido figure.ma-perfil__foto {
		margin: 0;
	}
}

/* Título de una sección de texto con la norma de su tabla debajo (ma-acero__cabeza, inc/plantilla-b.php:
   «Especificaciones» y «Grado A 36» en Parrillas), con el espacio de la cabeza de un perfil. */
:is(.ma-sitio-contenido, .editor-styles-wrapper) .ma-acero__cabeza {
	display: grid;
	gap: var(--espacio-3);
	justify-items: start;
}

/* Rótulo suelto de los chips (blocks/chips: un ítem «#» de primer nivel sin hijos, como «Perfiles»,
   que encabeza el menú de Perfiles Laminados en producción; 15-10): el nombre en gris de los
   grupos, centrado en la fila de chips. En el sitio y en el editor. */
:is(.ma-sitio-contenido, .editor-styles-wrapper) .ma-sublineas__rotulo {
	display: flex;
	align-items: center;
}

:is(.ma-sitio-contenido, .editor-styles-wrapper) .ma-sublineas__rotulo .ma-sublineas__etiqueta {
	margin-right: 0;
}

/* 2. Últimas noticias (core/query): la rejilla del sistema es la lista de entradas; cada <li>
      cede su lugar a la tarjeta que contiene. */
.ma-sitio-contenido .wp-block-post-template.ma-rejilla {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ma-sitio-contenido .wp-block-post-template.ma-rejilla > li {
	display: contents;
}

/* 3. Solo en el editor: aspecto de los estilos de botón del sistema sobre el marcado del núcleo
      (en el sitio el botón ya es un enlace ma-boton / ma-enlace). */
.editor-styles-wrapper .wp-block-button .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	min-height: var(--control-alto);
	padding: 0 var(--espacio-6);
	border: 1px solid transparent;
	border-radius: var(--radio-pildora);
	font-family: var(--font-texto);
	font-size: 17px;
	font-weight: 600;
	text-decoration: none;
}

.editor-styles-wrapper .wp-block-button.is-style-primario .wp-block-button__link {
	background: var(--rojo);
	color: var(--blanco);
}

.editor-styles-wrapper .wp-block-button.is-style-secundario .wp-block-button__link {
	background: var(--blanco);
	border-color: var(--tinta);
	color: var(--tinta);
}

.editor-styles-wrapper .wp-block-button.is-style-claro .wp-block-button__link {
	background: var(--blanco);
	color: var(--tinta);
}

/* Como .ma-enlace (bundle.css), que es lo que pinta el sitio. */
.editor-styles-wrapper .wp-block-button.is-style-enlace .wp-block-button__link {
	min-height: 0;
	padding: 0;
	background: none;
	color: var(--enlace);
	font-size: 17px;
	line-height: 24px;
	font-weight: 400;
}

.editor-styles-wrapper .wp-block-button.is-style-enlace .wp-block-button__link::after {
	content: "›";
	margin-left: var(--espacio-1);
	font-size: 1.2em;
	line-height: 1;
}

/* 4. Solo en el editor: que marketing vea lo mismo que el visitante (decisión de Diego, 9-10).
      En el sitio estas piezas ya llevan el marcado del sistema (inc/bloques.php,
      inc/plantilla-a.php, inc/listas.php); en el editor son bloques del núcleo. */

/* Las secciones del sistema (bloques raíz con clase ma-*) ocupan todo el ancho, como en el sitio,
   donde ellas mismas fijan su contenedor. La raíz del editor las limitaría al ancho de lectura de
   theme.json (contentSize, 720 px), pensado para el texto de las entradas, que no cambia. */
.editor-styles-wrapper .is-root-container > [class*="ma-"] {
	max-width: none;
}

/* Fotos en su marco, como en el sitio (tema.css, sección 5; regla de fotos de Diego, 16-10): el
   recuadro del sistema, que la foto llena (recortada, con su encuadre; si es más chica, se agranda).
   Las medidas reales las pone assets/js/editor.js en --ma-archivo-*. */
.editor-styles-wrapper :is(.ma-medio, .ma-proyectos__img, .ma-catalogo__portada, .ma-servicio__medio, .ma-declaracion__fondo) {
	position: relative;
	margin-block: 0;
	background: var(--gris-claro);
}

.editor-styles-wrapper :is(.ma-medio, .ma-proyectos__img, .ma-servicio__medio, .ma-declaracion__fondo) img {
	position: absolute;
	inset: 0;
	width: 100%;
	/* En el editor, el bloque Imagen pone «height: auto» en línea: una foto más apaisada que su
	   marco quedaría con franjas en vez de llenarlo, como en el sitio. */
	height: 100% !important;
	max-width: none;
	max-height: none;
	margin: 0;
	object-fit: cover;
	object-position: var(--ma-encuadre, 50% 50%);
}

/* La foto atenuada de la declaración es un fondo: como en el sitio, a su tamaño como mucho. */
.editor-styles-wrapper .ma-declaracion__fondo img {
	max-width: var(--ma-archivo-ancho, 100%);
	max-height: var(--ma-archivo-alto, 100%);
	margin: auto;
}

/* El logo de la intro (MultiFireNet), entero sobre el blanco con borde del sistema. */
.editor-styles-wrapper .ma-intro__logo {
	background: var(--blanco);
}

/* Fichas: la foto del producto, entera y centrada en su recuadro blanco (1:1; 4:3 en móvil). */
.editor-styles-wrapper .ma-ficha__medio {
	margin: 0;
	background: var(--blanco);
}

.editor-styles-wrapper .ma-ficha__medio img {
	object-fit: contain;
	object-position: 50% 50%;
}

/* Foto al lado del texto y foto de la intro, como en el sitio (tema.css; ajustes 3 de Diego, 16-10):
   a todo el ancho de la columna, entera y con su proporción (--aspecto, que pone assets/js/editor.js
   en la figura), hasta el alto del recuadro de antes (lateral: 3:4 del ancho, 4:5 y hasta 440 px en
   móvil; intro: 4:3); solo una foto más alta se recorta. Un producto con fondo blanco
   (ma-fondo-blanco, assets/js/editor.js) o un dibujo técnico (ma-dibujo) nunca se recortan: enteros
   dentro de ese alto, sobre blanco; el dibujo del lateral, con su borde fino (decisión de Diego,
   14-10). */
.editor-styles-wrapper :is(.ma-producto__lateral, .ma-intro__medio) {
	container-type: inline-size;
}

.editor-styles-wrapper .ma-producto__lateral .ma-producto__foto {
	width: 100%;
	height: auto;
	aspect-ratio: var(--aspecto, 3 / 4);
	max-height: calc(100cqw * 4 / 3);
}

@media (max-width: 734px) {
	.editor-styles-wrapper .ma-producto__lateral .ma-producto__foto {
		max-height: min(calc(100cqw * 5 / 4), 440px);
	}
}

.editor-styles-wrapper .ma-intro__imagen {
	width: 100%;
	height: auto;
	max-height: calc(100cqw * 3 / 4);
}

.editor-styles-wrapper .ma-producto__foto:is(.ma-fondo-blanco, .ma-dibujo) {
	background: var(--blanco);
}

.editor-styles-wrapper .ma-producto__foto:is(.ma-fondo-blanco, .ma-dibujo) img {
	object-fit: contain;
	object-position: 50% 50%;
}

.editor-styles-wrapper .ma-producto__lateral .ma-producto__foto.ma-dibujo {
	border: 1px solid var(--linea);
	border-radius: var(--radio-md);
}

/* Dibujo técnico en los demás marcos (atributo maDibujo; la clase ma-dibujo la pone
   assets/js/editor.js): como en el sitio, entero, sin recortar, sobre blanco. */
.editor-styles-wrapper :is(.ma-medio, .ma-proyectos__img, .ma-servicio__medio).ma-dibujo {
	background: var(--blanco);
}

.editor-styles-wrapper :is(.ma-medio, .ma-proyectos__img, .ma-servicio__medio).ma-dibujo img {
	object-fit: contain;
	object-position: 50% 50%;
}

/* Tarjetas de servicio de la portada Servicios (lista centrada): las fotos en un recuadro 3:2, como
   en el sitio (Diego, 16-10). */
.editor-styles-wrapper .ma-servicios--centrada .ma-servicio__medio {
	aspect-ratio: 3 / 2;
}

/* El logo de la marca representada y el dibujo de cada perfil (plantilla B): enteros, a todo el ancho
   de su marco y con su proporción, que inc/plantilla-b.php (en el editor, assets/js/editor.js) pone en el
   marco como --aspecto. Así el marco guarda su lugar mientras la imagen carga en diferido: con el alto
   de la imagen en el flujo, al cargar los logos de Sensores y juntas corrían hacia abajo las fichas y
   su foto, el LCP, se pintaba hasta 0,6 s más tarde (15-10). */
.editor-styles-wrapper :is(.ma-perfil__foto, .ma-marca-socio__logo) {
	position: relative;
	height: auto;
	aspect-ratio: var(--aspecto, auto);
	border: 0;
	background: none;
}

.editor-styles-wrapper :is(.ma-perfil__foto, .ma-marca-socio__logo) img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100% !important;
	max-width: none;
	max-height: none;
	margin: 0;
	object-fit: fill;
}

.editor-styles-wrapper .ma-intro__logo img {
	object-fit: contain;
}

.editor-styles-wrapper .ma-declaracion__fondo {
	background: none;
}

.editor-styles-wrapper .ma-declaracion__fondo img {
	opacity: .3;
}

.editor-styles-wrapper figure.ma-tarjeta__medio {
	margin: var(--espacio-2) var(--espacio-2) 0;
}

.editor-styles-wrapper .ma-tarjeta--horizontal figure.ma-tarjeta__medio {
	margin: var(--espacio-2);
}

/* Proporciones fijas de los marcos (en el sitio las pone inc/plantilla-a.php). La foto de la intro
   toma la suya (assets/js/editor.js), como en el sitio. */
.editor-styles-wrapper .ma-rejilla-centrada {
	--aspecto: 16 / 9;
}

/* Tarjetas de servicio: en el sitio son <li><a class="ma-servicio">; en el editor, el elemento de
   la lista con su foto y su nombre (con enlace). */
.editor-styles-wrapper .ma-servicios--centrada > .ma-servicio {
	flex: 0 1 calc((100% - 2 * var(--espacio-6)) / 3);
	margin: 0;
}

.editor-styles-wrapper .ma-servicio__titulo {
	margin: 0;
}

.editor-styles-wrapper .ma-servicio__titulo a {
	color: inherit;
	text-decoration: none;
}

@media (max-width: 1068px) {
	.editor-styles-wrapper .ma-servicios--centrada > .ma-servicio {
		flex-basis: calc((100% - var(--espacio-6)) / 2);
	}
}

@media (max-width: 734px) {
	.editor-styles-wrapper .ma-servicios--centrada > .ma-servicio {
		flex-basis: auto;
	}
}

/* Botón «Descarga»: el secundario con el ícono de descarga delante (en el sitio, un <svg>). */
.editor-styles-wrapper .wp-block-button.is-style-descarga .wp-block-button__link {
	gap: var(--espacio-2);
	background: var(--blanco);
	border-color: var(--tinta);
	color: var(--tinta);
}

.editor-styles-wrapper .wp-block-button.is-style-descarga .wp-block-button__link::before {
	content: "";
	flex: none;
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11 M7.5 10.5L12 15l4.5-4.5 M5 19.5h14'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11 M7.5 10.5L12 15l4.5-4.5 M5 19.5h14'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Ajustes de diseño de Diego (15-10), como en el sitio (tema.css): sin triángulos rojos y listas
   sin viñeta, con una línea fina entre ítems, 10 px arriba y abajo y el texto en --tinta. La
   esquina de la foto del lateral se quita sin tocar el contorno del bloque con foco (usa ::after). */
.editor-styles-wrapper :is(.ma-anuncio__triangulo, .ma-declaracion__marca, .ma-gracias__marca) {
	display: none;
}

.editor-styles-wrapper :is(.ma-producto__foto, .ma-terreno__foto):not(:focus)::after,
.editor-styles-wrapper :is(.ma-valor, .ma-capacidad)::before {
	content: none;
}

.editor-styles-wrapper :is(.ma-lista-tecnica, .ma-ficha__lista, .ma-planta__lista, .ma-texto-largo ul) {
	display: block;
	padding: 0;
	border: 0;
	list-style: none;
}

.editor-styles-wrapper :is(.ma-lista-tecnica, .ma-ficha__lista, .ma-planta__lista, .ma-texto-largo ul) > li {
	display: block;
	padding: 10px 0;
	border: 0;
	color: var(--tinta);
}

.editor-styles-wrapper :is(.ma-lista-tecnica, .ma-ficha__lista, .ma-planta__lista, .ma-texto-largo ul) > li + li {
	border-top: 1px solid var(--linea);
}

.editor-styles-wrapper :is(.ma-lista-tecnica, .ma-ficha__lista, .ma-planta__lista, .ma-texto-largo ul) > li::before {
	content: none;
}

/* Gracias, opción B de Diego (16-10), como en el sitio (tema.css): sin tarjeta, en una columna de
   760 px; título 56/62, subtítulo 22/30 y peso 500, la línea roja de 48 × 2 px y el párrafo en 17/27
   y tinta-suave, de 560 px, con la negrita en tinta 600. El check lo agrega el sitio al pintar la
   página (inc/plantilla-c.php): en el editor no está, como el triángulo de antes. */
.editor-styles-wrapper .ma-gracias__caja {
	gap: 0;
	max-width: 760px;
	padding: 0;
	border-radius: 0;
	background: none;
}

.editor-styles-wrapper .ma-gracias__caja .ma-t-1 {
	font-size: 56px;
	line-height: 62px;
}

.editor-styles-wrapper .ma-gracias__caja .ma-entradilla {
	margin-top: var(--espacio-4);
	color: var(--tinta);
	font-size: 22px;
	line-height: 30px;
	font-weight: 500;
}

.editor-styles-wrapper .ma-gracias__caja .ma-entradilla strong {
	font-weight: inherit;
}

.editor-styles-wrapper .ma-gracias__caja .ma-cuerpo {
	max-width: 560px;
	color: var(--tinta-suave);
	font-size: 17px;
	line-height: 27px;
}

.editor-styles-wrapper .ma-gracias__caja .ma-cuerpo strong {
	color: var(--tinta);
	font-weight: 600;
}

.editor-styles-wrapper .ma-gracias__caja :is(.ma-entradilla, .ma-t-1) + .ma-cuerpo::before {
	content: "";
	display: block;
	width: 48px;
	height: 2px;
	margin: var(--espacio-8) auto;
	background: var(--rojo);
}

/* El bloque con foco usa ::after para su contorno (content.min.css del editor). En la foto del
   lateral, ese ::after tomaba además la forma y el color del triángulo del sistema y se veía un
   triángulo rojo arriba a la izquierda: con foco, solo el contorno. */
.editor-styles-wrapper .ma-producto__foto.block-editor-block-list__block:focus::after {
	width: auto;
	height: auto;
	background: none;
	clip-path: none;
}

/* Título de la página, arriba del lienzo: con un título largo, sus líneas se montaban (heredaba
   el interlineado del texto, 26 px, con letra de 34 px). */
.editor-styles-wrapper .editor-post-title {
	line-height: 1.2;
}

.editor-styles-wrapper .ma-figura {
	margin: 0;
}

.editor-styles-wrapper .ma-figura img {
	max-width: 100%;
	height: auto;
	border-radius: var(--radio-md);
}

/* Acciones del lateral y del panel gris: en el sitio, enlaces sueltos en una columna; en el
   editor, los grupos de botones y la lista de descargas, también en columna y a todo el ancho. */
.editor-styles-wrapper :is(.ma-producto__acciones, .ma-intro__acciones) :is(.wp-block-buttons, .ma-descargas) {
	display: grid;
	gap: var(--espacio-3);
}

.editor-styles-wrapper :is(.ma-producto__acciones, .ma-intro__acciones) .wp-block-button:not(.is-style-enlace) .wp-block-button__link {
	width: 100%;
	justify-content: center;
}

.editor-styles-wrapper .ma-producto__acciones .is-style-enlace {
	justify-self: center;
}

.editor-styles-wrapper .ma-cierre__acciones .ma-descargas {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--espacio-3);
}

/* Tabla técnica: la tabla del núcleo con el aspecto de TablaTecnica (en el sitio la pinta el tema
   con su marcado). Sobre ella, los grupos del encabezado como fila de referencia. */
.editor-styles-wrapper .ma-tabla-tecnica__tabla .wp-block-table {
	margin: 0;
	overflow-x: auto;
	border: 1px solid var(--linea);
	border-radius: var(--radio-lg);
	background: var(--blanco);
}

.editor-styles-wrapper .ma-tabla-tecnica__tabla table {
	/* Como en el sitio: columnas a su contenido (la tabla del núcleo las fija y parte las cifras). */
	table-layout: auto;
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	font-size: 15px;
	line-height: 20px;
	font-variant-numeric: tabular-nums;
}

.editor-styles-wrapper .ma-tabla-tecnica__tabla :is(th, td) {
	padding: 10px 14px;
	border: 0;
	border-bottom: 1px solid var(--linea);
	color: var(--tinta);
	text-align: right;
	white-space: nowrap;
}

.editor-styles-wrapper .ma-tabla-tecnica__tabla thead th {
	background: var(--gris-claro);
	color: var(--tinta-suave);
	font-size: 13px;
	font-weight: 500;
}

.editor-styles-wrapper .ma-tabla-tecnica__tabla :is(th, td):first-child {
	font-weight: 600;
	text-align: left;
}

.editor-styles-wrapper .ma-tabla-tecnica--texto .ma-tabla-tecnica__tabla :is(th, td) {
	min-width: 168px;
	text-align: left;
	white-space: normal;
	vertical-align: top;
}

.editor-styles-wrapper .ma-tabla-tecnica__grupos {
	display: grid;
	margin-bottom: var(--espacio-1);
	border-radius: var(--radio-md);
	background: var(--gris-claro);
	color: var(--tinta);
	font-size: 13px;
	font-weight: 600;
	text-align: center;
}

.editor-styles-wrapper .ma-tabla-tecnica__grupos span {
	padding: 6px 8px;
	border-left: 1px solid var(--linea);
}

/* Etapa 6 · Proyectos (plantilla B) ---------------------------------------- */
/* Rejilla de logos en el editor: como en el sitio (tema.css), cada logo entero en el marco 2:1 del
   sistema, sobre blanco y sin agrandarse (--ma-archivo-* lo pone blocks/logos/editor.js). En el
   editor, cada logo es el <li class="ma-proveedor"> de la lista; sin imagen, el marco deja ver
   entero el cuadro para elegirla. */
.editor-styles-wrapper .ma-proveedores > .ma-proveedor {
	margin: 0;
}

.editor-styles-wrapper .ma-proveedor__logo {
	position: relative;
	margin: 0;
	background: var(--blanco);
}

.editor-styles-wrapper .ma-proveedor__logo img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100% !important;
	max-width: var(--ma-archivo-ancho, 100%);
	max-height: var(--ma-archivo-alto, 100%);
	margin: auto;
	object-fit: contain;
}

.editor-styles-wrapper .ma-proveedor__logo:has(.components-placeholder) {
	aspect-ratio: auto;
	overflow: visible;
}

.editor-styles-wrapper :is(.ma-proveedor__nombre, .ma-proveedor__accion) {
	margin: 0;
	padding-inline: var(--espacio-1);
}

.editor-styles-wrapper .ma-proveedor__accion {
	color: var(--enlace);
	font-size: 14px;
	line-height: 20px;
}

/* En el editor la tarjeta del logo no se levanta al pasar el ratón: se elige con un clic. */
.editor-styles-wrapper .ma-proveedor:hover {
	transform: none;
	box-shadow: none;
}

/* Etapa 6 · Plantilla C (páginas únicas) ------------------------------------- */
/* Proyectos en el editor. El video de fondo del héroe: en el sitio queda detrás del texto; en el
   editor, a la vista y sin velo, para elegirlo (o cambiarlo) con un clic. */
.editor-styles-wrapper .ma-heroe__fondo {
	position: relative;
	inset: auto;
	max-width: 480px;
	margin: 0 auto;
	padding-top: var(--espacio-6);
}

.editor-styles-wrapper .ma-heroe__fondo::after {
	content: none;
}

/* Videos de sección: el bloque Video con su pie debajo (en el sitio, sobre el video). */
.editor-styles-wrapper .ma-video-ancho {
	aspect-ratio: auto;
	overflow: visible;
}

.editor-styles-wrapper .ma-video-ancho .wp-element-caption {
	margin-top: var(--espacio-2);
	color: var(--tinta-suave);
	font-size: 14px;
	line-height: 20px;
}

/* Proyecto del portafolio: en el sitio, una fila que se abre (<details>); en el editor, la fila y su
   detalle a la vista. Año a la izquierda, cliente, nombre y resumen al centro y la cifra a la
   derecha, como en el sitio. */
.editor-styles-wrapper .ma-proyecto__fila {
	grid-template-columns: 88px minmax(0, 1fr) 220px;
	grid-auto-flow: dense;
	cursor: default;
}

.editor-styles-wrapper .ma-proyecto__fila > .ma-proyecto__anio {
	grid-column: 1;
	grid-row: 1 / span 3;
	align-self: center;
}

.editor-styles-wrapper .ma-proyecto__fila > :is(.ma-proyecto__cliente, .ma-proyecto__nombre, .ma-proyecto__resumen) {
	grid-column: 2;
	margin: 0;
}

.editor-styles-wrapper .ma-proyecto__fila > .ma-proyecto__cifra {
	grid-column: 3;
	grid-row: 1 / span 3;
	align-self: center;
}

.editor-styles-wrapper :is(.ma-planta__cifra, .ma-proyecto__cifra) > p,
.editor-styles-wrapper .ma-cifra > p {
	margin: 0;
}

/* Las sucursales en el editor: una bajo otra, cada una con el nombre de su pestaña. */
.editor-styles-wrapper .ma-sucursales__lista {
	display: grid;
	gap: var(--espacio-10);
}

.editor-styles-wrapper .ma-sucursal__pestana-editor {
	margin: 0 0 var(--espacio-3);
	color: var(--tinta-suave);
	font-size: 14px;
	font-weight: 600;
}