/* ============================================================
   Valia · Directorio médico público
   Enfoque: confianza, lectura clara, pacientes adultos, mobile first
   ============================================================ */

.directorio-kicker {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-size: .7rem;
	font-weight: 900;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--valia-green, #164E4A);
	background: rgba(47, 125, 109, .10);
	border: 1px solid rgba(47, 125, 109, .16);
	border-radius: 999px;
	padding: .55rem .8rem;
	margin-bottom: 1rem;
}

.directorio-kicker.gold {
	color: #765314;
	background: rgba(184, 137, 91, .16);
	border-color: rgba(184, 137, 91, .30);
}

.directorio-hero {
	position: relative;
	overflow: hidden;
	padding: 7.2rem 0 3.6rem;
	background:
		radial-gradient(circle at 10% 14%, rgba(22, 78, 74, .12), transparent 34%),
		radial-gradient(circle at 86% 8%, rgba(184, 137, 91, .18), transparent 28%),
		linear-gradient(180deg, var(--valia-ivory, #F8F5EF) 0%, #fff 100%);
}

.directorio-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(16, 42, 67, .035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(16, 42, 67, .035) 1px, transparent 1px);
	background-size: 54px 54px;
	-webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 82%);
	mask-image: linear-gradient(180deg, #000 0%, transparent 82%);
	pointer-events: none;
}

.directorio-hero-content {
	position: relative;
	z-index: 2;
}

.directorio-hero h1 {
	max-width: 980px;
	font-size: clamp(2.6rem, 5vw, 5.35rem);
	line-height: .92;
	font-weight: 900;
	letter-spacing: -.07em;
	color: var(--valia-blue, #102A43);
	margin: 0;
}

.directorio-hero p {
	max-width: 820px;
	font-size: clamp(1rem, 1.28vw, 1.2rem);
	color: rgba(32, 36, 42, .76);
	margin: 1.15rem 0 0;
}

.directorio-search-panel {
	position: relative;
	z-index: 5;
	margin-top: 2rem;
	background: rgba(255, 255, 255, .94);
	border: 1px solid rgba(16, 42, 67, .10);
	border-radius: 2rem;
	padding: 1rem;
	box-shadow: 0 24px 70px rgba(16, 42, 67, .12);
	backdrop-filter: blur(18px);
}

.directorio-search-panel .form-control,
.directorio-search-panel .form-select {
	min-height: 58px;
	border: 0;
	border-radius: 1.2rem;
	background: #F8FAFC;
	color: var(--valia-graphite, #20242A);
	font-weight: 760;
	padding-left: 1rem;
}

.directorio-search-panel .form-control:focus,
.directorio-search-panel .form-select:focus,
.directorio-filter-card .form-control:focus,
.directorio-filter-card .form-select:focus {
	box-shadow: 0 0 0 .22rem rgba(22, 78, 74, .11);
	border-color: rgba(22, 78, 74, .25);
}

.directorio-search-panel .btn {
	min-height: 58px;
	border-radius: 999px;
	font-weight: 900;
}

.directorio-signal-strip {
	display: flex;
	flex-wrap: wrap;
	gap: .65rem;
	margin-top: 1.5rem;
}

.directorio-signal-strip span {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	border-radius: 999px;
	padding: .65rem .9rem;
	font-size: .88rem;
	font-weight: 850;
	background: rgba(255, 255, 255, .82);
	border: 1px solid rgba(16, 42, 67, .10);
	color: rgba(32, 36, 42, .80);
	box-shadow: 0 8px 22px rgba(16, 42, 67, .05);
}

.directorio-signal-strip i {
	color: var(--valia-green, #164E4A);
}

.directorio-wrap {
	padding: 3rem 0 6rem;
	background: linear-gradient(180deg, #fff 0%, var(--valia-ivory, #F8F5EF) 100%);
}

.directorio-filter-card {
	position: sticky;
	top: 104px;
	background: #fff;
	border: 1px solid rgba(16, 42, 67, .10);
	border-radius: 2rem;
	padding: 1.35rem;
	box-shadow: 0 18px 50px rgba(16, 42, 67, .08);
}

.directorio-filter-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: .8rem;
}

.directorio-filter-header span {
	display: block;
	font-size: .68rem;
	font-weight: 900;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--valia-muted, #657184);
	margin-bottom: .25rem;
}

.directorio-filter-header h2 {
	font-size: 1.35rem;
	font-weight: 900;
	letter-spacing: -.045em;
	color: var(--valia-blue, #102A43);
	margin: 0;
}

.directorio-filter-header a {
	font-size: .84rem;
	font-weight: 850;
	color: var(--valia-green, #164E4A);
}

.directorio-filter-guide {
	display: flex;
	gap: .55rem;
	align-items: flex-start;
	background: rgba(47, 125, 109, .08);
	border: 1px solid rgba(47, 125, 109, .14);
	border-radius: 1.1rem;
	padding: .85rem;
	font-size: .82rem;
	line-height: 1.45;
	font-weight: 650;
	color: rgba(16, 42, 67, .78);
	margin-bottom: 1rem;
}

.directorio-filter-guide i {
	color: var(--valia-green, #164E4A);
	margin-top: .12rem;
}

.directorio-filter-group {
	padding: .95rem 0;
	border-bottom: 1px solid rgba(16, 42, 67, .08);
}

.directorio-filter-group:last-of-type {
	border-bottom: 0;
}

.directorio-filter-card .form-label {
	font-size: .72rem;
	font-weight: 900;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--valia-muted, #657184);
	margin-bottom: .5rem;
}

.directorio-filter-card .form-control,
.directorio-filter-card .form-select {
	min-height: 50px;
	border-radius: 1rem;
	border: 1px solid rgba(16, 42, 67, .10);
	background: #F8FAFC;
	font-weight: 720;
}

.directorio-filter-card .btn {
	min-height: 52px;
	border-radius: 999px;
	font-weight: 900;
}

.directorio-filter-note {
	font-size: .82rem;
	line-height: 1.45;
	color: var(--valia-muted, #657184);
	margin: .9rem 0 0;
}

.directorio-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	background: #fff;
	border: 1px solid rgba(16, 42, 67, .10);
	border-radius: 1.8rem;
	padding: 1.1rem 1.25rem;
	box-shadow: 0 12px 34px rgba(16, 42, 67, .055);
	margin-bottom: 1.25rem;
}

.directorio-toolbar h2 {
	font-size: 1.16rem;
	font-weight: 900;
	letter-spacing: -.035em;
	color: var(--valia-blue, #102A43);
	margin: 0;
}

.directorio-toolbar p {
	font-size: .88rem;
	color: var(--valia-muted, #657184);
	margin: .25rem 0 0;
}

.directorio-toolbar-badges {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: .5rem;
}

.soft-badge {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	border-radius: 999px;
	padding: .45rem .7rem;
	font-size: .74rem;
	font-weight: 900;
	white-space: nowrap;
}

.soft-badge.success {
	background: rgba(47, 125, 109, .10);
	color: var(--valia-green, #164E4A);
	border: 1px solid rgba(47, 125, 109, .15);
}

.soft-badge.bronze {
	background: rgba(184, 137, 91, .14);
	color: #765314;
	border: 1px solid rgba(184, 137, 91, .22);
}

.directorio-guide-card {
	background:
		radial-gradient(circle at top left, rgba(184, 137, 91, .16), transparent 30%),
		linear-gradient(135deg, #102A43, #071525);
	color: #fff;
	border-radius: 2rem;
	padding: 1.8rem;
	box-shadow: 0 24px 70px rgba(16, 42, 67, .18);
	margin-bottom: 1.35rem;
}

.directorio-guide-card .directorio-kicker {
	color: rgba(255, 255, 255, .84);
	background: rgba(255, 255, 255, .08);
	border-color: rgba(255, 255, 255, .14);
}

.directorio-guide-card h3 {
	font-size: 1.45rem;
	font-weight: 900;
	letter-spacing: -.045em;
	margin-bottom: .45rem;
}

.directorio-guide-card p,
.directorio-guide-card span {
	color: rgba(255, 255, 255, .74);
}

.directorio-guide-card strong {
	display: block;
	color: #fff;
	font-weight: 900;
	margin-bottom: .2rem;
}

.directorio-results-list {
	display: grid;
	gap: 1.25rem;
}

.directory-doctor-card {
	background: #fff;
	border: 1px solid rgba(16, 42, 67, .10);
	border-radius: 2.2rem;
	overflow: hidden;
	box-shadow: 0 16px 48px rgba(16, 42, 67, .07);
	transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.directory-doctor-card:hover {
	transform: translateY(-3px);
	border-color: rgba(47, 125, 109, .22);
	box-shadow: 0 30px 78px rgba(16, 42, 67, .13);
}

.directory-doctor-inner {
	display: grid;
	grid-template-columns: 260px 1fr;
	min-height: 305px;
}

.directory-doctor-photo {
	position: relative;
	display: block;
	min-height: 305px;
	background: #E8ECEB;
	overflow: hidden;
}

.directory-doctor-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .35s ease;
}

.directory-doctor-card:hover .directory-doctor-photo img {
	transform: scale(1.035);
}

.directory-doctor-photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 46%, rgba(16, 42, 67, .72));
	pointer-events: none;
}

.directory-doctor-badge {
	position: absolute;
	left: 1rem;
	bottom: 1rem;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-size: .75rem;
	font-weight: 900;
	border-radius: 999px;
	padding: .5rem .7rem;
	color: var(--valia-green, #164E4A);
	background: rgba(229, 243, 240, .95);
	border: 1px solid rgba(47, 125, 109, .18);
	backdrop-filter: blur(12px);
}

.directory-doctor-content {
	padding: 1.6rem;
}

.directory-doctor-title-row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
}

.directory-doctor-name {
	font-size: 1.45rem;
	line-height: 1.1;
	font-weight: 900;
	letter-spacing: -.045em;
	margin: 0 0 .3rem;
}

.directory-doctor-name a {
	color: var(--valia-blue, #102A43);
}

.directory-doctor-name a:hover {
	color: var(--valia-green, #164E4A);
}

.directory-doctor-specialty {
	color: var(--valia-green, #164E4A);
	font-weight: 900;
	margin-bottom: .5rem;
}

.directory-rating {
	display: inline-flex;
	align-items: center;
	gap: .25rem;
	color: var(--valia-bronze, #B8895B);
	font-size: .94rem;
	font-weight: 900;
	white-space: nowrap;
}

.directory-rating strong {
	color: #765314;
}

.directory-rating span {
	color: var(--valia-muted, #657184);
}

.directory-doctor-meta {
	display: flex;
	flex-wrap: wrap;
	gap: .65rem;
	color: var(--valia-muted, #657184);
	font-weight: 700;
	font-size: .9rem;
	margin-top: .55rem;
}

.directory-doctor-meta span {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
}

.directory-doctor-meta i {
	color: var(--valia-green, #164E4A);
}

.directory-doctor-summary {
	margin-top: 1rem;
	color: rgba(32, 36, 42, .74);
	background: #F8FAFC;
	border: 1px solid rgba(16, 42, 67, .08);
	border-radius: 1.25rem;
	padding: .9rem 1rem;
	font-size: .93rem;
	line-height: 1.5;
}

.directory-decision-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: .65rem;
	margin-top: 1rem;
}

.directory-decision-grid > div {
	background: #fff;
	border: 1px solid rgba(16, 42, 67, .09);
	border-radius: 1.1rem;
	padding: .8rem;
}

.directory-decision-grid span {
	display: flex;
	align-items: center;
	gap: .35rem;
	font-size: .68rem;
	font-weight: 900;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--valia-muted, #657184);
	margin-bottom: .35rem;
}

.directory-decision-grid i {
	color: var(--valia-green, #164E4A);
}

.directory-decision-grid strong {
	display: block;
	font-size: .84rem;
	line-height: 1.25;
	color: var(--valia-blue, #102A43);
}

.directory-tag-row {
	display: flex;
	flex-wrap: wrap;
	gap: .45rem;
	margin-top: 1rem;
}

.directory-tag {
	border-radius: 999px;
	padding: .4rem .62rem;
	font-size: .72rem;
	font-weight: 900;
	background: #F8FAFC;
	color: #3F5064;
	border: 1px solid rgba(16, 42, 67, .09);
}

.directory-tag.quality {
	background: rgba(16, 42, 67, .07);
	color: var(--valia-blue, #102A43);
}

.directory-tag.trust {
	background: rgba(47, 125, 109, .10);
	color: var(--valia-green, #164E4A);
}

.directory-tag.available {
	background: rgba(184, 137, 91, .14);
	color: #765314;
}

.directory-doctor-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .65rem;
	margin-top: 1.2rem;
}

.directory-doctor-actions .btn {
	min-width: 150px;
	justify-content: center;
	font-weight: 900;
}

.directorio-pagination {
	margin-top: 2rem;
}

.directorio-empty-state {
	background: #fff;
	border: 1px solid rgba(16, 42, 67, .10);
	border-radius: 2rem;
	padding: 3rem 1.5rem;
	text-align: center;
	box-shadow: 0 16px 48px rgba(16, 42, 67, .07);
}

.directorio-empty-state i {
	width: 64px;
	height: 64px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 1.35rem;
	background: rgba(47, 125, 109, .10);
	color: var(--valia-green, #164E4A);
	font-size: 1.7rem;
	margin-bottom: 1rem;
}

.directorio-empty-state h2 {
	font-size: 1.4rem;
	font-weight: 900;
	letter-spacing: -.035em;
	color: var(--valia-blue, #102A43);
}

.directorio-empty-state p {
	max-width: 560px;
	margin: .5rem auto 1.3rem;
	color: var(--valia-muted, #657184);
}

@media (max-width: 1199.98px) {
	.directory-doctor-inner {
		grid-template-columns: 230px 1fr;
	}
}

@media (max-width: 991.98px) {
	.directorio-filter-card {
		position: relative;
		top: auto;
		margin-bottom: 1rem;
	}

	.directory-doctor-inner {
		grid-template-columns: 1fr;
	}

	.directory-doctor-photo {
		height: 330px;
		min-height: 330px;
	}

	.directorio-toolbar {
		align-items: flex-start;
		flex-direction: column;
	}

	.directorio-toolbar-badges {
		justify-content: flex-start;
	}
}

@media (max-width: 575.98px) {
	.directorio-hero {
		padding: 6.2rem 0 2.4rem;
	}

	.directorio-hero h1 {
		font-size: clamp(2.15rem, 11vw, 3rem);
		line-height: .98;
		letter-spacing: -.055em;
	}

	.directorio-hero p {
		font-size: .98rem;
		line-height: 1.5;
	}

	.directorio-kicker {
		font-size: .62rem;
		letter-spacing: .13em;
		padding: .45rem .65rem;
	}

	.directorio-search-panel {
		border-radius: 1.5rem;
		padding: .8rem;
		margin-top: 1.4rem;
	}

	.directorio-search-panel .form-control,
	.directorio-search-panel .form-select,
	.directorio-search-panel .btn {
		min-height: 52px;
		font-size: .94rem;
	}

	.directorio-signal-strip span:nth-child(n+3) {
		display: none;
	}

	.directorio-signal-strip span {
		font-size: .76rem;
		padding: .55rem .7rem;
	}

	.directorio-wrap {
		padding-top: 2rem;
	}

	.directorio-filter-card,
	.directorio-toolbar,
	.directorio-guide-card,
	.directory-doctor-card,
	.directorio-empty-state {
		border-radius: 1.55rem;
	}

	.directorio-guide-card {
		padding: 1.35rem;
	}

	.directorio-guide-card .row > div:not(:first-child) {
		margin-top: .4rem;
	}

	.directory-doctor-photo {
		height: 300px;
		min-height: 300px;
	}

	.directory-doctor-content {
		padding: 1.2rem;
	}

	.directory-doctor-title-row {
		display: block;
	}

	.directory-rating {
		margin-top: .5rem;
	}

	.directory-doctor-name {
		font-size: 1.3rem;
	}

	.directory-decision-grid {
		grid-template-columns: 1fr;
	}

	.directory-doctor-actions {
		flex-direction: column;
	}

	.directory-doctor-actions .btn {
		width: 100%;
	}
}


/* Integración con identidad cargada desde Ajustes */
.valia-brand-image::after { display: none; }
.valia-brand-image img { width: 100%; height: 100%; object-fit: contain; display: block; border-radius: 18px; }

/* ============================================================
   Optimización móvil del directorio
   Objetivo: acceso rápido a búsqueda, filtros colapsados y menos ruido visual
   ============================================================ */

.directorio-mobile-shortcuts,
.directorio-mobile-filter-toggle {
	display: none;
}

@media (max-width: 575.98px) {
	.directorio-hero {
		padding: 5.8rem 0 1.65rem;
	}

	.directorio-hero h1 {
		max-width: 96%;
		font-size: clamp(2rem, 10vw, 2.65rem);
		line-height: .98;
		letter-spacing: -.058em;
	}

	.directorio-hero p {
		max-width: 96%;
		font-size: .95rem;
		line-height: 1.48;
		margin-top: .9rem;
	}

	.directorio-kicker {
		font-size: .58rem;
		letter-spacing: .12em;
		padding: .43rem .62rem;
		margin-bottom: .9rem;
	}

	.directorio-search-panel {
		margin-top: 1.2rem;
		padding: .72rem;
		border-radius: 1.45rem;
		box-shadow: 0 16px 42px rgba(16, 42, 67, .11);
	}

	.directorio-search-panel .row {
		--bs-gutter-y: .65rem;
	}

	.directorio-search-panel .form-control,
	.directorio-search-panel .form-select {
		min-height: 50px;
		border-radius: 1rem;
		font-size: .92rem;
		font-weight: 760;
	}

	.directorio-search-panel .btn {
		min-height: 52px;
		font-size: .94rem;
	}

	.directorio-hero-specialty-field {
		display: none;
	}

	.directorio-mobile-shortcuts {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: .55rem;
		margin-top: .85rem;
	}

	.directorio-mobile-shortcuts a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: .45rem;
		min-height: 44px;
		border-radius: 999px;
		background: rgba(255, 255, 255, .84);
		border: 1px solid rgba(16, 42, 67, .10);
		color: var(--valia-blue, #102A43);
		font-size: .82rem;
		font-weight: 900;
		box-shadow: 0 8px 22px rgba(16, 42, 67, .05);
	}

	.directorio-mobile-shortcuts a i {
		color: var(--valia-green, #164E4A);
	}

	.directorio-signal-strip {
		margin-top: .9rem;
		gap: .45rem;
	}

	.directorio-signal-strip span {
		max-width: 100%;
		font-size: .72rem;
		line-height: 1.15;
		padding: .5rem .66rem;
	}

	.directorio-signal-strip span:nth-child(n+2) {
		display: none;
	}

	.directorio-wrap {
		padding: 1.25rem 0 5.8rem;
	}

	.directorio-mobile-filter-toggle {
		display: block;
		margin-bottom: .9rem;
	}

	.directorio-mobile-filter-toggle .btn {
		min-height: 50px;
		border-radius: 999px;
		font-weight: 900;
		background: rgba(255, 255, 255, .88);
	}

	.directorio-filter-card {
		padding: 1rem;
		margin-bottom: 1rem;
		box-shadow: 0 12px 32px rgba(16, 42, 67, .075);
	}

	.directorio-filter-header {
		align-items: center;
		margin-bottom: .7rem;
	}

	.directorio-filter-header span {
		font-size: .62rem;
		letter-spacing: .12em;
	}

	.directorio-filter-header h2 {
		font-size: 1.15rem;
	}

	.directorio-filter-guide {
		display: none;
	}

	.directorio-filter-group {
		padding: .7rem 0;
	}

	.directorio-filter-card .form-label {
		font-size: .66rem;
		letter-spacing: .11em;
	}

	.directorio-filter-card .form-control,
	.directorio-filter-card .form-select {
		min-height: 48px;
		font-size: .92rem;
	}

	.directorio-filter-note {
		display: none;
	}

	.directorio-toolbar {
		padding: 1rem;
		margin-bottom: 1rem;
	}

	.directorio-toolbar h2 {
		font-size: 1.02rem;
	}

	.directorio-toolbar p,
	.directorio-toolbar-badges {
		display: none;
	}

	.directorio-guide-card {
		display: none;
	}

	.directorio-results-list {
		gap: 1rem;
	}

	/* El botón flotante global ya cumple la acción principal en móvil. */
	.valia-mobile-cta {
		left: 1rem;
		right: 1rem;
		bottom: .85rem;
		min-height: 54px;
		border-radius: 999px;
		font-size: .95rem;
	}
}

/* ============================================================
   Directorio · Ajuste PWA de filtros y navegación móvil
   ============================================================ */
.directorio-filter-card-sticky {
	position: sticky;
	top: 112px;
	overflow: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(22, 78, 74, .35) transparent;
}

.directorio-filter-card-sticky::-webkit-scrollbar {
	width: 8px;
}

.directorio-filter-card-sticky::-webkit-scrollbar-thumb {
	background: rgba(22, 78, 74, .28);
	border-radius: 999px;
}

.directorio-filter-actions {
	display: grid;
	gap: .65rem;
	margin-top: .35rem;
}

.directorio-mobile-shortcuts button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	min-height: 44px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .84);
	border: 1px solid rgba(16, 42, 67, .10);
	color: var(--valia-blue, #102A43);
	font-size: .82rem;
	font-weight: 900;
	box-shadow: 0 8px 22px rgba(16, 42, 67, .05);
}

.directorio-mobile-shortcuts button i {
	color: var(--valia-green, #164E4A);
}

.directorio-filter-sheet {
	--bs-offcanvas-height: min(86vh, 760px);
	border-radius: 28px 28px 0 0;
	border-top: 1px solid rgba(16, 42, 67, .10);
	background:
		radial-gradient(circle at 18% 0%, rgba(184, 137, 91, .12), transparent 34%),
		linear-gradient(180deg, #FDFBF7 0%, #FFFFFF 54%);
	box-shadow: 0 -26px 70px rgba(16, 42, 67, .22);
}

.directorio-filter-sheet::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 50%;
	width: 54px;
	height: 5px;
	border-radius: 999px;
	background: rgba(16, 42, 67, .20);
	transform: translateX(-50%);
}

.directorio-filter-sheet .offcanvas-header {
	align-items: flex-start;
	padding: 1.55rem 1.15rem .8rem;
	border-bottom: 1px solid rgba(16, 42, 67, .08);
}

.directorio-filter-sheet .offcanvas-header h2 {
	margin: .2rem 0 0;
	color: var(--valia-blue, #102A43);
	font-size: 1.35rem;
	font-weight: 900;
	letter-spacing: -.045em;
}

.directorio-sheet-eyebrow {
	display: block;
	font-size: .66rem;
	font-weight: 900;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--valia-muted, #657184);
}

.directorio-filter-sheet .btn-close {
	width: 40px;
	height: 40px;
	border-radius: 999px;
	background-color: rgba(16, 42, 67, .06);
	opacity: 1;
}

.directorio-filter-sheet .offcanvas-body {
	padding: .95rem 1.15rem 1.35rem;
	overflow-y: auto;
}

.directorio-filter-card-sheet {
	position: static;
	border: 0;
	box-shadow: none;
	padding: 0;
	background: transparent;
}

.directorio-mobile-actionbar {
	display: none;
}

@media (min-width: 992px) {
	.directorio-wrap {
		padding-top: 2.6rem;
	}
}

@media (max-width: 575.98px) {
	.directorio-hero {
		padding: 6rem 0 1.55rem;
	}

	.directorio-hero h1 {
		font-size: clamp(2.05rem, 10.2vw, 2.75rem);
		max-width: 94%;
	}

	.directorio-hero p {
		max-width: 94%;
		margin-top: .8rem;
	}

	.directorio-search-panel {
		margin-top: 1.05rem;
	}

	.directorio-mobile-shortcuts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin-top: .72rem;
	}

	.directorio-signal-strip {
		display: none;
	}

	.directorio-wrap {
		padding-top: 1rem;
		padding-bottom: 6.5rem;
	}

	.directorio-toolbar {
		border-radius: 1.35rem;
		padding: .9rem 1rem;
	}

	.directorio-toolbar h2 {
		font-size: 1rem;
		line-height: 1.2;
	}

	.directorio-filter-group-search {
		padding-top: 0;
	}

	.directorio-filter-card .form-control,
	.directorio-filter-card .form-select {
		min-height: 52px;
		border-radius: 1rem;
		font-size: .96rem;
		background: #F8FAFC;
	}

	.directorio-filter-card .form-label {
		font-size: .66rem;
		letter-spacing: .12em;
	}

	.directorio-filter-group {
		padding: .75rem 0;
	}

	.directorio-filter-actions {
		position: sticky;
		bottom: 0;
		z-index: 2;
		background: linear-gradient(180deg, rgba(255, 255, 255, .60), #fff 42%);
		padding-top: .85rem;
		padding-bottom: .35rem;
	}

	.directorio-mobile-actionbar {
		position: fixed;
		left: .85rem;
		right: .85rem;
		bottom: .75rem;
		z-index: 1035;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: .65rem;
		padding: .45rem;
		border-radius: 999px;
		background: rgba(255, 255, 255, .88);
		border: 1px solid rgba(16, 42, 67, .10);
		box-shadow: 0 18px 40px rgba(16, 42, 67, .18);
		backdrop-filter: blur(18px);
	}

	.directorio-mobile-actionbar a,
	.directorio-mobile-actionbar button {
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: .45rem;
		min-height: 48px;
		border-radius: 999px;
		border: 0;
		font-size: .92rem;
		font-weight: 900;
	}

	.directorio-mobile-actionbar .directorio-action-search {
		color: #fff;
		background: var(--valia-green, #164E4A);
		box-shadow: 0 12px 28px rgba(22, 78, 74, .26);
	}

	.directorio-mobile-actionbar button {
		color: var(--valia-blue, #102A43);
		background: rgba(16, 42, 67, .06);
	}

	.directorio-mobile-actionbar button span {
		position: absolute;
		top: -4px;
		right: 14px;
		width: 19px;
		height: 19px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border-radius: 999px;
		font-size: .68rem;
		font-weight: 900;
		color: #fff;
		background: var(--valia-bronze, #B8895B);
	}

	/* En el directorio reemplazamos el CTA global por la barra PWA de búsqueda/filtros. */
	.valia-mobile-cta {
		display: none !important;
	}
}

/* ============================================================
   Valia · Directorio v5
   Corrección final: sticky limpio, Select2 premium y acción móvil no duplicada
   ============================================================ */

/* Sticky correcto: el sticky vive en el wrapper, no en la tarjeta. */
.directorio-filter-column {
	align-self: stretch;
}

.directorio-layout-row {
	align-items: flex-start !important;
}

.directorio-filter-shell {
	position: sticky;
	top: 112px;
	align-self: flex-start;
	z-index: 4;
}

.directorio-filter-shell .directorio-filter-card {
	position: relative !important;
	top: auto !important;
	max-height: none !important;
	overflow: visible !important;
}

/* Desactiva el estilo anterior que generaba scroll interno tipo “babosa”. */
.directorio-filter-card-sticky,
.directorio-filter-card.is-desktop-sticky {
	position: relative !important;
	top: auto !important;
	max-height: none !important;
	overflow: visible !important;
}

@media (min-width: 992px) {
	.directorio-filter-card {
		position: relative !important;
		top: auto !important;
		max-height: none !important;
		overflow: visible !important;
	}
}

/* Select2 · integración visual premium Valia */
.select2-container {
	width: 100% !important;
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

.select2-container--default .select2-selection--single {
	min-height: 50px;
	border-radius: 1rem;
	border: 1px solid rgba(16, 42, 67, .10);
	background: #F8FAFC;
	display: flex;
	align-items: center;
	font-weight: 760;
	color: var(--valia-graphite, #20242A);
}

.directorio-search-panel .select2-container--default .select2-selection--single {
	min-height: 58px;
	border: 0;
	border-radius: 1.2rem;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	padding-left: 1rem;
	padding-right: 2.4rem;
	color: var(--valia-graphite, #20242A);
	line-height: 1.25;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
	color: rgba(32, 36, 42, .72);
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 100%;	right: .75rem;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
	border-color: rgba(22, 78, 74, .28);
	box-shadow: 0 0 0 .22rem rgba(22, 78, 74, .11);
}

.select2-dropdown {
	border: 1px solid rgba(16, 42, 67, .12);
	border-radius: 1rem;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(16, 42, 67, .16);
}

.select2-search--dropdown {
	padding: .75rem;
	background: #FDFBF7;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
	border: 1px solid rgba(16, 42, 67, .12);
	border-radius: .85rem;
	min-height: 42px;
	padding: .45rem .75rem;
	font-weight: 720;
}

.select2-results__option {
	padding: .75rem .9rem;
	font-weight: 720;
	color: var(--valia-graphite, #20242A);
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
	background: var(--valia-green, #164E4A);
	color: #fff;
}

.select2-container--default .select2-results__option--selected {
	background: rgba(47, 125, 109, .10);
	color: var(--valia-green, #164E4A);
}

.select2-container--default .select2-selection--single .select2-selection__clear {
	margin-right: 1.8rem;
	font-weight: 900;
	color: var(--valia-muted, #657184);
}

/* Barra móvil: oculta por defecto; aparece solo cuando el hero sale de pantalla. */
.directorio-mobile-actionbar {
	display: none;
}

@media (max-width: 575.98px) {
	.directorio-mobile-actionbar {
		position: fixed;
		left: .85rem;
		right: .85rem;
		bottom: .75rem;
		z-index: 1035;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: .65rem;
		padding: .45rem;
		border-radius: 999px;
		background: rgba(255, 255, 255, .88);
		border: 1px solid rgba(16, 42, 67, .10);
		box-shadow: 0 18px 40px rgba(16, 42, 67, .18);
		backdrop-filter: blur(18px);
		transform: translateY(125%);
		opacity: 0;
		pointer-events: none;
		transition: transform .24s ease, opacity .24s ease;
	}

	.directorio-mobile-actionbar.is-visible {
		transform: translateY(0);
		opacity: 1;
		pointer-events: auto;
	}

	.directorio-mobile-actionbar a,
	.directorio-mobile-actionbar button {
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: .45rem;
		min-height: 48px;
		border-radius: 999px;
		border: 0;
		font-size: .92rem;
		font-weight: 900;
	}

	.directorio-mobile-actionbar .directorio-action-search {
		color: #fff;
		background: var(--valia-green, #164E4A);
		box-shadow: 0 12px 28px rgba(22, 78, 74, .26);
	}

	.directorio-mobile-actionbar button {
		color: var(--valia-blue, #102A43);
		background: rgba(16, 42, 67, .06);
	}

	.directorio-mobile-actionbar button span {
		position: absolute;
		top: -4px;
		right: 14px;
		width: 19px;
		height: 19px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border-radius: 999px;
		font-size: .68rem;
		font-weight: 900;
		color: #fff;
		background: var(--valia-bronze, #B8895B);
	}

	.directorio-filter-sheet .select2-container--default .select2-selection--single,
	.directorio-search-panel .select2-container--default .select2-selection--single {
		min-height: 52px;
		border-radius: 1rem;
	}

	.directorio-filter-sheet .select2-dropdown {
		border-radius: 1rem;
	}
}