/* ----------------------------------------------------------------------------------------- Navbar -----*/
.wp-block-group.is-layout-flow.wp-container-core-group-is-layout-f4752a5b.wp-block-group-is-layout-flow {
	display: none;
}

/* ==========================================================
   Botón "ENTRADAS" — efecto 3D presionado
   Target: .tickets-btn (li del wp-block-navigation-item)
   Ajusta los colores hex a la marca exacta si no calzan
   ========================================================== */
.tickets-btn .wp-block-navigation-item__content {
	background-color: #d81f26;
	color: #ffffff !important;
	border-radius: 999px;
	padding: 14px 34px;
	font-weight: 700;
	line-height: 1;
	border: 2px solid #8c1015;
	box-shadow: 5px 5px 0 #8c1015;
	transform: translate(0, 0);
	transition: transform 0.18s, box-shadow 0.18s, background-color .15s ease;
	display: inline-block;
	text-decoration: none !important;
}

.tickets-btn .wp-block-navigation-item__content:hover {
	background-color: #e63238;
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 #8c1015;
}

.tickets-btn .wp-block-navigation-item__content:active {
	transform: translate(5px, 5px);
	box-shadow: 0 0 0 #8c1015;
}

/* ==========================================================
   FOOTER — tarjeta de newsletter flotante + links + social + copyright
   ========================================================== */
footer {
	margin-block-start: 0 !important;
}

.wccr-footer-section {
	background-color: #57C2F1;
	position: relative;
	padding: 0 24px 48px;
	overflow: hidden;
}

/* --- Tarjeta blanca flotante (mismo truco que .wccr-datos-banner) --- */
.wccr-newsletter-card {
	background-color: #ffffff;
	border: 2px solid #002b7f;
	border-radius: 20px;
	max-width: 560px;
	margin: -64px auto 0;
	position: relative;
	z-index: 3;
	padding: 40px 36px;
	text-align: center;
	box-shadow: 0 24px 48px rgba(0, 20, 60, 0.18);
}

.wccr-newsletter-icon {
	font-size: 28px;
	margin-bottom: 12px;
}

.wccr-newsletter-title {
	color: #002b7f !important;
	font-weight: 800;
	font-size: 1.4rem !important;
	margin: 0 0 10px !important;
}

.wccr-newsletter-desc {
	color: #5a6a85;
	font-size: .92rem;
	max-width: 420px;
	margin: 0 auto 22px;
}

.wccr-newsletter-form {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	justify-content: center;
}

.wccr-newsletter-input {
	flex: 1 1 220px;
	padding: 12px 18px;
	border-radius: 999px;
	border: 1.5px solid #c7d6e0;
	font-size: .92rem;
	font-family: inherit;
}

.wccr-newsletter-input:focus {
	outline: none;
	border-color: #002b7f;
}

.wccr-newsletter-btn {
	background-color: #d81f26;
	color: #ffffff;
	border: 2px solid #8c1015;
	border-radius: 999px;
	padding: 12px 28px;
	font-weight: 800;
	font-size: .85rem;
	letter-spacing: .03em;
	cursor: pointer;
	box-shadow: 4px 4px 0 #8c1015;
	transition: transform 0.18s, box-shadow 0.18s, background-color .15s ease;
	font-family: inherit;
}

.wccr-newsletter-btn:hover {
	background-color: #e63238;
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 #8c1015;
}

.wccr-newsletter-btn:active {
	transform: translate(4px, 4px);
	box-shadow: 0 0 0 #8c1015;
}

/* --- Franja inferior: links / social / copyright (alineado a la izq.) --- */
.wccr-footer-bottom {
	text-align: left;
	padding-top: 56px;
	max-width: 1100px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}

.wccr-footer-links {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 32px;
	margin-bottom: 20px;
}

.wccr-footer-links a {
	color: #002b7f;
	font-weight: 800;
	font-size: 1.05rem;
	text-decoration: none;
}

.wccr-footer-links a:hover {
	text-decoration: underline;
}

.wccr-footer-social {
	display: flex;
	justify-content: flex-start;
	gap: 16px;
	margin-bottom: 18px;
	font-size: 1.2rem;
}

.wccr-footer-social a {
	text-decoration: none;
	background-color: rgba(255, 255, 255, 0.35);
	width: 34px;
	height: 34px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.wccr-footer-copy {
	color: #002b7f;
	font-weight: 700;
	font-size: 1rem;
	margin: 0;
}

/* --- Ilustración decorativa (placeholder) --- */
.wccr-footer-illustration {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 340px;
	max-width: 40vw;
	line-height: 0;
	pointer-events: none;
	z-index: 1;
}

.wccr-footer-illustration svg {
	width: 100%;
	height: auto;
	display: block;
}

@media (max-width: 640px) {
	.wccr-newsletter-card {
		padding: 30px 22px;
		margin-top: -44px;
	}
	
	.wccr-newsletter-form {
		flex-direction: column;
	}
	
	.wccr-newsletter-btn {
		width: 100%;
	}
	
	.wccr-footer-illustration {
		width: 200px;
		opacity: .5;
	}
}

/* ----------------------------------------------------------------------------------------- Buttons -----*/
/* ==========================================================
   BOTONES — mismo sistema de "presión" del botón Entradas del navbar:
   hover = medio hundido, active = hundido del todo.
   Actualmente están en negro (rgb(17,17,17)) heredado del tema —
   estas reglas los sobreescriben.
   ========================================================== */
.wccr-btn-primary .wp-block-button__link,
.wccr-btn-outline .wp-block-button__link {
	border-radius: 999px !important;
	padding: 16px 32px !important;
	font-weight: 800;
	border: 2px solid;
	transition: transform 0.18s, box-shadow 0.18s, background-color .15s ease;
}

.wccr-btn-primary .wp-block-button__link {
	background-color: #d81f26 !important;
	color: #ffffff !important;
	border-color: #8c1015;
	box-shadow: 5px 5px 0 #8c1015;
}

.wccr-btn-primary .wp-block-button__link:hover {
	background-color: #e63238 !important;
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 #8c1015;
}

.wccr-btn-primary .wp-block-button__link:active {
	transform: translate(5px, 5px);
	box-shadow: 0 0 0 #8c1015;
}

.wccr-btn-outline .wp-block-button__link {
	background-color: transparent !important;
	color: #ffffff !important;
	border-color: #ffffff;
	box-shadow: 5px 5px 0 rgba(255, 255, 255, 0.4);
}

.wccr-btn-outline .wp-block-button__link:hover {
	background-color: rgba(255, 255, 255, 0.1) !important;
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 rgba(255, 255, 255, 0.4);
}

.wccr-btn-outline .wp-block-button__link:active {
	transform: translate(5px, 5px);
	box-shadow: 0 0 0 rgba(255, 255, 255, 0.4);
}

/* --- Botón outline oscuro (nueva variante, mismo sistema de presión) --- */
.wccr-btn-outline-dark .wp-block-button__link {
	background-color: transparent !important;
	color: #002b7f !important;
	border: 2px solid #002b7f;
	border-radius: 999px !important;
	padding: 16px 32px !important;
	font-weight: 700;
	box-shadow: 5px 5px 0 #002b7f;
	transition: transform 0.18s, box-shadow 0.18s, background-color .15s ease;
}

.wccr-btn-outline-dark .wp-block-button__link:hover {
	background-color: rgba(0, 43, 127, 0.06) !important;
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 #002b7f;
}

.wccr-btn-outline-dark .wp-block-button__link:active {
	transform: translate(5px, 5px);
	box-shadow: 0 0 0 #002b7f;
}

/* ----------------------------------------------------------------------------------------- Badges -----*/
/* ==========================================================
   BADGES — ya casi lo explico.
   ========================================================== */
/* --- Badge "10 AÑOS DE COMUNIDAD" --- */
.wccr-badge {
	display: inline-flex !important;
	justify-content: center !important;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	border-radius: 999px;
	padding: 8px 20px;
	margin: 0 auto 32px !important;
	width: fit-content;
}

/* Efecto glass en el badge blanco */
.wccr-badge-white {
	color: #ffffff;
	border: 1px solid rgba(255, 255, 255, 0.35);
	background-color: rgba(255, 255, 255, 0.12);
/* Safari */
}

/* Efecto glass en el badge rojo */
.wccr-badge-red {
	color: #e63238;
	border: 1px solid rgba(206, 17, 38, 0.35);
	background-color: rgba(206, 17, 38, 0.12);
/* Safari */
}

/* Efecto glass en el badge azul */
.wccr-badge-blue {
	color: #002b7f;
	border: 1px solid rgba(0, 43, 127, 0.35);
	background-color: rgba(0, 43, 127, 0.12);
/* Safari */
}

.wccr-badge svg {
	width: 16px;
	height: 16px;
}

.wccr-badge-sky {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #64c4f4 !important;
	background-color: rgba(100, 196, 244, 0.14);
	border-radius: 999px;
	padding: 8px 20px;
	font-weight: 800;
	font-size: 13px;
	letter-spacing: .04em;
	margin-bottom: 16px;
	width: fit-content;
}

/* ----------------------------------------------------------------------------------------- Home -----*/
/* ==========================================================
   HERO "FALTAN X DÍAS" — WordCamp Costa Rica 2026
   Basado en inspección real del HTML en vivo (15 jul 2026).
   Requiere las 7 clases CSS adicionales indicadas en el chat.
   Pega en Apariencia → Personalizar → CSS adicional.
   ========================================================== */
/* --- Centrado general del contenido del hero --- */
.wccr-hero {
	text-align: center;
}

/* Centrado vertical del contenido dentro del hero de 800px */
.wccr-hero {
	display: flex !important;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.wccr-hero .wp-block-columns {
	justify-content: center;
}

.wccr-hero .wp-block-column {
	max-width: 760px;
	margin: 0 auto;
}

/* --- "FALTAN" --- */
.wccr-title-top {
	font-size: clamp(32px, 8vw, 48px) !important;
	font-weight: 900 !important;
	margin-bottom: 0 !important;
	color: #ffffff !important;
}

/* --- "78 DÍAS" (actualmente 52px, necesita ser el elemento dominante) --- */
.wccr-title-days {
	font-size: clamp(64px, 12vw, 160px) !important;
	font-weight: 900 !important;
	line-height: .95 !important;
	margin: 0 0 16px !important;
}

.wccr-title-top strong {
	color: #7fd1ff;
/* celeste acento, ajusta al hex de marca si difiere */
}

/* --- "PARA EL #WCCR" --- */
.wccr-subtitle {
	font-size: clamp(20px, 3vw, 32px) !important;
	font-weight: 800 !important;
	margin-bottom: 40px !important;
}

.wccr-hero-meta {
	font-size: 17px !important;
	font-weight: 500 !important;
	color: rgba(255, 255, 255, 0.9) !important;
	margin-top: 8px !important;
}

.wccr-hero-meta strong {
	color: #ffffff;
	font-weight: 700;
}

.wccr-hero .wp-block-buttons {
	justify-content: center !important;
}

/* ==========================================================
   CINTILLO ROJO ANIMADO — mismo mecanismo que el ribbon verde de
   events.wordpress.org/campusconnect (sacado en vivo de su CSS).
   Va con el HTML de 5-ribbon-markup.html en un bloque HTML personalizado.
   ========================================================== */
.wccr-ribbon {
	background: #d81f26;
	border-top: 2px solid #8c1015;
	border-bottom: 2px solid #8c1015;
	overflow: hidden;
	padding: 13px 0;
}

.wccr-ribbon__track {
	display: flex;
	gap: 44px;
	width: max-content;
	animation: wccr-scrollX 24s linear infinite;
}

.wccr-ribbon__item {
	font-weight: 700;
	font-size: 15px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #ffffff;
	white-space: nowrap;
	display: flex;
	align-items: center;
	gap: 44px;
}

/* separador — círculo blanco (dibujado en CSS, no emoji, para que
   se vea igual de nítido en cualquier navegador/fuente) */
.wccr-ribbon__item::after {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #ffffff;
}

@keyframes wccr-scrollX {
	100% {
		transform: translateX(-50%);
	}
}

/* pausa al pasar el mouse — opcional, quítalo si no lo quieres */
.wccr-ribbon:hover .wccr-ribbon__track {
	animation-play-state: paused;
}

/* ==========================================================
   BANNER DE DATOS FLOTANTE (Fechas / Lugar / Formato + CTA)
   Va justo después del Group del hero, como hermano (no adentro).
   El margin-top negativo lo monta encima del hero sin dejar hueco
   en el flujo del documento (a diferencia de usar transform).
   ========================================================== */
.wccr-datos-banner {
	background-color: #ffffff;
	border-radius: 18px;
	max-width: 1140px;
	margin: -58px auto 0;
	position: relative;
	z-index: 3;
	padding: 36px 40px;
	box-shadow: 0 24px 48px rgba(0, 20, 60, 0.18);
}

.wccr-datos-grid {
	justify-content: center !important;
	gap: 36px !important;
	text-align: center;
}

.wccr-dato-label {
	font-size: .7rem !important;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: #8592a8 !important;
	font-weight: 700 !important;
	margin-bottom: 4px !important;
}

.wccr-dato-valor {
	font-weight: 700 !important;
	font-size: 1.02rem !important;
	color: #002b7f !important;
	line-height: 1.4;
	margin: 0 !important;
}

@media (max-width: 760px) {
	.wccr-datos-banner {
		padding: 26px 22px;
		margin-top: -40px;
	}
	
	.wccr-datos-grid {
		gap: 20px 28px !important;
	}
}

/* ==========================================================
   PRUEBA SOCIAL — cifras + galería + cintillo de logos
   ========================================================== */
/* --- Cifras --- */
.wccr-cifra-row {
	justify-content: center !important;
	gap: 56px !important;
	flex-wrap: wrap;
	text-align: center;
	margin-bottom: 20px;
}

.wccr-cifra-num {
	font-weight: 800 !important;
	font-size: 2.1rem !important;
	color: #ce1126 !important;
	margin: 0 !important;
}

.wccr-cifra-lbl {
	font-size: .82rem !important;
	color: #5a6a85 !important;
	font-weight: 600 !important;
	margin: 2px 0 0 !important;
}

/* --- Galería --- */
.wccr-galeria-grid {
	gap: 14px !important;
}

.wccr-galeria-item {
	aspect-ratio: 4/3;
	border-radius: 12px;
	overflow: hidden;
}

.wccr-galeria-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* --- Cintillo azul de logos (va con 7-sponsor-ribbon-markup.html) --- */
.wccr-sponsor-ribbon {
	background-color: #002b7f;
	border-radius: 14px;
	overflow: hidden;
	margin-top: 44px;
	padding: 22px 0;
}

.wccr-sponsor-ribbon__track {
	display: flex;
	align-items: center;
	gap: 60px;
	width: max-content;
	animation: wccr-scrollLogos 26s linear infinite;
}

.wccr-sponsor-ribbon:hover .wccr-sponsor-ribbon__track {
	animation-play-state: paused;
}

.wccr-sponsor-ribbon__track img {
	height: 30px;
	width: auto;
	filter: brightness(0) invert(1);
	opacity: .92;
}

@keyframes wccr-scrollLogos {
	from {
		transform: translateX(0);
	}
	
	to {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.wccr-sponsor-ribbon__track {
		animation: none;
		overflow-x: auto;
	}
}

/* ==========================================================
   ARREGLO DE ESPACIADO — cifras / galería / cintillo de logos
   ========================================================== */
.wccr-cifra-row + .wccr-galeria-grid,
.wccr-galeria-grid + .wccr-sponsor-ribbon {
	margin-top: 24px !important;
}

/* ==========================================================
   POR QUÉ ASISTIR
   ========================================================== */
.wccr-fomo-section {
	text-align: center;
	padding: 72px 24px;
}

.wccr-fomo-title {
	color: #002b7f;
	font-weight: 800;
	margin: 0 0 14px;
}

.wccr-fomo-lead {
	font-size: 1.08rem;
	max-width: 640px;
	margin: 0 auto 8px;
	color: #3a4a63;
}

.wccr-fomo-grid {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
	margin-top: 34px !important;
	text-align: left;
}

@media (max-width: 900px) {
	.wccr-fomo-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px) {
	.wccr-fomo-grid {
		grid-template-columns: 1fr;
	}
}

.wccr-fomo-item {
	background-color: #ffffff;
	border: 1px solid #e1e8f2;
	border-radius: 12px;
	padding: 24px;
}

.wccr-fomo-item strong {
	color: #ce1126;
	font-weight: 800;
	margin-right: 8px;
}

.wccr-fomo-bridge {
	font-weight: 700;
	font-style: italic;
	font-size: 1.25rem;
	color: #002b7f;
	max-width: 680px;
	margin: 38px auto 0 !important;
}

/* ==========================================================
   CARRUSEL DE FOTOS EN FRANJA ROJA
   Va con 8-foto-carrusel-markup.html
   ========================================================== */
.wccr-foto-carrusel-wrap {
	background-color: #ce1126;
	overflow: hidden;
	padding: 34px 0;
}

.wccr-foto-carrusel-track {
	display: flex;
	gap: 16px;
	width: max-content;
	animation: wccr-scrollFotos 34s linear infinite;
}

.wccr-foto-carrusel-wrap:hover .wccr-foto-carrusel-track {
	animation-play-state: paused;
}

.wccr-foto {
	width: 220px;
	height: 150px;
	border-radius: 10px;
	flex-shrink: 0;
	background-color: rgba(255, 255, 255, 0.14);
	border: 1px dashed rgba(255, 255, 255, 0.4);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-size: .72rem;
	color: rgba(255, 255, 255, 0.85);
	padding: 10px;
	overflow: hidden;
}

.wccr-foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@keyframes wccr-scrollFotos {
	from {
		transform: translateX(0);
	}
	
	to {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.wccr-foto-carrusel-track {
		animation: none;
		overflow-x: auto;
	}
}

/* ==========================================================
   QUÉ INCLUYE TU ENTRADA — gafete + lista de beneficios
   ========================================================== */
.wccr-incluye-section {
	background-color: #d3f0ff;
	padding: 72px 24px;
}

.wccr-gafete-columns {
	align-items: center !important;
	gap: 52px !important;
}

/* --- Gafete --- */
.wccr-gafete-mockup {
	background: linear-gradient(160deg, #002b7f, #053d78);
	border-radius: 20px;
	padding: 28px !important;
	max-width: 300px;
	margin: 0 auto;
	box-shadow: 0 24px 50px rgba(0, 20, 60, 0.28);
	position: relative;
}

.wccr-gafete-mockup::before {
	content: "";
	position: absolute;
	top: -14px;
	left: 50%;
	transform: translateX(-50%);
	width: 70px;
	height: 14px;
	background-color: #64c4f4;
	border-radius: 6px 6px 0 0;
}

.wccr-gafete-header-text {
	color: rgba(255, 255, 255, 0.75) !important;
	font-size: .68rem !important;
	letter-spacing: .06em;
	text-transform: uppercase;
	font-weight: 700 !important;
	margin: 0 0 18px !important;
	padding-left: 18px;
	position: relative;
}

.wccr-gafete-header-text::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: #ce1126;
	box-shadow: 5px 0 0 #64c4f4;
}

.wccr-gafete-photo {
	background-color: rgba(255, 255, 255, 0.08);
	border: 1px dashed rgba(255, 255, 255, 0.3);
	border-radius: 12px;
	aspect-ratio: 1/1;
	margin-bottom: 16px !important;
	min-height: 140px;
}

.wccr-gafete-name {
	color: #ffffff !important;
	font-size: 1.1rem !important;
	margin: 0 !important;
}

.wccr-gafete-role {
	color: #64c4f4 !important;
	font-size: .82rem !important;
	font-weight: 700 !important;
	margin: 2px 0 0 !important;
}

.wccr-gafete-price {
	margin-top: 20px !important;
	background-color: #ce1126;
	color: #ffffff !important;
	display: inline-block;
	padding: 8px 16px;
	border-radius: 8px;
	font-weight: 800 !important;
	font-size: 1.3rem !important;
}

/* --- Contenido derecho --- */
.wccr-incluye-title {
	color: #002b7f;
	font-weight: 800;
}

.wccr-incluye-lead {
	font-size: 1.08rem;
	color: #3a4a63;
	margin: 0 0 4px;
}

.wccr-incluye-list {
	margin-top: 22px !important;
	list-style: none !important;
	padding-left: 0 !important;
}

.wccr-incluye-list li {
	display: flex;
	gap: 12px;
	padding: 9px 0;
	align-items: flex-start;
	font-weight: 500;
}

.wccr-incluye-list li::before {
	content: "✓";
	color: #ffffff;
	background-color: #ce1126;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .72rem;
	flex-shrink: 0;
	margin-top: 2px;
	font-weight: 800;
}

@media (max-width: 820px) {
	.wccr-gafete-columns {
		flex-wrap: wrap;
	}
}

/* ==========================================================
   POR QUÉ ESTA EDICIÓN ES DISTINTA — 3 pilares
   ========================================================== */
.wccr-pilares-section {
	text-align: center;
	padding: 72px 24px;
}

.wccr-pilares-title {
	color: #002b7f;
	font-weight: 800;
}

.wccr-pilares-lead {
	font-size: 1.08rem;
	max-width: 640px;
	margin: 0 auto 8px;
	color: #3a4a63;
}

.wccr-pilares-grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
	margin-top: 36px !important;
	text-align: left;
}

@media (max-width: 820px) {
	.wccr-pilares-grid {
		grid-template-columns: 1fr;
	}
}

.wccr-pilar {
	background-color: #ffffff;
	border: 1px solid #e1e8f2;
	border-radius: 14px;
	padding: 30px 26px !important;
}

.wccr-pilar-num {
	font-weight: 800 !important;
	font-size: .78rem !important;
	color: #ffffff !important;
	background-color: #ce1126;
	display: inline-flex;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	align-items: center;
	justify-content: center;
	margin-bottom: 16px !important;
}

.wccr-pilar-title {
	margin-bottom: 8px !important;
}

.wccr-pilar-text {
	font-size: .94rem;
	margin: 0 !important;
}

/* ==========================================================
   PROGRAMA — 2 tarjetas de día
   ========================================================== */
.wccr-programa-section {
	background-color: #d3f0ff;
	text-align: center;
	padding: 72px 24px;
}

.wccr-programa-title {
	color: #002b7f;
	font-weight: 800;
}

.wccr-programa-lead {
	font-size: 1.08rem;
	max-width: 640px;
	margin: 0 auto 8px;
	color: #3a4a63;
}

.wccr-programa-grid {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 22px;
	margin-top: 36px !important;
	text-align: left;
}

@media (max-width: 700px) {
	.wccr-programa-grid {
		grid-template-columns: 1fr;
	}
}

.wccr-dia-card {
	border-radius: 16px;
	padding: 32px !important;
}

.wccr-dia1 {
	background-color: #ffffff;
	border: 1px solid #e1e8f2;
}

.wccr-dia2 {
	background-color: #002b7f;
}

.wccr-dia2 .wccr-dia-fecha {
	color: #ffffff !important;
}

.wccr-dia-tag {
	font-size: .72rem !important;
	font-weight: 700 !important;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #ce1126 !important;
	margin: 0 !important;
}

.wccr-dia2 .wccr-dia-tag {
	color: #64c4f4 !important;
}

.wccr-dia-fecha {
	font-size: 1.4rem !important;
	font-weight: 800 !important;
	color: #002b7f !important;
	margin: 6px 0 14px !important;
}

.wccr-dia-list {
	list-style: none !important;
	padding-left: 0 !important;
	margin-top: 10px !important;
}

.wccr-dia-list li {
	padding: 6px 0;
	font-size: .94rem;
	padding-left: 20px;
	position: relative;
}

.wccr-dia1 .wccr-dia-list li {
	color: #3a4a63;
}

.wccr-dia2 .wccr-dia-list li {
	color: rgba(255, 255, 255, 0.9);
}

.wccr-dia-list li::before {
	content: "—";
	position: absolute;
	left: 0;
	color: #ce1126;
	font-weight: 700;
}

.wccr-dia2 .wccr-dia-list li::before {
	color: #64c4f4;
}

/* ==========================================================
   TABLA SIN WORDCAMP / CON WORDCAMP
   ========================================================== */
.wccr-transformacion-section {
	padding: 72px 24px;
}

.wccr-transformacion-title {
	color: #002b7f;
	font-weight: 800;
	text-align: center;
}

.wccr-sincon-table {
	width: 100%;
	max-width: 900px;
	margin: 36px auto 0;
	border-collapse: collapse;
}

.wccr-sincon-table th {
	text-align: left;
	padding: 12px 18px;
	font-size: .8rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	font-weight: 700;
}

.wccr-sincon-table th:first-child {
	color: #ce1126;
}

.wccr-sincon-table th:last-child {
	color: #053d78;
}

.wccr-sincon-table td {
	padding: 15px 18px;
	border-top: 1px solid #e1e8f2;
	font-size: .96rem;
	vertical-align: top;
}

.wccr-sincon-table td:first-child {
	color: #5a6a85;
}

.wccr-sincon-table td:last-child {
	color: #111111;
	font-weight: 600;
}

/* ==========================================================
   TESTIMONIOS
   ========================================================== */
.wccr-testi-section {
	background-color: #053d78;
	color: #ffffff;
	text-align: center;
	padding: 72px 24px;
}

.wccr-testi-title {
	color: #ffffff !important;
	font-weight: 800;
}

.wccr-testi-grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-top: 36px !important;
	text-align: left;
}

@media (max-width: 900px) {
	.wccr-testi-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px) {
	.wccr-testi-grid {
		grid-template-columns: 1fr;
	}
}

.wccr-testi-card {
	background-color: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 14px;
	padding: 26px !important;
}

.wccr-testi-quote {
	font-size: 2.2rem !important;
	color: #64c4f4 !important;
	line-height: 1;
	margin: 0 0 6px !important;
	display: block;
}

.wccr-testi-text {
	color: rgba(255, 255, 255, 0.92) !important;
	font-size: .95rem !important;
	font-style: italic;
	margin: 0 !important;
}

.wccr-testi-name {
	margin-top: 16px !important;
	font-weight: 700 !important;
	color: #ffffff !important;
	font-size: .92rem !important;
}

.wccr-testi-role {
	font-size: .78rem !important;
	color: #64c4f4 !important;
	margin: 0 !important;
}

/* ==========================================================
   PATROCINADORES v2 — badge de color por nivel + logos en caja
   Reemplaza las reglas .wccr-sponsor-logos / .wccr-tier-oro / etc.
   que te di en el archivo 14 (esas ya no aplican con este HTML).
   ========================================================== */
.wccr-patrocinadores-section {
	background-color: #ffffff;
	text-align: center;
	padding: 72px 24px;
}

.wccr-patrocinadores-title {
	color: #002b7f;
	font-weight: 800;
	margin-bottom: 8px !important;
}

.wccr-patrocinadores-tiers {
/*max-width: 1100px;*/
	margin: 0 auto;
}

.wccr-sponsor-tier {
	margin-top: 48px;
}

.wccr-sponsor-tier:first-of-type {
	margin-top: 36px;
}

/* --- Badge de nivel (pastilla de color) --- */
.wccr-tier-badge {
	display: inline-flex;
	align-items: center;
	border: 2px solid #002b7f;
	border-radius: 999px;
	padding: 8px 26px;
	font-weight: 800;
	font-size: .85rem;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: #002b7f;
	margin: 0 auto 22px !important;
	width: fit-content;
	box-shadow: 3px 3px 0 rgba(0, 43, 127, 0.15);
}

.wccr-tier-badge--oro {
	background-color: #EFBA2D;
}

.wccr-tier-badge--plata {
	background-color: #C7D6E0;
}

.wccr-tier-badge--bronce {
	background-color: #F0B87A;
}

.wccr-tier-badge--guaria {
	background-color: #C9B8EE;
}

/* --- Grid de logos: columnas fijas por nivel (mediakit) ---
   No uso auto-fit/minmax a propósito — ya nos mordió antes con
   grids que no respetan el número exacto de columnas. */
.wccr-sponsor-logos {
	display: grid !important;
	gap: 24px;
	margin: 0 auto;
}

.wccr-sponsor-logos--oro {
	grid-template-columns: repeat(2, 1fr);
/*max-width: 620px;*/
}

.wccr-sponsor-logos--plata {
	grid-template-columns: repeat(3, 1fr);
/*max-width: 900px;*/
}

.wccr-sponsor-logos--bronce {
	grid-template-columns: repeat(4, 1fr);
/*max-width: 1100px;*/
}

.wccr-sponsor-logos--guaria {
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
}

/* --- Caja individual por logo (Oro / Plata / Bronce) --- */
.wccr-sponsor-box {
	background-color: #ffffff;
	border: 1.5px solid #002b7f;
	border-radius: 10px;
	padding: 24px;
	min-height: 120px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wccr-sponsor-box img {
/*max-height: 56px;*/
	max-width: 100%;
	width: auto;
	object-fit: contain;
}

/* --- Caja compartida (Guaria): un solo borde para todos los logos --- */
.wccr-sponsor-box--shared {
/*max-width: 1100px;*/
	margin: 0 auto;
	min-height: 0;
}

.wccr-sponsor-box--shared .wccr-sponsor-logos--guaria img {
	max-height: 44px;
	width: auto;
	object-fit: contain;
	margin: 0 auto;
}

@media (max-width: 700px) {
	.wccr-sponsor-logos--oro,
	    .wccr-sponsor-logos--plata,
	    .wccr-sponsor-logos--bronce {
		grid-template-columns: repeat(2, 1fr);
	/*max-width: 460px;*/
	}
	
	.wccr-sponsor-logos--guaria {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.wccr-sponsor-box {
		padding: 16px;
	}
}

/* ==========================================================
   ENTRADAS — tarjetas de precio
   ========================================================== */
.wccr-entradas-section {
	text-align: center;
	padding: 72px 24px;
}

.wccr-entradas-title {
	color: #002b7f;
	font-weight: 800;
}

.wccr-entradas-lead {
	font-size: 1.08rem;
	max-width: 640px;
	margin: 0 auto 8px;
	color: #3a4a63;
}

.wccr-precios-grid {
	display: grid !important;
	gap: 18px;
	margin-top: 36px !important;
}

.wccr-precios-grid-2 {
	grid-template-columns: repeat(2, 1fr) !important;
	max-width: 640px;
	margin-left: auto !important;
	margin-right: auto !important;
}

@media (max-width: 560px) {
	.wccr-precios-grid-2 {
		grid-template-columns: 1fr !important;
	}
}

.wccr-precio-card {
	background-color: #ffffff;
	border: 1px solid #e1e8f2;
	border-radius: 16px;
	padding: 28px 22px !important;
	text-align: center;
	display: flex;
	flex-direction: column;
}

.wccr-precio-destacado {
	border: 2px solid #ce1126;
	position: relative;
	box-shadow: 0 16px 32px rgba(206, 17, 38, 0.14);
}

.wccr-precio-tag-pop {
	position: absolute;
	top: -13px;
	left: 50%;
	transform: translateX(-50%);
	background-color: #ce1126;
	color: #ffffff !important;
	font-size: .68rem !important;
	font-weight: 800 !important;
	letter-spacing: .05em;
	text-transform: uppercase;
	padding: 5px 14px;
	border-radius: 20px;
	margin: 0 !important;
	width: fit-content;
}

.wccr-precio-nombre {
	font-weight: 700 !important;
	font-size: .95rem !important;
	color: #053d78 !important;
	margin: 0 !important;
}

.wccr-precio-monto {
	font-weight: 800 !important;
	font-size: 2.1rem !important;
	color: #002b7f !important;
	margin: 10px 0 4px !important;
}

.wccr-precio-desc {
	font-size: .82rem !important;
	color: #5a6a85 !important;
	margin-bottom: 18px !important;
	flex-grow: 1;
}

.wccr-precio-card .wp-block-button,
.wccr-precio-card .wp-block-button__link {
	width: 100%;
	font-size: .9rem !important;
}

/* ==========================================================
   PATROCINIOS DE ENTRADA DIRECTA — tarjetas de compra (Morpho/Guaria)
   Reusa .wccr-precios-grid-2 / .wccr-precio-card / .wccr-precio-nombre /
   .wccr-precio-monto / .wccr-precio-desc / .wccr-btn-outline-dark
   (ya existen en tu CSS de Entradas) — solo agrega el wrapper de sección.
   ========================================================== */
.wccr-patrocinio-directo-section {
	background-color: #d3f0ff;
	text-align: center;
	padding: 72px 24px;
}

.wccr-patrocinio-directo-title {
	color: #002b7f;
	font-weight: 800;
}

.wccr-patrocinio-directo-lead {
	font-size: 1.08rem;
	max-width: 640px;
	margin: 0 auto 8px;
	color: #3a4a63;
}

.wccr-patrocinio-directo-nota {
	font-size: .96rem;
	max-width: 520px;
	margin: 32px auto 0;
	color: #3a4a63;
}

/* ==========================================================
   FAQ — bloque nativo "Detalles"
   ========================================================== */
.wccr-faq-section {
	background-color: #d3f0ff;
	padding: 72px 24px;
}

.wccr-faq-title {
	color: #002b7f;
	font-weight: 800;
	text-align: center;
}

.wccr-faq-item {
	border-bottom: 1px solid #e1e8f2;
	padding: 20px 0 !important;
	margin-top: 0 !important;
}

.wccr-faq-item summary {
	cursor: pointer;
	font-weight: 700 !important;
	font-size: 1.02rem;
	color: #002b7f;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
}

.wccr-faq-item summary::-webkit-details-marker {
	display: none;
}

.wccr-faq-item summary::after {
	content: "+";
	font-size: 1.4rem;
	color: #ce1126;
	flex-shrink: 0;
}

.wccr-faq-item[open] summary::after {
	content: "–";
}

.wccr-faq-item p {
	margin-top: 12px !important;
	font-size: .94rem;
}

/* ==========================================================
   CTA DE CIERRE — última sección antes del footer
   ========================================================== */
.wccr-cierre-section {
	background-color: #002b7f;
	text-align: center;
	padding: 88px 24px;
}

.wccr-cierre-title {
	color: #ffffff !important;
	font-weight: 800;
	font-size: clamp(28px, 4vw, 44px);
	max-width: 760px;
	margin: 0 auto 14px !important;
	line-height: 1.15;
}

.wccr-cierre-lead {
	color: rgba(255, 255, 255, 0.85) !important;
	font-size: 1.1rem;
	margin: 0 auto !important;
}

/* ============================================================
   WordCamp Costa Rica 2026 — AGENDA (Día 1 / Día 2)
   ------------------------------------------------------------
   ⚠️ ANTES DE PEGAR: borrá el bloque viejo de agenda que ya
   tenés en el git — va desde el comentario
   "/* === Encabezados de la tabla (Time, Auditorio, Salas) === "
   hasta la regla
   ".wordcamp-schedule .wordcamp-schedule__time-slot-header
   { background-color: #82A4B8; color: #000000; }"
   justo antes de la sección "WordCamp Costa Rica 2026 — Ponentes".
   Si dejás las dos versiones cargadas, van a pelear por
   especificidad y vas a tener resultados random.

   ⚠️ NOTA TÉCNICA — por qué NO hay variables CSS (--algo) acá:
   la primera versión usaba custom properties (--wccr-navy-deep,
   etc.) y en tu sitio el panel donde pegaste el CSS las borró
   silenciosamente (quedó la regla ".wccr-agenda-page { }" vacía).
   Es un tema del sanitizador de WordPress/tu hosting con
   declaraciones que empiezan en "--", no de la lógica del CSS.
   Por eso esta versión repite los hex directo en cada regla —
   más verboso, pero a prueba de ese filtro. Si en algún momento
   confirmás que tu "Additional CSS" SÍ soporta variables, avisame
   y te devuelvo la versión con --variables (es más corta).

   ESTRUCTURA DE BLOQUES A CREAR EN EL EDITOR
   (se arma UNA vez y se copia igual en la página de Día 1 y
   en la de Día 2 — lo único que cambia entre las dos es a cuál
   botón del toggle le agregás "is-active"):

   Group (ancho: Full width) ......... clase: wccr-agenda-page
     Group ............................ clase: wccr-agenda-hero
       Heading (H1) "Agenda" ......... clase: wccr-agenda-title
       Paragraph (bajada) ............ clase: wccr-agenda-subtitle
     Buttons .......................... clase: wccr-day-toggle
       Button "Día 1 · Sábado" ....... clase: wccr-day-tab
                                          (+ is-active SOLO en la
                                          página de Día 1, como
                                          segunda clase adicional)
       Button "Día 2 · Domingo" ...... clase: wccr-day-tab
                                          (+ is-active SOLO en la
                                          página de Día 2)
     Bloque nativo "WordCamp Schedule" — va tal cual, sin clases
     nuevas, adentro del mismo Group de arriba (para que el fondo
     celeste le pase por detrás también).

   ⚠️ IMPORTANTE sobre el bloque "WordCamp Schedule": si tu página
   "Día 1 / Sábado" está mostrando el contenido del 19 de
   septiembre, es porque el bloque en esa página quedó apuntando
   al día equivocado (o copiaste el bloque completo de la otra
   página, que trae los dos días adentro). En el editor, seleccioná
   el bloque "WordCamp Schedule" → panel derecho → tiene que haber
   una opción para filtrar/mostrar un solo día. En la página
   "agenda-sabado" tiene que quedar en 18 de septiembre; en la de
   domingo, en 19. Si no ves esa opción, decime qué versión del
   plugin de WordCamp Schedule Block tenés y reviso el filtro exacto.

   Todo lo de abajo asume exactamente esa estructura de clases.
   Si le cambiás el nombre a alguna, actualizala acá también.

   ⚠️ NOTA TÉCNICA #2 — por qué hay tantos !important acá abajo:
   el plugin "WordCamp Schedule Block" carga su propio CSS con
   reglas para .wordcamp-schedule__day (display:grid) y
   .wordcamp-schedule__session (fondo/sombra por defecto del
   plugin). Ese archivo del plugin no lo pude leer desde afuera
   para calcular su especificidad exacta, así que en vez de
   adivinar, fuerzo !important en las propiedades que le pisan el
   layout (display, fondo, borde, sombra) — así ganamos siempre,
   sin importar el orden en que WordPress cargue los estilos.
   ============================================================ */
/* ------------------------------------------------------------
   1. PÁGINA — fondo celeste a todo el ancho, sin caja/panel
   ------------------------------------------------------------ */
.wccr-agenda-page {
	position: relative;
	overflow: hidden;
	background-color: #d3f0ff;
	padding-bottom: 80px;
}

/* textura muy sutil, decorativa — opcional, se puede borrar */
.wccr-agenda-page::before,
.wccr-agenda-page::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
	z-index: 0;
}

.wccr-agenda-page::before {
	width: 520px;
	height: 520px;
	background: radial-gradient(circle, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0) 70%);
	top: -220px;
	right: -160px;
}

.wccr-agenda-page::after {
	width: 420px;
	height: 420px;
	background: radial-gradient(circle, rgba(0, 43, 127, .08), rgba(0, 43, 127, 0) 70%);
	bottom: -180px;
	left: -140px;
}

/* ------------------------------------------------------------
   2. HERO — título "Agenda" + bajada
   ------------------------------------------------------------ */
.wccr-agenda-hero {
	position: relative;
	z-index: 1;
	text-align: center;
	padding: 48px 24px 8px;
}

.wccr-agenda-title {
	font-size: clamp(34px, 5vw, 52px) !important;
	font-weight: 900 !important;
	color: #002b7f !important;
	margin: 0 0 10px !important;
	position: relative;
	display: inline-block;
}

.wccr-agenda-title::after {
	content: "";
	display: block;
	width: 72px;
	height: 6px;
	background-color: #d81f26;
	border-radius: 999px;
	margin: 14px auto 0;
}

.wccr-agenda-subtitle {
	color: #5b6b82 !important;
	font-size: 16px !important;
	max-width: 560px;
	margin: 0 auto !important;
}

/* ------------------------------------------------------------
   3. TOGGLE DÍA 1 / DÍA 2 — navegación real entre las 2 páginas
   Mismo sistema de "presión" que .wccr-btn-primary: borde y
   sombra plana del MISMO color, sin blur. Hover = se acerca.
   La pastilla de la página activa queda permanentemente
   "hundida" (mismo estado visual que el :active de un botón).
   ------------------------------------------------------------ */
.wccr-day-toggle {
	position: relative;
	z-index: 1;
	display: flex !important;
	justify-content: center !important;
	gap: 16px !important;
	flex-wrap: wrap;
	margin: 32px auto 0 !important;
}

.wccr-day-toggle .wp-block-button.wccr-day-tab .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 800 !important;
	font-size: 15px !important;
	padding: 13px 30px !important;
	border-radius: 999px !important;
	background-color: #ffffff !important;
	color: #002b7f !important;
	border: 3px solid #002b7f;
	box-shadow: 5px 5px 0 #002b7f;
	transition: transform .15s ease, box-shadow .15s ease;
}

.wccr-day-toggle .wp-block-button.wccr-day-tab .wp-block-button__link:hover {
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 #002b7f;
}

/* Página actual: agregale la clase adicional "is-active" al Button */
.wccr-day-toggle .wp-block-button.wccr-day-tab.is-active .wp-block-button__link {
	background-color: #002b7f !important;
	color: #ffffff !important;
	transform: translate(5px, 5px);
	box-shadow: 0 0 0 #002b7f;
	cursor: default;
}

/* ============================================================
   4. BLOQUE NATIVO wp-block-wordcamp-schedule
   Clases reales del plugin — no se tocan en el HTML, solo CSS.
   ============================================================ */
.wccr-agenda-page .wp-block-wordcamp-schedule {
	position: relative;
	z-index: 1;
	max-width: 1500px;
	margin: 0 auto;
	padding: 36px 5vw 0;
}

.wccr-agenda-page .wordcamp-schedule {
	background: transparent !important;
}

/* --- Fecha del día: tarjeta con borde + sombra plana --- */
.wccr-agenda-page .wordcamp-schedule__date {
	position: relative;
	width: fit-content;
	margin: 0 auto 40px;
	background-color: #ffffff !important;
	color: #002b7f !important;
	font-size: 26px;
	font-weight: 900;
	text-transform: capitalize;
	padding: 20px 44px;
	border-radius: 14px !important;
	border: 3px solid #002b7f !important;
	box-shadow: 7px 7px 0 #002b7f !important;
	text-align: center;
}

.wccr-agenda-page .wordcamp-schedule__date::before {
	content: "📅";
	margin-right: 12px;
}

/* --- Día: contenedor flex con línea de tiempo a la izquierda --- */
.wccr-agenda-page .wordcamp-schedule__day {
	position: relative;
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: stretch;
	gap: 18px !important;
	padding-left: 56px;
	background-color: transparent !important;
	margin: 0 !important;
}

.wccr-agenda-page .wordcamp-schedule__day::before {
	content: "";
	position: absolute;
	left: 20px;
	top: 6px;
	bottom: 6px;
	width: 0;
	border-left: 3px dashed rgba(0, 43, 127, .3);
}

/* --- Chips de leyenda (Time se oculta, tracks = leyenda de color) --- */
.wccr-agenda-page .wordcamp-schedule__column-header {
	flex: 0 0 auto;
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	background-color: #ffffff !important;
	color: #053d78 !important;
	font-size: 12.5px;
	font-weight: 700;
	padding: 7px 16px 7px 12px !important;
	border-radius: 999px !important;
	border: 1.5px solid rgba(0, 43, 127, .25) !important;
	margin: 0 8px 8px 0;
}

.wccr-agenda-page .wordcamp-schedule__column-header::before {
	content: "" !important;
	display: inline-block !important;
	width: 9px !important;
	height: 9px !important;
	border-radius: 50% !important;
	background-color: #053d78 !important;
	flex: 0 0 auto;
}

.wccr-agenda-page .wordcamp-schedule__column-header.is-column-time {
	display: none !important;
}

/* Salas Taller en la leyenda -> punto rojo */
.wccr-agenda-page .wordcamp-schedule__column-header[class*="is-column-track-sala-taller"]::before {
	background-color: #d81f26 !important;
}

/* --- Hora de cada bloque: etiqueta con punto sobre la línea de tiempo --- */
.wccr-agenda-page .wordcamp-schedule__time-slot-header {
	flex: 1 0 100% !important;
	position: relative;
	margin: 22px 0 4px !important;
	padding: 0 !important;
	font-size: 19px;
	font-weight: 800;
	color: #002b7f !important;
	text-align: left !important;
	background: transparent !important;
	border: none !important;
	border-bottom: none !important;
	box-shadow: none !important;
}

.wccr-agenda-page .wordcamp-schedule__time-slot-header::before {
	content: "";
	position: absolute;
	left: -44px;
	top: 50%;
	transform: translateY(-50%);
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: #002b7f;
	border: 3px solid #d3f0ff;
	box-shadow: 0 0 0 3px rgba(0, 43, 127, .25);
}

.wccr-agenda-page .wordcamp-schedule__day > .wordcamp-schedule__time-slot-header:first-of-type {
	margin-top: 4px;
}

/* --- Tarjeta de sesión: borde + sombra plana del MISMO color ---
   Track "Auditorio" = navy (bloque A) · Track "Sala Taller X" =
   rojo (bloque B, más abajo, sobreescribe el color en los
   elementos hijos de esas sesiones). Sin variables CSS: cada
   bloque repite sus propios hex. */
/* -- 4.1 Sesión (por defecto = navy / Auditorio) -- */
.wccr-agenda-page .wordcamp-schedule__session {
	position: relative;
	flex: 1 1 280px;
	max-width: calc(50% - 9px);
	margin: 0 !important;
	background-color: #ffffff !important;
	border-radius: 14px !important;
	padding: 20px 44px 18px 20px;
	border: 3px solid #002b7f !important;
	box-shadow: 6px 6px 0 #002b7f !important;
	transition: transform .15s ease, box-shadow .15s ease;
}

.wccr-agenda-page .wordcamp-schedule__session:hover {
	transform: translate(3px, 3px);
	box-shadow: 3px 3px 0 #002b7f !important;
}

.wccr-agenda-page .wordcamp-schedule__session.has-track-auditorio {
	flex-basis: 100%;
	max-width: 100%;
}

.wccr-agenda-page .wordcamp-schedule__session-category dd {
	background-color: #d3f0ff !important;
	color: #002b7f !important;
}

.wccr-agenda-page .wordcamp-schedule__session-title a:hover {
	color: #002b7f;
}

.wccr-agenda-page .wcb-session-favourite-icon .fav-session-button[aria-pressed="true"] .dashicon::before,
.wccr-agenda-page .wcb-session-favourite-icon .fav-session-button:hover .dashicon::before {
	color: #002b7f;
}

.wccr-agenda-page .wordcamp-schedule__session-speakers::before {
	background-color: #d3f0ff;
}

.wccr-agenda-page .wordcamp-schedule__session-speakers dd a:hover {
	color: #002b7f;
}

/* -- 4.2 Sesión que SOLO vive en una Sala Taller (paralela) = rojo.
   Si una sesión tiene Auditorio Y Sala Taller a la vez (ej. una
   keynote que se transmite a todas las salas), se queda en navy,
   por eso el ":not(.has-track-auditorio)". -- */
.wccr-agenda-page .wordcamp-schedule__session[class*="has-track-sala-taller"]:not(.has-track-auditorio) {
	border-color: #d81f26 !important;
	box-shadow: 6px 6px 0 #d81f26 !important;
}

.wccr-agenda-page .wordcamp-schedule__session[class*="has-track-sala-taller"]:not(.has-track-auditorio):hover {
	box-shadow: 3px 3px 0 #d81f26 !important;
}

.wccr-agenda-page .wordcamp-schedule__session[class*="has-track-sala-taller"]:not(.has-track-auditorio) .wordcamp-schedule__session-category dd {
	background-color: #fbdcdd !important;
	color: #d81f26 !important;
}

.wccr-agenda-page .wordcamp-schedule__session[class*="has-track-sala-taller"]:not(.has-track-auditorio) .wordcamp-schedule__session-title a:hover {
	color: #d81f26;
}

.wccr-agenda-page .wordcamp-schedule__session[class*="has-track-sala-taller"]:not(.has-track-auditorio) .wcb-session-favourite-icon .fav-session-button[aria-pressed="true"] .dashicon::before,
.wccr-agenda-page .wordcamp-schedule__session[class*="has-track-sala-taller"]:not(.has-track-auditorio) .wcb-session-favourite-icon .fav-session-button:hover .dashicon::before {
	color: #d81f26;
}

.wccr-agenda-page .wordcamp-schedule__session[class*="has-track-sala-taller"]:not(.has-track-auditorio) .wordcamp-schedule__session-speakers::before {
	background-color: #fbdcdd;
}

.wccr-agenda-page .wordcamp-schedule__session[class*="has-track-sala-taller"]:not(.has-track-auditorio) .wordcamp-schedule__session-speakers dd a:hover {
	color: #d81f26;
}

/* --- Categoría: badge tipo pill (colores por defecto = navy,
   sobreescritos arriba para sesiones de Sala Taller) --- */
.wccr-agenda-page .wordcamp-schedule__session-category {
	margin: 0 0 10px;
}

.wccr-agenda-page .wordcamp-schedule__session-category dd {
	display: inline-block;
	margin: 0;
	font-size: 10.5px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .05em;
	padding: 5px 12px;
	border-radius: 999px;
}

/* --- Título de la sesión --- */
.wccr-agenda-page .wordcamp-schedule__session-title {
	margin: 0 0 8px;
	font-size: 16.5px !important;
	line-height: 1.35;
	font-weight: 800;
	color: #0b1b33;
}

.wccr-agenda-page .wordcamp-schedule__session-title a {
	color: inherit;
	text-decoration: none;
}

.wccr-agenda-page .wordcamp-schedule__session-title a:hover {
	text-decoration: underline;
}

/* --- Estrella de favoritos (funcional, solo la repintamos) --- */
.wccr-agenda-page .wcb-session-favourite-icon {
	position: absolute;
	top: 18px;
	right: 16px;
}

.wccr-agenda-page .wcb-session-favourite-icon .fav-session-button {
	text-decoration: none;
}

.wccr-agenda-page .wcb-session-favourite-icon .dashicon {
	font-size: 0;
}

.wccr-agenda-page .wcb-session-favourite-icon .dashicon::before {
	content: "☆";
	font-size: 19px;
	color: #c7d2e3;
	line-height: 1;
}

.wccr-agenda-page .wcb-session-favourite-icon .fav-session-button[aria-pressed="true"] .dashicon::before {
	content: "★";
}

/* --- Horario de la sesión (ej. "2:00 pm - 3:00 pm") --- */
.wccr-agenda-page .wordcamp-schedule__session > p {
	margin: 0 0 12px;
	font-size: 12.5px;
	font-weight: 600;
	color: #5b6b82;
}

.wccr-agenda-page .wordcamp-schedule__session > p::before {
	content: "🕐 ";
	margin-right: 6px;
}

/* --- Ponente(s): fila con "avatar" circular generado por CSS
   (el bloque nativo no trae foto de ponente en este markup) --- */
.wccr-agenda-page .wordcamp-schedule__session-speakers {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 12px 0 0;
	padding-top: 12px;
	border-top: 1px dashed rgba(5, 61, 120, .2);
}

.wccr-agenda-page .wordcamp-schedule__session-speakers::before {
	content: "👤";
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
}

.wccr-agenda-page .wordcamp-schedule__session-speakers dd {
	margin: 0;
	display: flex;
	flex-direction: column;
}

.wccr-agenda-page .wordcamp-schedule__session-speakers dd a {
	color: #0b1b33;
	font-weight: 700;
	font-size: 13.5px;
	text-decoration: none;
}

/* --- Track / sala: subtexto bajo el nombre del ponente --- */
.wccr-agenda-page .wordcamp-schedule__session-tracks {
	margin: 2px 0 0 35px;
}

.wccr-agenda-page .wordcamp-schedule__session-tracks dd {
	margin: 0;
	font-size: 11.5px;
	font-weight: 600;
	color: #5b6b82;
}

.wccr-agenda-page .wordcamp-schedule__session.is-spanning-all-tracks .wordcamp-schedule__session-tracks {
	margin-left: 0;
}

/* --- Bloques especiales: Café / Almuerzo / Foto Grupal ---
   Se quedan livianos (píldora punteada) para no competir
   visualmente con las tarjetas de contenido real. */
.wccr-agenda-page .wordcamp-schedule__session.is-type-custom {
	flex-basis: 100%;
	max-width: 100%;
	margin: 0 !important;
	background-color: transparent !important;
	border: 2px dashed rgba(0, 43, 127, .4) !important;
	box-shadow: none !important;
	border-radius: 999px !important;
	padding: 13px 26px;
	display: flex !important;
	align-items: baseline;
	justify-content: center;
	gap: 10px;
	text-align: center;
}

.wccr-agenda-page .wordcamp-schedule__session.is-type-custom:hover {
	transform: none;
	box-shadow: none !important;
}

.wccr-agenda-page .wordcamp-schedule__session.is-type-custom .wordcamp-schedule__session-title {
	margin: 0;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: #002b7f;
}

.wccr-agenda-page .wordcamp-schedule__session.is-type-custom > p {
	margin: 0;
	opacity: .75;
}

.wccr-agenda-page .wordcamp-schedule__session.is-type-custom > p::before {
	content: "";
}

.wccr-agenda-page .wordcamp-schedule__session.is-type-custom .wordcamp-schedule__session-tracks {
	display: none;
}

/* Ícono por tipo de break, según el slug real de la sesión */
.wccr-agenda-page .wordcamp-schedule__session.is-type-custom[class*="has-slug-cafe"] .wordcamp-schedule__session-title::before {
	content: "☕ ";
	margin-right: 6px;
}

.wccr-agenda-page .wordcamp-schedule__session.is-type-custom[class*="has-slug-almuerzo"] .wordcamp-schedule__session-title::before {
	content: "🍽️ ";
	margin-right: 6px;
}

.wccr-agenda-page .wordcamp-schedule__session.is-type-custom[class*="has-slug-foto-grupal"] .wordcamp-schedule__session-title::before {
	content: "📸 ";
	margin-right: 6px;
}

/* ------------------------------------------------------------
   5. RESPONSIVE
   ------------------------------------------------------------ */
@media (max-width: 780px) {
	.wccr-agenda-title {
		font-size: 34px !important;
	}
	
	.wccr-agenda-page .wp-block-wordcamp-schedule {
		padding: 24px 20px 0;
	}
	
	.wccr-agenda-page .wordcamp-schedule__day {
		padding-left: 38px;
	}
	
	.wccr-agenda-page .wordcamp-schedule__time-slot-header::before {
		left: -28px;
	}
	
	.wccr-agenda-page .wordcamp-schedule__session {
		max-width: 100%;
		flex-basis: 100%;
	}
}

@media (max-width: 560px) {
	.wccr-day-toggle .wp-block-button.wccr-day-tab .wp-block-button__link {
		padding: 11px 22px !important;
		font-size: 13.5px !important;
	}
}

/* ==========================================================================
   ESTILO PARA CAMPTIX (#tix) — el formulario que genera [camptix]
   Lo integramos al lenguaje sticker del sitio.
   ========================================================================== */
#tix {
	max-width: 1160px;
	margin: 34px auto 0;
	padding: 0 24px 20px;
	font-family: Poppins;
}

/* tabla de boletos como tarjeta sticker */
#tix table.tix_tickets_table {
	width: 100%;
	background: #fff;
	border: 2px solid #002b7f;
	border-radius: 22px;
	box-shadow: 5px 5px 0 #002b7f;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}

#tix th, #tix td {
	padding: 18px 20px;
	text-align: left;
	vertical-align: middle;
}

/* encabezados de la tabla */
#tix thead th {
	font-family: "IBM Plex Mono", "Fira Code", monospace;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: #002b7f;
	background: #d3f0ff;
	border-bottom: 2px solid #002b7f;
}

/* filas de boletos */
#tix tbody tr + tr th,
#tix tbody tr + tr td {
	border-top: 1.5px dashed #d8cfbc;
}

#tix .tix-ticket-title {
	font-family: Poppins;
	font-weight: 800;
	font-size: 19px;
	color: #002b7f;
}

#tix .tix-ticket-excerpt {
	color: #111111;
	font-size: 14px;
	line-height: 1.5;
}

#tix .tix-column-price {
	font-family: Poppins;
	font-weight: 800;
	font-size: 18px;
	color: #002b7f;
	white-space: nowrap;
}

#tix .tix-column-remaining {
	font-family: "IBM Plex Mono", "Fira Code", monospace;
	color: #ce1126;
	font-weight: 600;
}

/* selector de cantidad */
#tix select {
	font-family: "IBM Plex Mono", "Fira Code", monospace;
	font-size: 15px;
	border: 2px solid #002b7f;
	border-radius: 10px;
	padding: 8px 12px;
	background: #fff;
	cursor: pointer;
}

/* boton de registro */
#tix input[type="submit"] {
	font-family: Poppins;
	font-weight: 700;
	font-size: 17px;
	background: #ffffff;
	color: #002b7f;
	border: 2px solid #002b7f;
	border-radius: 999px;
	box-shadow: 5px 5px 0 #002b7f;
	padding: 14px 30px;
	margin-top: 20px;
	cursor: pointer;
	transition: transform .18s ease, box-shadow .18s ease;
}

#tix input[type="submit"]:hover {
	background: rgba(0, 43, 127, 0.06) !important;
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 #002b7f;
}

/* enlace y campo de cupon */
#tix #tix-coupon-link {
	font-family: "IBM Plex Mono", "Fira Code", monospace;
	font-size: 13px;
	color: #002b7f;
}

#tix #tix-coupon-input {
	border: 2px solid #002b7f;
	border-radius: 10px;
	padding: 8px 12px;
}

@media (max-width: 640px) {
	#tix th, #tix td {
		padding: 12px 10px;
	}
	
	#tix .tix-ticket-title {
		font-size: 16px;
	}
}

/* ============================================================
   WordCamp Costa Rica 2026 — PONENTES v2 (con charla + fecha)
   SOLO CSS. El HTML del query loop NO se toca a mano.

   Ya quitaste "Ver más" y "Sala" y los cambiaste por el bloque
   nativo "Sesiones del ponente" (charla + fecha). Estructura
   real confirmada en vivo:

     figure.wp-block-wordcamp-avatar > img
     h3.wp-block-post-title > a                          (nombre)
     ul.wp-block-wordcamp-speaker-sessions > li > p > a   (charla)
     div.wp-block-wordcamp-session-date > time            (fecha)

   Cada selector abajo viene DUPLICADO: una vez con clase nativa
   de WordPress (funciona ya, sin que toques nada) y una vez con
   clase .wccr-ponente-* (para que quede con tu convención). Para
   activar la segunda, agrega "Clase(s) CSS adicional" en el
   panel Avanzado de CADA bloque DENTRO del template del query
   loop (Ponentes → editar bloque → Avatar / Título / Sesiones /
   Fecha). Es un clic único por bloque, se aplica a los 20
   ponentes automáticamente — no es por-ponente.

     Bloque "Avatar"            → wccr-ponente-avatar
     Bloque "Título"            → wccr-ponente-nombre
     Bloque "Sesiones ponente"  → wccr-ponente-charla
     Bloque "Fecha de sesión"   → wccr-ponente-fecha

   El  de la tarjeta en sí NO se puede clasear a mano —
   Gutenberg no da esa opción en un query loop, solo a los
   bloques internos. Por eso ahí sí nos quedamos con el selector
   nativo .wcb_speaker (es estable, no depende de que edites nada).

   ⚠️ BUG DE DATOS detectado, no de CSS: las 20 sesiones están
   devolviendo datetime="1969-12-31T18:00:00-06:00" — es el typical
   fallback de una fecha vacía en la agenda. Mientras no le asignes
   fecha/hora real a cada charla en el editor de Agenda, la regla
   de abajo OCULTA la fila de fecha automáticamente (mejor eso que
   mostrar "31 de diciembre de 1969" en producción). En cuanto
   asignes fechas reales, la fila aparece sola, sin tocar CSS.
   ============================================================ */
/* --- Encabezado de la página (H1 + intro + separador) --- */
.page-slug-ponentes h1.wp-block-post-title {
	color: #3759b3 !important;
	font-weight: 800 !important;
}

.page-slug-ponentes .entry-content p.wp-block-paragraph {
	color: #5a6a85 !important;
	max-width: 640px;
}

.page-slug-ponentes .entry-content hr.wp-block-separator {
	width: 64px !important;
	height: 4px !important;
	background-color: #ce1126 !important;
	border: none !important;
	opacity: 1 !important;
	margin: 20px 0 40px !important;
}

/* --- Grid de tarjetas --- */
.page-slug-ponentes .wp-block-post-template.columns-3 {
	gap: 2.5rem 1.75rem !important;
}

/* --- Tarjeta (el  — selector nativo, ver nota arriba) --- */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker {
	position: relative;
	width: 100%;
	max-width: 368px;
	aspect-ratio: auto;
	margin: 0 auto;
	background-color: #ffffff;
	background-image: none;
	border: 1px solid #e1e8f2;
	border-radius: 18px;
	box-shadow: 0 4px 16px rgba(0, 43, 127, 0.08);
	padding: 40px 26px 26px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	overflow: hidden;
	transition: transform .2s ease, box-shadow .2s ease;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker:hover {
	transform: translateY(-6px);
	box-shadow: 0 18px 34px rgba(0, 43, 127, 0.16);
}

/* Barra superior — color por defecto (fallback si no hay sala) */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 6px;
	background: linear-gradient(90deg, #ce1126, #3759b3, #64c4f4);
}

/* --- Avatar --- */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wccr-ponente-avatar,
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-avatar {
	order: 1;
	position: relative;
	width: fit-content;
	margin: 0 auto 18px !important;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wccr-ponente-avatar img,
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-avatar img {
	width: 100px;
	height: 100px;
	border-radius: 50%;
	border: 3px solid #ce1126;
	object-fit: cover;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
}

/* Punto indicador de sala/track, esquina del avatar (fallback) */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wccr-ponente-avatar::after,
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-avatar::after {
	content: "";
	position: absolute;
	bottom: 2px;
	right: 2px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #ce1126;
	border: 3px solid #ffffff;
}

/* --- Nombre --- */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wccr-ponente-nombre,
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-post-title {
	order: 2;
	font-size: 1.2rem !important;
	font-weight: 800 !important;
	color: #3759b3 !important;
	margin: 0 0 8px !important;
	line-height: 1.25 !important;
}

/* --- Charla (antes "Sala", ahora la sesión real del ponente) --- */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wccr-ponente-charla,
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-speaker-sessions {
	order: 3;
	list-style: none !important;
	margin: 0 0 18px !important;
	padding: 0 !important;
	flex-grow: 1;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-speaker-sessions li {
	margin: 0;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-speaker-sessions p {
	margin: 0;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-speaker-sessions a {
	font-size: .88rem;
	line-height: 1.5;
	color: #3a4a63;
	text-decoration: none;
	font-weight: 500;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-speaker-sessions a:hover {
	color: #3759b3;
	text-decoration: underline;
}

/* --- Fecha de la sesión (pill + icono, estilo "footer" de la tarjeta) --- */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wccr-ponente-fecha,
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-session-date {
	order: 4;
	margin-top: auto !important;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding-top: 16px;
	border-top: 1px solid #eef1f6;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-session-date time {
	background-color: #d3f0ff;
	color: #053d78;
	font-weight: 700;
	font-size: .76rem;
	padding: 6px 14px;
	border-radius: 999px;
	white-space: nowrap;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-session-date::after {
	content: "\1F310";
/* 🌐 */
	font-size: .85rem;
	opacity: .55;
	line-height: 1;
}

/* Mientras la fecha no esté configurada (bug de datos, ver nota
   arriba), no mostramos la fila entera — nada de "1969" en vivo. */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker .wp-block-wordcamp-session-date:has(time[datetime^="1969-12-31"]) {
	display: none;
}

/* ============================================================
   Sistema de color por sala/track — Auditorio, Taller 1-4.
   Aprovecha las clases que WordCamp ya agrega solo al 
   (wcb_speaker_group-*). Cero HTML nuevo, cero JS.
   ============================================================ */
/* Auditorio — azul marca */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-auditorio::before {
	background: linear-gradient(90deg, #3759b3, #64c4f4);
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-auditorio .wp-block-wordcamp-avatar img {
	border-color: #3759b3;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-auditorio .wp-block-wordcamp-avatar::after {
	background-color: #3759b3;
}

/* Taller 1 — rojo marca */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller::before {
	background: linear-gradient(90deg, #ce1126, #8c1015);
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller .wp-block-wordcamp-avatar img {
	border-color: #ce1126;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller .wp-block-wordcamp-avatar::after {
	background-color: #ce1126;
}

/* Taller 2 — celeste */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller-2::before {
	background: linear-gradient(90deg, #64c4f4, #053d78);
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller-2 .wp-block-wordcamp-avatar img {
	border-color: #64c4f4;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller-2 .wp-block-wordcamp-avatar::after {
	background-color: #64c4f4;
}

/* Taller 3 — púrpura (mismo tono que Pyme Guaria en patrocinadores) */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller-3::before {
	background: linear-gradient(90deg, #7339c5, #3759b3);
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller-3 .wp-block-wordcamp-avatar img {
	border-color: #7339c5;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller-3 .wp-block-wordcamp-avatar::after {
	background-color: #7339c5;
}

/* Taller 4 — verde (mismo tono que Crestones in-kind) */
.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller-4::before {
	background: linear-gradient(90deg, #05bf62, #053d78);
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller-4 .wp-block-wordcamp-avatar img {
	border-color: #05bf62;
}

.page-slug-ponentes .wp-block-post-template > li.wcb_speaker.wcb_speaker_group-taller-4 .wp-block-wordcamp-avatar::after {
	background-color: #05bf62;
}

/* --- Responsive --- */
@media (max-width: 900px) {
	.page-slug-ponentes .wp-block-post-template.columns-3 {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (max-width: 560px) {
	.page-slug-ponentes .wp-block-post-template.columns-3 {
		grid-template-columns: 1fr !important;
	}
	
	.page-slug-ponentes .wp-block-post-template > li.wcb_speaker {
		max-width: 100%;
	}
}

/* ============================================================
   WordCamp Costa Rica 2026 — CPT wcb_sponsor (single) 
============================================================ */
/* ------------------------------------------------------------
   1. LAYOUT DEL ENCABEZADO — 2 columnas con CSS Grid
   ------------------------------------------------------------ */
.single-wcb_sponsor main > .wp-block-group.has-global-padding:first-child {
	display: grid;
	grid-template-columns: auto 1fr minmax(0, 250px);
	grid-template-areas: "categoria nivel  logo" "titulo    titulo logo";
	column-gap: 1rem;
	row-gap: .75rem;
	align-items: center;
}

/* h5 de categoría (si tuviera texto) */
.single-wcb_sponsor .categorysponsor {
	grid-area: categoria;
	margin: 0;
}

/* FIX: si el h5 está vacío (como en tu captura), se oculta
   y su columna "auto" colapsa a 0 — el nivel arranca pegado
   a la izquierda */
.single-wcb_sponsor .categorysponsor:empty {
	display: none;
}

.single-wcb_sponsor .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: auto;
}

/* Responsive: apilado en una columna */
@media (max-width: 781px) {
	.single-wcb_sponsor main > .wp-block-group.has-global-padding:first-child {
		grid-template-columns: 1fr;
		grid-template-areas: logo categoria nivel titulo;
	}
	
	.single-wcb_sponsor .wp-block-post-featured-image {
		justify-self: start;
	}
}

/* ------------------------------------------------------------
   2. ESTILO BASE DEL BADGE
   Se aplica al enlace del término (donde está el texto real)
   y también al h5 por si en algún patrocinador sí trae texto.
   ------------------------------------------------------------ */
.single-wcb_sponsor .taxonomy-wcb_sponsor_level a,
.single-wcb_sponsor .categorysponsor:not(:empty) {
	display: inline-block;
	padding: .3em .9em;
	border-radius: 4px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
}

/* ------------------------------------------------------------
   3. COLORES POR NIVEL DE PATROCINIO
   El selector principal es el enlace del término: su href
   siempre contiene el slug, sin depender de clases extra.
   El segundo selector (con :has) cubre el h5 si tiene texto.
   ------------------------------------------------------------ */
/* Oro Precolombino */
.single-wcb_sponsor .taxonomy-wcb_sponsor_level a[href*="oro-precolombino"],
.single-wcb_sponsor .wp-block-group:has(a[href*="oro-precolombino"]) .categorysponsor:not(:empty) {
	background-color: #EFBA2D;
	color: #000000;
}

/* Esferas de Plata */
.single-wcb_sponsor .taxonomy-wcb_sponsor_level a[href*="plata-esferas"],
.single-wcb_sponsor .wp-block-group:has(a[href*="plata-esferas"]) .categorysponsor:not(:empty) {
	background-color: #82A4B8;
	color: #000000;
}

/* Teatro Bronce */
.single-wcb_sponsor .taxonomy-wcb_sponsor_level a[href*="bronce-teatro"],
.single-wcb_sponsor .wp-block-group:has(a[href*="bronce-teatro"]) .categorysponsor:not(:empty) {
	background-color: #D48D38;
	color: #000000;
}

/* Pyme Guaria */
.single-wcb_sponsor .taxonomy-wcb_sponsor_level a[href*="pyme-guaria"],
.single-wcb_sponsor .wp-block-group:has(a[href*="pyme-guaria"]) .categorysponsor:not(:empty) {
	background-color: #7339C5;
	color: #ffffff;
}

/* Morpho (Freelancer) */
.single-wcb_sponsor .taxonomy-wcb_sponsor_level a[href*="freelancer-morpho"],
.single-wcb_sponsor .wp-block-group:has(a[href*="freelancer-morpho"]) .categorysponsor:not(:empty) {
	background-color: #1800AD;
	color: #ffffff;
}

/* Venue — nota: uso "/venue" con barra para reducir falsos
   positivos, porque "venue" es una cadena muy corta que podría
   aparecer en otras URLs */
.single-wcb_sponsor .taxonomy-wcb_sponsor_level a[href*="/venue"],
.single-wcb_sponsor .wp-block-group:has(a[href*="/venue"]) .categorysponsor:not(:empty) {
	background-color: #F01A2B;
	color: #ffffff;
}

/* Crestones (In-kind) */
.single-wcb_sponsor .taxonomy-wcb_sponsor_level a[href*="crestones-inkind"],
.single-wcb_sponsor .wp-block-group:has(a[href*="crestones-inkind"]) .categorysponsor:not(:empty) {
	background-color: #05BF62;
	color: #000000;
}

/* Media Partner — ojo: negro sobre #053D78 tiene muy poco
   contraste; revisá si el texto debería ser #ffffff */
.single-wcb_sponsor .taxonomy-wcb_sponsor_level a[href*="media-partner"],
.single-wcb_sponsor .wp-block-group:has(a[href*="media-partner"]) .categorysponsor:not(:empty) {
	background-color: #053D78;
	color: #000000;
}

/* ============================================================
   Card Asistentes 
============================================================ */
/* ============================================================
   Mejora visual para la sección Asistentes de WordCamp Costa Rica 2026
   Selectores basados en el HTML del plugin CampTix que se ve en tu
   captura de DevTools: #tix-attendees > ul.tix-attendee-list > li

   NOTA SOBRE COLORES (léelo antes de usar):
   Solo pude confirmar 2 colores reales del sitio, tomados directamente
   del panel de DevTools en tu captura:
     - Azul del título Asistentes (h1, inline style): #3759b3
     - Fondo del body (Computed): #d3f0ff
   No pude acceder al CSS completo del sitio (el dominio bloquea
   peticiones automatizadas fuera de tu navegador), así que NO tengo
   confirmado el color exacto del header oscuro que se ve en tu captura.
   Lo dejé fuera del código. Si quieres que el borde/hover use ese tono
   oscuro también, dame el hex exacto (puedes verlo en DevTools sobre
   el header) y lo agrego.
   Todo lo demás (radios, sombras, espaciados) son decisiones de diseño
   mías, no valores extraídos del sitio.
   ============================================================ */
#tix-attendees {
	padding: 20px 0;
}

#tix-attendees ul.tix-attendee-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

#tix-attendees ul.tix-attendee-list li {
	width: 100%;
	box-sizing: border-box;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	background-image: url('https://costarica.wordcamp.org/2026/files/2026/07/asistantcard.png');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 12px;
	padding: 24px 16px;
	box-shadow: 0 2px 8px rgba(55, 89, 179, 0.12);
	border: 1px solid #e3eefc;
	transition: transform .15s ease, box-shadow .15s ease;
}

#tix-attendees ul.tix-attendee-list li:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 20px rgba(55, 89, 179, 0.2);
}

/* Avatar */
#tix-attendees ul.tix-attendee-list li img.avatar {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	object-fit: cover;
	margin: 0 0 14px;
	border: 3px solid #ffffff;
}

/* Nombre: quitamos el margin-left:70px que viene del CSS del plugin
   (era para el layout viejo en fila con foto a la izquierda) */
#tix-attendees .tix-field.tix-attendee-name {
	margin: 0 !important;
	display: flex !important;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	font-size: 15px;
	line-height: 1.3;
}

#tix-attendees .tix-attendee-name .tix-first,
#tix-attendees .tix-attendee-name .tix-last {
	font-weight: 600;
	color: #ffffff;
}

/* Ligero acento de color de marca en el apellido, opcional */
#tix-attendees .tix-attendee-name .tix-last {
	color: #ffffff;
}

/* ============================================================
   RESPONSIVE ============================================================ */
/* Tablet: 2 columnas */
@media (max-width: 900px) {
	#tix-attendees ul.tix-attendee-list {
		grid-template-columns: repeat(2, 1fr);
		gap: 18px;
	}
	
	#tix-attendees ul.tix-attendee-list li {
		padding: 20px 14px;
	}
	
	#tix-attendees ul.tix-attendee-list li img.avatar {
		width: 84px;
		height: 84px;
	}
}

/* Móvil: 1 columna */
@media (max-width: 560px) {
	#tix-attendees {
		padding: 12px 0;
	}
	
	#tix-attendees ul.tix-attendee-list {
		grid-template-columns: 1fr;
		gap: 14px;
	}
	
	#tix-attendees ul.tix-attendee-list li {
		padding: 18px 12px;
		border-radius: 10px;
	}
	
	#tix-attendees ul.tix-attendee-list li img.avatar {
		width: 76px;
		height: 76px;
		border-width: 2px;
		margin-bottom: 10px;
	}
	
	#tix-attendees .tix-field.tix-attendee-name {
		font-size: 14px;
	}
}