/* Flatsome Block Reveal — block-reveal.css */

/* ── Wrapper del shortcode completo ── */
.fbr-wrapper {
	position: relative;
	overflow: hidden;
}

/* ── Clase que RevealFx añade al elemento target ── */
.fbr-block {
	position: relative !important;
	overflow: hidden;
}

/* ── El bloque de color que barre ── */
.fbr-revealer-el {
	position: absolute;
	top:    0;
	left:   0;
	width:  100%;
	height: 100%;
	pointer-events: none;
	opacity: 0;
	z-index: 10;
	will-change: transform, opacity;
}

/* ── Contenido interno (dentro de RevealFx) ── */
.fbr-content {
	display: block;
	width:   100%;
}

/* ── Span inline-block que envuelve cada tag en modo per-tag.
   Hace que el bloque de color se ajuste al ancho real del texto,
   no al ancho del contenedor padre.                              ── */
.fbr-tag-wrap {
	display:        inline-block;
	position:       relative;
	overflow:       hidden;
	max-width:      100%;
	vertical-align: bottom;  /* evita el gap de descender de inline-block */
}

/* Cuando fbr-tag-wrap está dentro de un heading o párrafo,
   heredar las propiedades tipográficas sin romper el flujo  */
p > .fbr-tag-wrap,
h1 > .fbr-tag-wrap,
h2 > .fbr-tag-wrap,
h3 > .fbr-tag-wrap,
h4 > .fbr-tag-wrap,
h5 > .fbr-tag-wrap,
h6 > .fbr-tag-wrap,
li > .fbr-tag-wrap,
blockquote > .fbr-tag-wrap {
	font-size:   inherit;
	font-weight: inherit;
	line-height: inherit;
	color:       inherit;
	font-family: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
}

/* ── Imágenes dentro del wrapper ── */
.fbr-wrapper > .fbr-block > .fbr-content img {
	display: block;
	width:   100%;
	height:  auto;
}