/* ==========================================================================
   Barra de anuncio (prenavbar) — Pisos Gómez
   Va arriba de todo, en flujo normal (el header de este sitio no es fijo, así
   que la barra se desliza con la página al hacer scroll). Colores de marca:
   mostaza #E8BA40 + negro #111. Todo prefijado .pg-anuncio para no chocar con
   Betheme. Diseño tomado del prototipo del rediseño (barra .anuncio).
   ========================================================================== */

.pg-anuncio {
	background: #E8BA40;
	color: #111111;
	font-family: "Montserrat", "Helvetica Neue", Arial, sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	position: relative;
	z-index: 31;
}

.pg-anuncio__in {
	max-width: 1220px;
	margin: 0 auto;
	padding: 0 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 38px;
}

/* --- el rotador (izquierda) — es un enlace a WhatsApp -------------------- */
.pg-anuncio__rot {
	position: relative;
	flex: 1;
	height: 38px;
	overflow: hidden;
	color: #111111;
	text-decoration: none;
}

.pg-anuncio__it {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	opacity: 0;
	transform: translateY(60%);
	transition: opacity .42s cubic-bezier(.2, .7, .3, 1), transform .42s cubic-bezier(.2, .7, .3, 1);
}

.pg-anuncio__it[data-on] {
	opacity: 1;
	transform: none;
}

/* Los <img> que inyecta Smush no aplican acá (son SVG inline), pero por las
   dudas evitamos que ninguna regla del tema los estire. */
.pg-anuncio__it svg,
.pg-anuncio__meta svg {
	flex: none;
	display: inline-block;
	vertical-align: middle;
}

/* --- meta (derecha): teléfono + WhatsApp -------------------------------- */
.pg-anuncio__meta {
	display: none;
	align-items: center;
	gap: 20px;
	flex: none;
}

@media (min-width: 900px) {
	.pg-anuncio__meta {
		display: flex;
	}
}

.pg-anuncio__meta a {
	color: #111111;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	text-decoration: none;
}

.pg-anuncio__meta a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* El de WhatsApp, un poco más marcado (es el CTA). */
.pg-anuncio__wa {
	font-weight: 700;
}

.pg-anuncio .tabular {
	font-variant-numeric: tabular-nums;
}

@media (max-width: 520px) {
	.pg-anuncio__in {
		padding: 0 16px;
	}
	.pg-anuncio {
		font-size: 10.5px;
		letter-spacing: .1em;
	}
}

/* Reducir movimiento: sin rotación (el JS no rota y queda el primer mensaje).
   Igual dejamos la transición apagada por si acaso. */
@media (prefers-reduced-motion: reduce) {
	.pg-anuncio__it {
		transition: none;
	}
}