/* Estilos propios del tema (no generados por Lovable) */

.cav-dot {
	height: 2px;
	width: 20px;
	background-color: rgba(255, 255, 255, 0.2);
	transition: all 0.4s ease;
	border: 0;
	cursor: pointer;
}
.cav-dot-active {
	width: 48px;
	background-color: #4fb3c7; /* turquoise */
}

/* En la sección de testimonios (fondo claro) los puntos deben ser oscuros */
.bg-bone .cav-dot {
	background-color: rgba(10, 22, 40, 0.15);
}
.bg-bone .cav-dot-active {
	background-color: #b08d57; /* gold */
}

#cavelier-mobile-menu.hidden {
	display: none;
}
#cavelier-mobile-menu.flex {
	display: flex;
}

.prose-cavelier :where(p):not(:last-child) {
	margin-bottom: 1.25rem;
}

@keyframes cav-twinkle-kf {
	0%, 100% { opacity: 0.3; transform: scale(0.85); }
	50% { opacity: 1; transform: scale(1); }
}
.cav-twinkle {
	animation-name: cav-twinkle-kf;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}

/* --- Escenario 3D de "Trayectoria" (home) --- */
.cav-fs-stage {
	overflow: visible;
}
.cav-fs-card {
	transition: transform 0.9s cubic-bezier(0.65,0,0.35,1), opacity 0.9s cubic-bezier(0.65,0,0.35,1);
	cursor: pointer;
}
.cav-fs-card.cav-fs-active {
	cursor: default;
}
.cav-fs-card-shadow {
	box-shadow: 0 20px 60px -30px rgba(0,0,0,0.4);
	transition: box-shadow 0.9s ease;
}
.cav-fs-card.cav-fs-active .cav-fs-card-shadow {
	box-shadow: 0 50px 100px -40px rgba(0,0,0,0.7);
	outline: 1px solid rgba(255,255,255,0.1);
}

.cav-fs-counter-num { font-variant-numeric: tabular-nums; }

/* Imagen de fondo de las tarjetas 1 y 2: zoom lento hacia dentro cuando la tarjeta está activa */
.cav-fs-card-img {
	transform: scale(1.08) translateX(0);
	transition: transform 10s linear;
}
.cav-fs-card.cav-fs-active .cav-fs-card-img {
	transform: scale(1.0) translateX(-14px);
}

/* Insignias de la tarjeta "Reconocimientos": aparecen escalonadas al activarse */
.cav-fs-badge {
	opacity: 0;
	transform: translateY(12px);
	transition-property: opacity, transform;
	transition-duration: 0.9s;
	transition-timing-function: cubic-bezier(0.22,1,0.36,1);
	/* transition-delay se define inline por insignia (ver front-page.php); al usar
	   propiedades separadas (no el shorthand "transition") no se sobreescribe. */
}
.cav-fs-card.cav-fs-active .cav-fs-badge {
	opacity: 1;
	transform: translateY(0);
}

/* Puntos del mapa mundial: aparecen y laten solo cuando la tarjeta está activa */
.cav-hub-dot {
	opacity: 0;
	transition-property: opacity;
	transition-duration: 0.6s;
	transition-timing-function: ease-out;
}
.cav-fs-card.cav-fs-active .cav-hub-dot {
	opacity: 1;
}
.cav-hub-ring {
	opacity: 0;
	transform-origin: center;
	transform-box: fill-box;
}
.cav-fs-card.cav-fs-active .cav-hub-ring {
	animation-name: cav-hub-pulse-kf;
	animation-duration: 2.4s;
	animation-timing-function: ease-out;
	animation-iteration-count: infinite;
	/* animation-delay se define inline por punto (ver front-page.php), y al usar
	   propiedades por separado (no el shorthand "animation") no se sobreescribe. */
}
@keyframes cav-hub-pulse-kf {
	0% { opacity: 0.6; transform: scale(1); }
	100% { opacity: 0; transform: scale(3.4); }
}

/* --- Hero de la portada: animaciones de entrada --- */
@keyframes cav-hero-logo-kf {
	from { opacity: 0; transform: translateY(30px); }
	to { opacity: 1; transform: translateY(0); }
}
.cav-hero-logo {
	opacity: 0;
	animation: cav-hero-logo-kf 1s ease-out 0.4s forwards;
}

@keyframes cav-hero-fade-kf {
	from { opacity: 0; }
	to { opacity: 1; }
}
.cav-hero-scroll {
	opacity: 0;
	animation: cav-hero-fade-kf 1s ease-out 1.6s forwards;
}

/* --- Contador "01/04" de Trayectoria: crossfade al cambiar de tarjeta --- */
.cav-fs-counter {
	display: inline-block;
	transition: opacity 0.25s ease, transform 0.25s ease;
}
.cav-fs-counter.cav-fs-counter-fading {
	opacity: 0;
	transform: translateY(-4px);
}

/* --- Testimonios: tarjeta de cita con crossfade + desplazamiento vertical --- */
.cav-testi-quote {
	opacity: 0;
	--tw-translate-y: 12px;
	transition: opacity 0.9s cubic-bezier(0.22,1,0.36,1), translate 0.9s cubic-bezier(0.22,1,0.36,1);
	z-index: 10;
	pointer-events: none;
}
.cav-testi-quote.cav-testi-active {
	opacity: 1;
	--tw-translate-y: 0px;
	z-index: 20;
	pointer-events: auto;
}

.cav-testi-counter {
	display: inline-block;
	transition: opacity 0.25s ease, transform 0.25s ease;
}
.cav-testi-counter.cav-testi-counter-fading {
	opacity: 0;
	transform: translateY(-4px);
}

/* Imagen de testimonios: crossfade + zoom lento (salvo la 3ª, que usa otro encuadre fijo) */
.cav-testi-image {
	opacity: 0;
	transition: opacity 1.4s ease-in-out;
	z-index: 1;
}
.cav-testi-image.cav-testi-active {
	opacity: 1;
	z-index: 2;
}
.cav-testi-image-img {
	transform: scale(1);
	transition: transform 10s linear;
}
.cav-testi-image[data-index="0"].cav-testi-active .cav-testi-image-img,
.cav-testi-image[data-index="1"].cav-testi-active .cav-testi-image-img {
	transform: scale(1.04);
}

/* ==========================================================================
 * Publicaciones: rediseño de filtros y listado (animaciones + hover)
 * ========================================================================== */

/* --- Buscador --- */
.cav-pub-search-wrap { transition: transform 0.3s ease; }
.cav-pub-search-input {
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.cav-pub-search-input:focus {
	border-color: var(--turquoise);
	box-shadow: 0 0 0 3px rgba(0, 166, 179, 0.12);
}
.cav-pub-search-icon { transition: color 0.3s ease; }
.cav-pub-search-input:focus ~ .cav-pub-search-icon { color: var(--turquoise); }

/* --- Botón "Suscríbete" del hero --- */
.cav-pub-subscribe { transition: background-color 0.35s ease, color 0.35s ease; }
.cav-pub-subscribe:hover { background-color: var(--gold); color: var(--navy); }
.cav-pub-subscribe-arrow { display: inline-block; transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); }
.cav-pub-subscribe:hover .cav-pub-subscribe-arrow { transform: translateX(4px); }

/* --- Panel de filtros móvil: apertura/cierre suave --- */
.cav-pub-filters-body {
	overflow: hidden;
	max-height: 2000px;
	opacity: 1;
	transition: max-height 0.5s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.35s ease, margin 0.5s ease;
}
.cav-pub-filters-body.cav-pub-collapsed {
	max-height: 0;
	opacity: 0;
	pointer-events: none;
}
.cav-pub-chevron.cav-pub-chevron-open { transform: rotate(180deg); }
.cav-pub-filters-toggle { transition: border-color 0.3s ease, color 0.3s ease; }
.cav-pub-filters-toggle:hover { border-color: var(--turquoise); color: var(--turquoise); }
.cav-pub-filters-badge { animation: cav-pub-pop-kf 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); }
@keyframes cav-pub-pop-kf {
	from { transform: scale(0); }
	to { transform: scale(1); }
}

/* --- Contador de resultados: fade suave al cambiar --- */
.cav-pub-results-count { transition: opacity 0.25s ease; }
.cav-pub-results-count.cav-pub-fading { opacity: 0; }

/* --- Tarjetas de publicaciones: hover elegante + entrada escalonada --- */
.cav-pub-item {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.5s ease, transform 0.5s ease, border-color 0.4s ease, box-shadow 0.4s ease, translate 0.4s ease;
}
.cav-pub-item.cav-pub-visible {
	opacity: 1;
	transform: translateY(0);
}
.cav-pub-item:hover {
	border-color: rgba(0, 166, 179, 0.35);
	box-shadow: 0 24px 48px -28px rgba(41, 45, 57, 0.28);
	translate: 0 -3px;
}
.cav-pub-item-accent {
	width: 0;
	transition: width 0.4s cubic-bezier(0.65, 0, 0.35, 1);
}
.cav-pub-item:hover .cav-pub-item-accent { width: 4px; }
.cav-pub-item-number { transition: color 0.4s ease; }
.cav-pub-item:hover .cav-pub-item-number { color: var(--turquoise); }
.cav-pub-item-title { transition: color 0.35s ease; }
.cav-pub-item:hover .cav-pub-item-title { color: var(--turquoise); }
.cav-pub-item-arrow { display: inline-block; transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); }
.cav-pub-item:hover .cav-pub-item-arrow { transform: translateX(5px); }

@media (prefers-reduced-motion: reduce) {
	.cav-pub-item, .cav-pub-item-accent, .cav-pub-checkbox-tick, .cav-pub-tipo-thumb {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}

/* --- Industrias (listado): tarjetas en cuadrícula --- */
.cav-ind-card-img {
	transition: transform 0.9s ease-out;
}
.cav-ind-card:hover .cav-ind-card-img {
	transform: scale(1.1);
}
.cav-ind-card-arrow {
	display: inline-block;
	transition: transform 0.3s ease;
}
.cav-ind-card:hover .cav-ind-card-arrow {
	transform: translateX(4px);
}
.cav-ind-card {
	transition: transform 0.5s ease, box-shadow 0.5s ease;
}
.cav-ind-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 26px 46px -28px rgba(0, 0, 0, 0.6);
}

@media (prefers-reduced-motion: reduce) {
	.cav-ind-card, .cav-ind-card-img, .cav-ind-card-arrow {
		transition-duration: 0.01ms !important;
	}
}

/* --- La Firma: globo terráqueo animado (Presencia global) --- */
.cav-globe-wrap {
	user-select: none;
}
#cav-globo {
	overflow: visible;
}




/* --- Publicaciones: buscador (fondo claro) --- */
.cav-pub-search-input {
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.cav-pub-search-input:focus {
	border-color: var(--turquoise);
	box-shadow: 0 0 0 3px rgba(0, 166, 179, 0.12);
}

/* ==========================================================================
 * RSE & Pro-Bono: animaciones e interacción
 * ========================================================================== */

/* --- Cifras clave: se elevan y realzan al pasar el cursor --- */
.cav-rse-figure {
	transition: background-color 0.4s ease, transform 0.4s ease, box-shadow 0.4s ease;
}
.cav-rse-figure:hover {
	transform: translateY(-4px);
	box-shadow: 0 22px 40px -26px rgba(41, 45, 57, 0.4);
	z-index: 1;
	position: relative;
}
.cav-rse-figure-num {
	transition: color 0.4s ease;
}
.cav-rse-figure:hover .cav-rse-figure-num {
	color: var(--turquoise);
}

/* --- Botón de la Asociación --- */
.cav-rse-cta {
	position: relative;
	overflow: hidden;
	transition: color 0.35s ease, transform 0.35s ease, box-shadow 0.35s ease;
}
.cav-rse-cta:before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: var(--gold);
	transform: translateX(-101%);
	transition: transform 0.45s cubic-bezier(0.65, 0, 0.35, 1);
}
.cav-rse-cta:hover:before {
	transform: translateX(0);
}
.cav-rse-cta:hover {
	color: var(--navy);
	transform: translateY(-2px);
	box-shadow: 0 18px 34px -22px rgba(41, 45, 57, 0.55);
}
.cav-rse-cta > * {
	position: relative;
	z-index: 1;
}
.cav-rse-cta-arrow {
	display: inline-block;
	transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.cav-rse-cta:hover .cav-rse-cta-arrow {
	transform: translateX(5px);
}

/* --- Tarjetas de programas Pro Bono --- */
.cav-probono-card {
	transition: border-color 0.45s ease, transform 0.45s ease, box-shadow 0.45s ease;
}
.cav-probono-card:hover {
	border-color: rgba(201, 163, 74, 0.45);
	transform: translateY(-4px);
	box-shadow: 0 28px 52px -30px rgba(0, 0, 0, 0.6);
}
.cav-probono-accent {
	width: 0;
	transition: width 0.45s cubic-bezier(0.65, 0, 0.35, 1);
}
.cav-probono-card:hover .cav-probono-accent {
	width: 4px;
}
.cav-probono-title {
	transition: color 0.4s ease;
}
.cav-probono-card:hover .cav-probono-title {
	color: var(--gold);
}

@media (prefers-reduced-motion: reduce) {
	.cav-rse-figure, .cav-rse-cta, .cav-probono-card, .cav-probono-accent {
		transition-duration: 0.01ms !important;
	}
}

/* --- Áreas de práctica: descripción de la tarjeta al pasar el cursor --- */
.cav-area-tagline {
	transition: color 0.5s ease;
}
.group:hover .cav-area-tagline {
	color: color-mix(in oklab, var(--bone) 75%, transparent);
}

/* --- Pro Bono sobre fondo claro --- */
.cav-probono-card-light:hover {
	border-color: rgba(201, 163, 74, 0.55);
	box-shadow: 0 26px 46px -30px rgba(41, 45, 57, 0.4);
}
.cav-probono-card-light:hover .cav-probono-title {
	color: var(--gold);
}

/* --- Botón de la Asociación sobre la banda oscura de Misión --- */
.cav-rse-cta-onDark:hover {
	color: #292d39;
	box-shadow: 0 18px 34px -20px rgba(0, 0, 0, 0.6);
}

/* ==========================================================================
 * Heroes de páginas internas: 30px extra de aire arriba
 * (la portada queda intacta: allí el hero ocupa toda la pantalla)
 * Cada clase corresponde al padding base que ya tenía la sección + 30px.
 * ========================================================================== */
.cav-hero-pt-32  { padding-top: 158px; }   /* base: pt-32  (128px) */
.cav-hero-pt-40  { padding-top: 190px; }   /* base: pt-40  (160px) */
.cav-hero-pt-24m { padding-top: 126px; }   /* base: pt-24 md:pt-32 */
.cav-hero-pt-32m { padding-top: 158px; }   /* base: pt-32 md:pt-40 */
.cav-hero-pt-28m { padding-top: 142px; }   /* base: pt-28 md:pt-32 */

@media (min-width: 768px) {
	.cav-hero-pt-24m { padding-top: 158px; }
	.cav-hero-pt-32m { padding-top: 190px; }
	.cav-hero-pt-28m { padding-top: 158px; }
}
.cav-hero-pt-28p { padding-top: 142px; }   /* base: py-28 md:py-36 (plantilla de página genérica) */
@media (min-width: 768px) {
	.cav-hero-pt-28p { padding-top: 174px; }
}

/* --- Contacto: tamaño real del mapa chico dentro de cada tarjeta de oficina --- */
.cav-office-map-size {
	width: 100%;
}
@media (min-width: 640px) {
	.cav-office-map-size {
		width: 190px;
	}
}
@media (min-width: 1024px) {
	.cav-office-map-size {
		width: 210px;
	}
}

/* --- Áreas de práctica: botón de descarga del brochure --- */
.cav-brochure-btn {
	transition: background-color 0.35s ease, transform 0.3s ease, box-shadow 0.35s ease;
}
.cav-brochure-btn:hover {
	background-color: var(--gold);
	transform: translateY(-2px);
	box-shadow: 0 16px 30px -18px rgba(41, 45, 57, 0.5);
}

/* ==========================================================================
 * Acordeones (Áreas de práctica / Industrias): colapso de altura real.
 * Las clases de Tailwind con corchetes (grid-rows-[0fr] / grid-rows-[1fr])
 * nunca se compilaron porque el diseño original no las usaba — por eso el
 * panel nunca colapsaba de verdad. Se reemplazan por reglas propias.
 * ========================================================================== */
.cav-accordion-panel {
	grid-template-rows: 0fr;
	opacity: 0;
}
.cav-accordion-panel.cav-accordion-open {
	grid-template-rows: 1fr;
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.cav-accordion-panel {
		transition-duration: 0.01ms !important;
	}
}

/* ==========================================================================
 * Fotos de los profesionales: encuadre uniforme.
 *
 * Antes la imagen usaba altura fija con ancho libre, así que su tamaño en
 * pantalla dependía de las proporciones de cada archivo: una foto más cuadrada
 * salía mucho más ancha que una alargada, y algunas se desbordaban de la
 * tarjeta. Ahora cada foto se ajusta dentro de una caja idéntica, apoyada
 * abajo y centrada, para que todas se vean parejas.
 * ========================================================================== */
.cav-team-photo {
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 100%;
	height: 98%;
	object-fit: contain;
	object-position: bottom center;
	pointer-events: none;
	transition: transform 0.5s ease;
}
.cav-team-card:hover .cav-team-photo {
	transform: translateX(-50%) translateY(-4px);
}

/* Foto grande de la página individual del profesional. */
.cav-profile-photo {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 58%;
	height: 85%;
	object-fit: contain;
	object-position: bottom right;
	pointer-events: none;
	user-select: none;
}
@media (min-width: 768px) {
	.cav-profile-photo { right: 4%; width: 46%; height: 95%; }
}
@media (min-width: 1024px) {
	.cav-profile-photo { right: 8%; width: 40%; }
}


/* Reconocimientos (Inicio): descripción y nombre del reconocimiento a 26px
   desde tabletas en adelante (en celular se mantienen en 24px). */
@media (min-width: 768px) {
	.cav-testi-quote .cav-testi-texto,
	.cav-testi-quote .cav-testi-fuente {
		font-size: 26px;
	}
}


/* Celular: títulos largos de áreas e industrias (por ejemplo "Pharmaceutical,
   Biotechnology & Life Sciences") y el botón de la Asociación no se salen de la pantalla. */
@media (max-width: 640px) {
	.cav-titulo-largo { font-size: 2.25rem; overflow-wrap: anywhere; hyphens: auto; }
	.cav-boton-asociacion { letter-spacing: .14em; flex-shrink: 1; max-width: 100%; padding-left: 1.25rem; padding-right: 1.25rem; overflow-wrap: anywhere; }
}
/* Desplegables de servicios: el título largo se ajusta y no empuja «Ver más +» fuera de la pantalla. */
.cav-accordion-trigger > div { min-width: 0; }
.cav-accordion-trigger > div > span:last-child { overflow-wrap: anywhere; }

/* Perfil en celular: las columnas no se ensanchan más que la pantalla y los
   correos largos (por ejemplo valentinabarbosa@cavelier.com) pueden partirse. */
.cav-perfil-grid > * { min-width: 0; }
.cav-perfil-grid a[href^="mailto:"] { overflow-wrap: anywhere; }
/* Filtros del blog en celular: los selectores se ajustan al ancho disponible. */
@media (max-width: 640px) {
	#cav-pub-page .flex.items-center.gap-3 { min-width: 0; }
	#cav-pub-page .flex.items-center.gap-3 > .relative { flex: 1 1 auto; min-width: 0; }
	#cav-pub-area-select, #cav-pub-tipo-select { width: 100%; max-width: 100%; min-width: 0; }
}

/* La Firma, reconocimientos: al pasar el mouse la fila se vuelve azul marino; la
   descripción pasa a color claro para que siga legible. */
.group:hover .cav-rank-detalle { color: var(--bone); color: color-mix(in srgb, var(--bone) 78%, transparent); }