/* Vemedic: cabecera y menú lateral */

.elementor-location-header {
	position: relative;
	z-index: 10;
}

/* Menú lateral */

.e-off-canvas__content {
	border-radius: 15px 0 0 15px;
	box-shadow: none !important;
}

.e-off-canvas__content > .e-con {
	padding: 0 !important;
}

.admin-bar .elementor-widget-off-canvas .e-off-canvas {
	top: var(--wp-admin--admin-bar--height, 32px);
	height: calc(100% - var(--wp-admin--admin-bar--height, 32px));
}

.admin-bar .e-off-canvas__content {
	height: 100% !important;
}

.admin-bar .e-off-canvas__content > .e-con > .elementor-element {
	min-height: calc(100vh - var(--wp-admin--admin-bar--height, 32px));
}

@media (max-width: 743px) {
	.e-off-canvas__content {
		border-radius: 0;
	}
}

html:has(.e-off-canvas[aria-hidden="false"]),
body:has(.e-off-canvas[aria-hidden="false"]) {
	overflow: hidden;
}

body:has(.e-off-canvas[aria-hidden="false"]) .amo-button-holder {
	display: none !important;
}

/* Pantallas bajas: el Figma dibuja el menú con 780 px de alto; si no cabe, se reducen los espacios */

@media (max-height: 800px) {
	.e-off-canvas .item-menu {
		padding-top: 10px !important;
		padding-bottom: 10px !important;
	}

	.e-off-canvas .etiqueta-menu {
		margin-top: 18px !important;
	}
}

@media (max-height: 730px) {
	.e-off-canvas__content > .e-con > .elementor-element {
		padding-top: 15px !important;
		padding-bottom: 15px !important;
	}

	.e-off-canvas .item-menu {
		padding-top: 6px !important;
		padding-bottom: 6px !important;
	}

	.e-off-canvas .etiqueta-menu {
		margin-top: 12px !important;
	}
}

/* Paneles: en la página se ve uno a la vez; en el editor, todos */

body:not(.elementor-editor-active) .e-off-canvas__content > .e-con > .elementor-element[hidden],
body:not(.elementor-editor-active) .e-off-canvas__content > .e-con > .elementor-element:not(:first-child):not(.vm-activo) {
	display: none !important;
}

.elementor-editor-active .e-off-canvas__content > .e-con > .elementor-element + .elementor-element {
	border-top: 2px dashed #8B929F;
}

.elementor-editor-active .e-off-canvas__content > .e-con > .elementor-element + .elementor-element::before {
	content: "Panel de submenú";
	display: block;
	padding: 6px 15px;
	font: 12px/1.5 "Poppins", sans-serif;
	color: #515B6F;
	background: #F1F2F3;
}

/* Iconos */

.item-menu[href*="#vm-panel-"] > span:last-child {
	position: relative;
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	overflow: hidden;
	font-size: 0;
	line-height: 0;
}

.item-menu[href*="#vm-panel-"] > span:last-child::before,
.item-menu[href*="#vm-panel-"] > span:last-child::after {
	content: "";
	position: absolute;
	inset: 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill='%2317243F' d='M6.01875 16.5L4.6875 15.1688L10.8563 9L4.6875 2.83125L6.01875 1.5L13.5188 9L6.01875 16.5Z'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
	transition: transform 0.2s ease-in-out;
}

.item-menu[href*="#vm-panel-"] > span:last-child::after {
	transform: translateX(-18px);
}

.item-menu[href*="#vm-panel-"]:hover > span:last-child::before,
.item-menu[href*="#vm-panel-"]:focus-visible > span:last-child::before {
	transform: translateX(18px);
}

.item-menu[href*="#vm-panel-"]:hover > span:last-child::after,
.item-menu[href*="#vm-panel-"]:focus-visible > span:last-child::after {
	transform: translateX(0);
}

.e-off-canvas a[href*="off_canvas%3Aclose"] {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 2px 0;
	border-radius: 22px;
}

.e-off-canvas a[href*="off_canvas%3Aclose"]::after {
	content: "";
	width: 19px;
	height: 19px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2317243F' d='M6.4 19 5 17.6l5.6-5.6L5 6.4 6.4 5l5.6 5.6L17.6 5 19 6.4 13.4 12l5.6 5.6-1.4 1.4-5.6-5.6z'/%3E%3C/svg%3E") center / 19px 19px no-repeat;
}

.e-off-canvas a[href$="#vm-panel-0"] {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.e-off-canvas a[href$="#vm-panel-0"]::before {
	content: "";
	width: 18px;
	height: 18px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2317243F' d='M16 22 6 12 16 2l1.775 1.775L9.55 12l8.225 8.225z'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
}

/* Home */

.titulo-acento span {
	font-weight: 600;
	color: #3AAFA9;
}

/* Valoración de Google: en pantallas de menos de 375 px no cabe a 14 px */
@media (max-width: 374px) {
	.valoracion-google {
		gap: 4px !important;
		padding: 2px 8px !important;
	}

	.valoracion-google > span {
		font-size: 12px !important;
	}

	.valoracion-google > .e-con {
		margin-left: -4px !important;
	}

	.valoracion-google > .e-con .e-svg-base {
		width: 10px !important;
		height: 11px !important;
	}

	.valoracion-google > .e-svg-base {
		width: 16px !important;
		height: 16px !important;
	}
}

/* Tarjetas con cuadrícula y grano (Figma: líneas de 0,55 px y efecto "rUIDO") */
.tarjeta-textura,
.tarjeta-textura-clara {
	isolation: isolate;
	--linea: rgba(255, 255, 255, 0.08);
	--foco: 85% 0%;
}

.tarjeta-textura-clara {
	--linea: rgba(23, 36, 63, 0.08);
	--foco: 0% 0%;
}

.tarjeta-textura::before,
.tarjeta-textura-clara::before,
.tarjeta-textura::after,
.tarjeta-textura-clara::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
}

.tarjeta-textura::before,
.tarjeta-textura-clara::before {
	background-image:
		linear-gradient(var(--linea) 1px, transparent 1px),
		linear-gradient(90deg, var(--linea) 1px, transparent 1px);
	background-size: 29px 29px;
	-webkit-mask-image: radial-gradient(circle at var(--foco), #000 0, transparent 60%);
	mask-image: radial-gradient(circle at var(--foco), #000 0, transparent 60%);
}

.tarjeta-textura::after,
.tarjeta-textura-clara::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='r'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23r)'/%3E%3C/svg%3E");
	opacity: 0.1;
}

/* Servicios: filtro (widget Pestañas de Elementor), carrusel y tarjetas */

.servicios-pestana-nativa[aria-selected="true"] {
	background-color: #FFFFFF !important;
	border-color: #8B929F !important;
	color: #17243F !important;
}

.servicios-pestana-nativa {
	flex: none !important;
}

.servicios-filtro [role="tablist"] {
	scrollbar-width: none;
}

.servicios-carrusel {
	overflow-x: auto;
	scrollbar-width: none;
	cursor: grab;
}

.servicios-carrusel.arrastrando {
	cursor: grabbing;
	user-select: none;
}

.servicios-carrusel::-webkit-scrollbar {
	display: none;
}

.servicios-carrusel > .e-con {
	width: max-content !important;
	min-width: max-content !important;
}

.servicios-carrusel > .e-con > * {
	flex: 0 0 200px !important;
}

/* La flecha (oculta hasta el hover) no debe quitar ancho al nombre del estudio */
.tarjeta-servicio {
	position: relative;
}

.tarjeta-servicio .ts-flecha {
	position: absolute;
	top: 15px;
	right: 15px;
}

.tarjeta-servicio > :first-child > :first-child {
	min-height: 24px;
}

.tarjeta-servicio strong {
	font-weight: 600;
}

/* Tablet y móvil: tarjetas de 170, sin hover, texto azul marino (Figma "Frame 279") */
@media (max-width: 1024px) {
	.servicios-carrusel > .e-con > * {
		flex: 0 0 170px !important;
		height: auto !important;
		padding: 0 !important;
	}

	.tarjeta-servicio {
		width: 170px !important;
		height: auto !important;
		justify-content: flex-start !important;
		gap: 40px !important;
	}

	.tarjeta-servicio > :first-child {
		gap: 25px !important;
	}

	.tarjeta-servicio * {
		color: #17243F !important;
	}
}

.tarjeta-servicio:hover,
a:focus-visible > .tarjeta-servicio {
	transform: translateY(-10px);
	background-color: #92DACF !important;
}

.tarjeta-servicio:hover *,
a:focus-visible > .tarjeta-servicio * {
	color: #17243F !important;
}

.tarjeta-servicio:hover .ts-flecha,
a:focus-visible > .tarjeta-servicio .ts-flecha {
	opacity: 1 !important;
}

/* Por qué elegirnos: autor (widget Author Box) con las medidas del Figma "Frame 171" */
.elementor-author-box__avatar {
	margin: 0 18px 0 0;
	line-height: 0;
}

.elementor-author-box__name {
	margin: 0;
	font-family: Poppins, sans-serif;
	font-size: 18px;
	line-height: 22px;
	font-weight: 500;
	color: #17243F;
}

.elementor-author-box__bio,
.elementor-author-box__bio p {
	margin: 0;
	font-family: Poppins, sans-serif;
	font-size: 16px;
	line-height: 18px;
	color: #515B6F;
}

/* Testimonios: carrusel que se desliza (dedo o arrastrando con el ratón) y puntos de 12 px,
   uno por posición (Figma "Frame 87": activo turquesa, resto aqua, separación 10) */

.testimonios-carrusel {
	overflow-x: auto;
	scrollbar-width: none;
	scroll-snap-type: x mandatory;
}

.testimonios-carrusel > .elementor-element {
	scroll-snap-align: start;
}

.testimonios-carrusel.arrastrando {
	cursor: grabbing;
	user-select: none;
	scroll-snap-type: none;
}

.testimonios-carrusel::-webkit-scrollbar {
	display: none;
}

.testimonios-puntos {
	width: auto !important;
	gap: 10px;
}

.testimonios-punto {
	width: 12px;
	height: 12px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #DEF2F1;
	cursor: pointer;
	transition: background-color 0.2s;
}

.testimonios-punto.activo,
.testimonios-punto:hover {
	background: #3AAFA9;
}

.testimonios-punto:focus-visible {
	outline: 2px solid #17243F;
	outline-offset: 2px;
}

@media (max-width: 743px) {
	.testimonios-puntos {
		display: none !important;
	}
}

/* Cómo funciona: en escritorio se abre la tarjeta pulsada (Figma: Smart animate, 200 ms);
   en tablet y móvil las tres están abiertas y se deslizan */

.como-paso {
	cursor: pointer;
	transition: flex-basis 0.2s ease-in-out;
}

.como-paso::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.2s ease-in-out;
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
	background-size: 29px 29px;
	-webkit-mask-image: radial-gradient(circle at 100% 0%, #000 0, transparent 60%);
	mask-image: radial-gradient(circle at 100% 0%, #000 0, transparent 60%);
}

.como-ilustracion {
	transition: top 0.2s ease-in-out, left 0.2s ease-in-out, width 0.2s ease-in-out, height 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

@media (min-width: 1025px) {
	.como-paso:not(.abierta) .como-descripcion {
		display: none;
	}

	.como-paso.abierta {
		flex-basis: 462px !important;
		cursor: default;
		background-image: linear-gradient(0deg, #2B7A78, #92DACF) !important;
	}

	.como-paso.abierta::before {
		opacity: 1;
	}

	.como-paso.abierta .como-textos {
		padding-left: 32px !important;
	}

	.como-paso:nth-child(3).abierta .como-textos {
		padding-left: 22px !important;
	}

	.como-paso.abierta .como-numero {
		color: #17243F !important;
	}

	.como-paso.abierta .como-titulo {
		max-width: 408px !important;
		font-size: 30px !important;
		line-height: 30px !important;
		color: #17243F !important;
	}

	.como-paso:nth-child(2).abierta .como-ilustracion {
		top: 219px !important;
		left: 72px !important;
	}

	.como-paso:nth-child(3).abierta .como-ilustracion {
		width: 520px !important;
		height: 293px !important;
		top: 172px !important;
		left: -30px !important;
		opacity: 1 !important;
	}
}

@media (max-width: 1024px) {
	.como-pasos {
		overflow-x: auto;
		scrollbar-width: none;
	}

	.como-pasos::-webkit-scrollbar {
		display: none;
	}

	.como-paso {
		cursor: auto;
	}

	.como-paso::before {
		opacity: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.como-paso,
	.como-paso::before,
	.como-ilustracion {
		transition: none;
	}
}

/* Blog: al pasar el ratón la tarjeta sube 18 px y aparece la flecha (Figma: "tarjetas blog", estado Hover) */

.blog-articulo {
	transition: transform 0.2s ease-in-out;
}

.blog-articulo:hover,
.blog-articulo:focus-visible {
	transform: translateY(-18px);
}

.blog-flecha,
.blog-degradado {
	transition: opacity 0.2s ease-in-out;
}

.blog-articulo:hover .blog-flecha,
.blog-articulo:focus-visible .blog-flecha {
	opacity: 1 !important;
}

.blog-articulo:hover .blog-degradado,
.blog-articulo:focus-visible .blog-degradado {
	opacity: 0;
}

.blog-entradas > .e-con {
	scrollbar-width: none;
}

.blog-entradas > .e-con::-webkit-scrollbar {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.blog-articulo,
	.blog-flecha,
	.blog-degradado {
		transition: none;
	}
}

/* Botón de contorno (Figma "Boton principal" Outlined): en hover el borde pasa de 1 a 2 px por fuera */

.boton-contorno {
	transition: box-shadow 0.2s ease-in-out;
}

.boton-contorno:hover,
.boton-contorno:focus-visible {
	box-shadow: 0 0 0 1px #8B929F;
}

@media (prefers-reduced-motion: reduce) {
	.boton-contorno {
		transition: none;
	}
}

/* Enlaces dentro de los textos de sección y las notas (Figma: turquesa subrayado) */

.seccion-texto a,
.seccion-nota a {
	color: #3AAFA9;
	text-decoration: underline;
}

/* Tomografía: tarjetas de sedes (Figma "tarjetas ubicaciones"). En escritorio, al pasar el ratón la tarjeta sube 18 px, entra la flecha y el botón se rellena */

.sede-titulo span {
	color: #3AAFA9;
}

.tarjeta-sede,
.tarjeta-sede .sede-flecha svg,
.tarjeta-sede .boton-cita {
	transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.tarjeta-sede .sede-flecha svg {
	transform: translate(-24px, 24px);
}

.e-con:has(> .tarjeta-sede) {
	scrollbar-width: none;
}

.e-con:has(> .tarjeta-sede)::-webkit-scrollbar {
	display: none;
}

@media (min-width: 1025px) {
	.tarjeta-sede:hover {
		transform: translateY(-18px);
	}

	.tarjeta-sede:hover .sede-flecha svg {
		transform: none;
	}

	.tarjeta-sede:hover .boton-cita {
		border-color: #92DACF;
		background-color: #92DACF;
		box-shadow: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tarjeta-sede,
	.tarjeta-sede .sede-flecha svg,
	.tarjeta-sede .boton-cita {
		transition: none;
	}
}

/* Pie: el enlace del logo no debe contar como hueco cuando el logo está oculto */

.pie a:has(> img) {
	display: contents !important;
}

/* Pie: en móvil cada grupo es un desplegable */

@media (max-width: 743px) {
	.pie-titulo {
		display: flex;
		justify-content: space-between;
		align-items: center;
		cursor: pointer;
	}

	.pie-titulo::after {
		content: "";
		flex-shrink: 0;
		width: 24px;
		height: 24px;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23FBFAF5' d='M6.23 20.23 8 22l10-10L8 2 6.23 3.77 14.46 12z'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
		transform: rotate(90deg);
		transition: transform 0.2s ease-in-out;
	}

	.pie-grupo.abierto .pie-titulo::after {
		transform: rotate(-90deg);
	}

	.pie-grupo:not(.abierto) .pie-lista {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.item-menu[href*="#vm-panel-"] > span:last-child::before,
	.item-menu[href*="#vm-panel-"] > span:last-child::after,
	.pie-titulo::after {
		transition: none;
	}
}

/* Scroll suave (Lenis): reglas de su hoja de estilos */

html.lenis,
html.lenis body {
	height: auto;
}

.lenis:not(.lenis-autoToggle).lenis-stopped {
	overflow: clip;
}

.lenis.lenis-smooth iframe {
	pointer-events: none;
}