/*
 # ########*###########################
 Autor: Bincodex
 Fecha: 2026-08-13
 Archivo: 06-buscador.css
 Codificación: UTF-8
 ####################################
 */

/* BUSCADOR HERO */
.buscador-form{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	background:#fff;
	padding:14px;
	border-radius:60px;
	box-shadow:0 10px 35px rgba(0,0,0,.18);
	margin-bottom:35px;
}

.buscador-form input[type="text"],
.buscador-form select{
	flex:1 1 200px;
	min-width:0;
	border:1px solid #e3e3e3;
	border-radius:40px;
	padding:14px 22px;
	font-size:1rem;
	color:#333;
	background:#fbfbfb;
	outline:none;
}

.buscador-form input[type="text"]:focus,
.buscador-form select:focus{
	border-color:var(--color-claro);
}

.buscador-form .btn-primary{
	border:none;
	cursor:pointer;
	font-size:1rem;
	white-space:nowrap;
}




/* CATALOGO: FILTROS + LISTADO */
.catalogo{
	display:flex;
	align-items:flex-start;
	gap:40px;
	padding:55px 8% 60px;
}

.catalogo-filtros{
	flex:0 0 300px;
	position:sticky;
	top:25px;
	max-height:calc(100vh - 50px);
	overflow:auto;
	background:#fff;
	border-radius:20px;
	padding:28px 24px;
	box-shadow:0 5px 25px rgba(0,0,0,.05);
}

.catalogo-filtros h2{
	text-align:left;
	font-size:1.35rem;
	margin-bottom:28px;
}

.catalogo-lista{
	flex:1;
	min-width:0;
}

.catalogo-lista .services{
	padding:0 0 40px;
}

.catalogo-lista .cards{
	grid-template-columns:repeat(auto-fit,minmax(330px,1fr));
}

/* CONTADORES */
.contador-bloque{
	margin-bottom:32px;
}

.contador-bloque:last-child{
	margin-bottom:0;
}

.contador-bloque h3{
	font-size:1rem;
	color:#555;
	margin-bottom:14px;
}

.chips{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
}

.chip{
	border:1.5px solid var(--color-claro);
	background:#fff;
	color:#444;
	border-radius:40px;
	padding:9px 18px;
	font-size:.92rem;
	cursor:pointer;
	transition:all .2s;
	display:inline-flex;
	align-items:center;
	gap:8px;
}

.chip b{
	background:var(--color-claro);
	color:#fff;
	border-radius:20px;
	padding:1px 10px;
	font-size:.8rem;
}

.chip:hover{
	background:color-mix(in srgb, var(--color-claro) 12%, #fff);
}

.chip.active{
	background:var(--color-claro);
	color:#fff;
	border-color:var(--color-claro);
}

.chip.active b{
	background:#fff;
	color:var(--color-claro);
}

.ver-todas{
	text-align:center;
	margin-top:45px;
}

.ver-todas .btn-secondary{
	background:transparent;
	cursor:pointer;
	font-size:1rem;
}

.resultado-info{
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex-wrap:wrap;
	gap:15px;
	margin:25px 0 35px;
	font-size:1.05rem;
}

.btn-limpiar{
	background:transparent;
	border:1.5px solid var(--color-oscuro);
	color:var(--color-oscuro);
	border-radius:40px;
	padding:10px 24px;
	font-size:.92rem;
	cursor:pointer;
	transition:all .2s;
}

.btn-limpiar:hover{
	background:var(--color-oscuro);
	color:#fff;
}

.sin-resultados{
	background:#fff;
	border-radius:20px;
	padding:60px 30px;
	text-align:center;
	color:#777;
	box-shadow:0 5px 25px rgba(0,0,0,.05);
}




/* RESPONSIVE */
@media( max-width:1100px ){

	.catalogo{
		flex-direction:column;
		gap:30px;
		padding:45px 8% 60px;
	}

	.catalogo-filtros{
		flex:1 1 auto;
		position:static;
		max-height:none;
		width:100%;
	}

	.catalogo-filtros h2{
		text-align:center;
	}
}

@media( max-width:900px ){

	.buscador-form{
		border-radius:30px;
	}

	.buscador-form input[type="text"],
	.buscador-form select{
		flex:1 1 100%;
	}

	.buscador-form .btn-primary{
		flex:1 1 100%;
		text-align:center;
	}
}