/* Banda de reclamo. Creado 2026-09-18 · v1.0.0
   Regla de la casa: cada cambio de CSS = nombre de archivo nuevo (WP Rocket).

   Lo que habia: 240 px de naranja macizo con el titulo, dos textos que decian
   casi lo mismo, una linea de puntos y el logotipo. Y sin boton: el titulo y
   el logo llevaban al Menu del dia, pero eso no se veia.

   Lo que hay: una banda de 130 px con tres cosas —logotipo, texto y boton— en
   una linea. El naranja se queda, que es el de la marca, pero ocupando menos
   y diciendo mas.

   Todo va prefijado con .r27 porque el kit de Elementor (.elementor-kit-99596)
   gana a las reglas de una sola clase. */

.r27{
	background:var(--wti-naranja,#F57C00);
	color:#fff;
}

.r27 .r27-dentro{
	display:flex;
	align-items:center;
	gap:28px;
	padding-top:22px;
	padding-bottom:22px;
}

/* ---------- el logotipo ---------- */
.r27 .r27-marca{
	flex:none;
	display:block;
	line-height:0;
}
.r27 .r27-marca img{
	display:block;
	width:auto;
	height:78px;
}

/* ---------- el texto ---------- */
.r27 .r27-texto{flex:1 1 auto;min-width:0}

.r27 .r27-titulo{
	margin:0;
	font-family:var(--wti-titulos,"Oswald",sans-serif);
	font-weight:400;
	font-size:28px;
	line-height:1.1;
	letter-spacing:.01em;
	text-transform:uppercase;
	color:#fff;
}
.r27 .r27-titulo a{
	color:#fff !important;
	text-decoration:none;
}
.r27 .r27-titulo a:hover{text-decoration:underline;text-underline-offset:4px}

.r27 .r27-lema{
	margin:8px 0 0;
	font-size:15.5px;
	line-height:1.5;
	color:rgba(255,255,255,.92);
	max-width:70ch;
}

/* ---------- el boton ----------
   La pastilla de la casa, pero al reves: sobre naranja el blanco es el que
   manda. Al pasar por encima se rellena y el texto se pone naranja. */
.r27 a.r27-boton,
.r27 .r27-boton{
	flex:none;
	display:inline-block;
	padding:11px 24px;
	border:1.5px solid #fff !important;
	border-radius:999px;
	background:transparent;
	color:#fff !important;
	font-family:var(--wti-titulos,"Oswald",sans-serif);
	font-size:14px;
	font-weight:500;
	letter-spacing:.06em;
	text-transform:uppercase;
	text-decoration:none;
	white-space:nowrap;
	transition:background .18s ease,color .18s ease;
}
.r27 a.r27-boton:hover{
	background:#fff;
	color:var(--wti-naranja,#F57C00) !important;
}
.r27 .r27-boton span{margin-left:7px}

/* ---------- tableta ---------- */
@media (max-width:1024px){
	.r27 .r27-dentro{gap:20px;padding-top:18px;padding-bottom:18px}
	.r27 .r27-marca img{height:64px}
	.r27 .r27-titulo{font-size:24px}
	.r27 .r27-lema{font-size:15px}
}

/* ---------- movil: en columna y el boton a lo ancho ---------- */
@media (max-width:760px){
	.r27 .r27-dentro{
		flex-direction:column;
		align-items:flex-start;
		gap:14px;
	}
	.r27 .r27-marca img{height:56px}
	.r27 .r27-titulo{font-size:22px}
	.r27 a.r27-boton{align-self:stretch;text-align:center}
}