/*
Theme Name: Kolokio
Theme URI: https://close.marketing
Description: Tema de bloques para Kolokio. FSE block theme con sistema de diseño personalizable.
Author: closemarketing
Author URI: https://close.marketing
Version: 2.0.0
License: GPL-2.0+
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: close-kolokio
Requires at least: 6.4
Tested up to: 6.9
Requires PHP: 7.4
*/

/* ==========================================================================
   UTILITIES
   ========================================================================== */

.u-col-30 { flex-basis: 30%; }
.u-col-40 { flex-basis: 40%; }
.u-col-45 { flex-basis: 45%; }
.u-col-50 { flex-basis: 50%; }
.u-col-55 { flex-basis: 55%; }
.u-col-60 { flex-basis: 60%; }
.u-col-70 { flex-basis: 70%; }

/* ==========================================================================
   BASE
   ========================================================================== */

body {
	overflow-x: clip;
}

:where(.wp-site-blocks) > * {
	margin-block-start: 0 !important;
}

:root :where(.is-layout-constrained) > * {
	margin-block-start: 0;
}

/* Section padding — 20px mobile, 30px desktop */
.site-header,
.site-footer,
.hero-home,
.stats-home,
.servicios-home,
.casos-home,
.empresa-intro,
.equipo-home,
.mision-vision,
.valores,
.testimonios-home,
.contacto-home,
.page-hero,
.single-post,
.sobre-el-proyecto,
.blog-archive,
.blog-filter-wrap,
.proyectos-filter-wrap,
.hub-formacion-archive,
.hub-formacion-filter-wrap,
.clientes-page {
	padding-left: 20px !important;
	padding-right: 20px !important;
	box-sizing: border-box;
}

@media (min-width: 1024px) {
	.site-header,
	.site-footer,
	.hero-home,
	.stats-home,
	.servicios-home,
	.casos-home,
	.empresa-intro,
	.equipo-home,
	.mision-vision,
	.valores,
	.testimonios-home,
	.contacto-home,
	.page-hero,
	.single-post,
	.sobre-el-proyecto,
	.blog-archive,
	.blog-filter-wrap,
	.proyectos-filter-wrap,
	.hub-formacion-archive,
	.hub-formacion-filter-wrap,
	.clientes-page {
		padding-left: 30px !important;
		padding-right: 30px !important;
	}
}

/* ==========================================================================
   GLOBAL — buttons
   ========================================================================== */

.wp-element-button {
	display: inline-flex !important;
	align-items: center;
	gap: 0.875rem;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.wp-element-button:hover,
.wp-block-button__link:hover {
	background-color: var(--wp--preset--color--secondary) !important;
	color: #fff !important;
}

.wp-element-button::after {
	content: '→';
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.1rem;
	height: 2.1rem;
	border-radius: 50%;
	background: #ffffff;
	color: var(--wp--preset--color--secondary);
	flex-shrink: 0;
	font-size: 1rem;
	line-height: 1;
}

/* ==========================================================================
   LAYOUT
   ========================================================================== */

.wp-block-cover.alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.site-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
	padding: 1rem 0;
	pointer-events: none;
}

.site-header__inner {
	background: #fff;
	border-radius: 50px;
	padding: 0.5rem 0.5rem 0.5rem 1.5rem;
	box-shadow: 0 2px 24px rgba(0, 0, 0, 0.08);
	pointer-events: all;
}

.site-header__logo {
	display: block;
	flex-shrink: 0;
}

.site-header__logo img {
	height: 55px;
	width: auto;
	display: block;
}

.site-header__right.is-layout-flex {
	gap: 1.5rem;
}

/* Nav links */
.site-header__nav .wp-block-navigation__container {
	gap: 2rem;
}

.site-header__nav .wp-block-navigation-item__content {
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--wp--preset--color--secondary-dark);
	padding: 0;
}

/* Contacto button */
.site-header__contact-btn .wp-element-button {
	border-radius: 50px !important;
	padding: 0.6rem 1.25rem;
	font-size: 0.9rem;
}

.site-header__contact-btn .wp-element-button::after {
	content: '';
	background: transparent url('/wp-content/themes/close-kolokio-theme/assets/contact-icon.svg') center / contain no-repeat;
	width: 28px;
	height: 28px;
	border-radius: 0;
	flex-shrink: 0;
}

@media (max-width: 768px) {
	.site-header {
		padding: 0;
	}

	.site-header__inner {
		border-radius: 0;
		padding: 0.6rem 20px;
		box-shadow: 0 2px 12px rgba(0,0,0,0.08);
	}

	.site-header__logo img {
		height: 40px;
	}

	.site-header__cta {
		display: none !important;
	}
}

/* ==========================================================================
   OFF-CANVAS NAV (mobile)
   ========================================================================== */

/* Hamburger — solo visible en móvil */
.site-header__hamburger {
	display: none;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--primary);
	border: none;
	border-radius: 50px;
	padding: 0.55rem 0.75rem;
	cursor: pointer;
	color: #fff;
	line-height: 1;
}

@media (max-width: 768px) {
	.site-header__hamburger {
		display: flex;
	}

	.site-header__nav {
		display: none !important;
	}
}

/* Overlay full-screen */
.offcanvas-menu {
	position: fixed;
	inset: 0;
	z-index: 9999;
	background: var(--wp--preset--color--primary);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.35s ease;
}

.offcanvas-menu.is-open {
	opacity: 1;
	pointer-events: all;
}

.offcanvas-menu__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	padding: 2rem 2rem 3rem;
	max-height: 100dvh;
	overflow-y: auto;
}

.offcanvas-menu__header {
	display: flex;
	justify-content: center;
	width: 100%;
	margin-bottom: 3rem;
}

.offcanvas-menu__logo img {
	height: 72px;
	width: auto;
	display: block;
}

.offcanvas-menu__close {
	background: none;
	border: none;
	cursor: pointer;
	color: #fff;
	padding: 0.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 2.5rem;
}

.offcanvas-menu__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.25rem;
	width: 100%;
}

.offcanvas-menu__list li a {
	display: block;
	font-size: clamp(1.1rem, 4vw, 1.4rem);
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	text-align: center;
	padding: 0.5rem 1rem;
	letter-spacing: 0.02em;
	transition: opacity 0.2s;
}

.offcanvas-menu__list li a:hover {
	opacity: 0.7;
}

/* ==========================================================================
   GLOBAL — reset block margins
   ========================================================================== */

.wp-block-group + .wp-block-group,
.wp-block-group + .wp-block-columns,
.wp-block-columns + .wp-block-group {
	margin-block-start: 0;
}

.entry-content > *,
.is-layout-flow > .wp-block-group,
.is-layout-flow > .alignfull {
	margin-block-start: 0 !important;
}

/* ==========================================================================
   FOOTER
   ========================================================================== */

.site-footer {
	padding: 2rem 0;
}

.site-footer__top {
	gap: 1.5rem;
}

.site-footer__legal.is-layout-flex {
	gap: 0 !important;
}

.site-footer__legal-links {
	font-size: 0.8rem;
	margin: 0;
}

.site-footer__legal-links a {
	text-decoration: underline;
	color: inherit;
}

.site-footer__separator {
	margin: 1.5rem 0;
}


.site-footer__social {
	display: flex;
	gap: 0.625rem;
	align-items: center;
}

.site-footer__social-link img {
	display: block;
	width: 46px;
	height: 46px;
}

.site-footer__kit-digital {
	gap: 2rem;
}

.site-footer__kit-digital-img {
	height: 56px;
	width: auto;
	display: block;
}

@media (max-width: 768px) {
	.site-footer__top,
	.site-footer__kit-digital,
	.site-footer__separator {
		padding-left: 20px !important;
		padding-right: 20px !important;
		box-sizing: border-box;
	}

	.site-footer__top {
		flex-direction: column;
		align-items: flex-start;
	}

	.site-footer__legal-links {
		overflow-wrap: break-word;
		word-break: break-word;
	}

	.site-footer__kit-digital {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 1rem;
	}

	.site-footer__kit-digital-img {
		height: auto;
		width: 100%;
		max-width: 320px;
	}
}

/* ==========================================================================
   GLOBAL — mark/highlight
   ========================================================================== */

mark {
	background: none;
	background-color: transparent;
}

/* ==========================================================================
   GLOBAL — full-width sections (break out of any constrained parent)
   ========================================================================== */

.hero-home,
.stats-home,
.servicios-home,
.clientes-home,
.casos-home,
.testimonios-home,
.contacto-home,
.site-footer {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	box-sizing: border-box;
}

/* ==========================================================================
   HERO HOME
   ========================================================================== */

.hero-home {
	padding: 7rem 0 5rem;
}

.hero-home__inner {
	gap: 3rem;
}

.hero-home__desc {

	line-height: 1.7;
	color: #444;
	margin-bottom: 2rem;
}

.hero-home__buttons {
	gap: 3rem;
	margin-bottom: 1rem;
	flex-wrap: nowrap !important;
}

.hero-home__btn-link .wp-element-button {
	background: transparent !important;
	border: none;
	border-bottom: 1.5px solid #000;
	border-radius: 0;
	box-shadow: none;
	padding: 0 0 2px 0;
	color: #000;
	font-weight: 400;
}

.hero-home__btn-link .wp-element-button:hover {
	background: transparent !important;
	color: #000;
}

.hero-home__btn-link .wp-element-button::after {
	display: none;
}

.hero-home__illustration {
	display: flex;
	justify-content: center;
}

.hero-home__img img {
	width: 100%;
	height: auto;
}

@media (max-width: 768px) {
	.hero-home {
		padding: 4.5rem 20px 2.5rem;
	}

	.hero-home__inner {
		flex-direction: column;
	}

	.hero-home__illustration {
		order: 0;
	}
}

/* ==========================================================================
   HERO SERVICIO
   ========================================================================== */

.hero-service {
	background: #ffffff;
	padding-top: 5rem;
	padding-bottom: 5rem;
}

.hero-service__inner {
	align-items: center;
	gap: 3rem;
}

.hero-service__heading {
	margin-bottom: 1.5rem;
}

.hero-service__desc {
	margin-bottom: 1rem;
}

.hero-service__buttons {
	margin-top: 2rem;
}

.hero-service__illustration {
	display: flex;
	justify-content: center;
}

.hero-service__img img {
	width: 100%;
	height: auto;
}

@media (max-width: 768px) {
	.hero-service {
		padding: 3.5rem 20px 2.5rem;
	}

	.hero-service__inner {
		flex-direction: column;
	}

	.hero-service__illustration {
		order: -1;
	}
}

/* ==========================================================================
   SERVICIO — RESULTADOS CLIENTES
   ========================================================================== */

.servicio-resultados {
	background: var(--wp--preset--color--tertiary);
	padding-top: 5rem;
	padding-bottom: 5rem;
}

.servicio-resultados__heading {
	margin-bottom: 3rem;
}

.servicio-resultados__grid {
	gap: 2rem;
}

.servicio-resultados__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.servicio-resultados__icon {
	margin: 0 0 1.5rem !important;
}

.servicio-resultados__icon img {
	width: 64px;
	height: 64px;
	display: block;
}

.servicio-resultados__item-title {
	margin-bottom: 0.75rem !important;
}

.servicio-resultados__item-desc {
	color: #555;
}

@media (max-width: 768px) {
	.servicio-resultados {
		padding: 3rem 20px;
	}

	.servicio-resultados__grid {
		flex-direction: column;
	}
}

/* ==========================================================================
   SERVICIO — POR QUÉ KOLOKIO
   ========================================================================== */

.servicio-por-que {
	background: var(--wp--preset--color--tertiary);
	padding-top: 4rem;
	padding-bottom: 4rem;
}

.servicio-por-que__card {
	background: var(--wp--preset--color--secondary);
	border-radius: 20px;
	padding: 3rem;
	overflow: hidden;
}

.servicio-por-que__inner {
	gap: 2rem;
	align-items: center;
}

.servicio-por-que__illustration {
	display: flex;
	justify-content: center;
}

.servicio-por-que__img img {
	width: 100%;
	height: auto;
}

.servicio-por-que__heading,
.servicio-por-que__desc {
	color: #ffffff !important;
}

.servicio-por-que__heading {
	margin-bottom: 1.25rem;
}

@media (max-width: 768px) {
	.servicio-por-que {
		padding: 3rem 20px;
	}

	.servicio-por-que__card {
		padding: 2rem 1.5rem;
	}

	.servicio-por-que__inner {
		flex-direction: column;
	}
}

/* ==========================================================================
   SERVICIO — PARA QUIÉN ES
   ========================================================================== */

.servicio-para-quien {
	background: #ffffff;
	padding-top: 5rem;
	padding-bottom: 5rem;
}

.servicio-para-quien__inner {
	gap: 3rem;
	align-items: center;
}

.servicio-para-quien__heading {
	margin-bottom: 1.5rem;
}

.servicio-para-quien__illustration {
	display: flex;
	justify-content: center;
}

.servicio-para-quien__img img {
	width: 100%;
	height: auto;
}

@media (max-width: 768px) {
	.servicio-para-quien {
		padding: 3.5rem 20px 2.5rem;
	}

	.servicio-para-quien__inner {
		flex-direction: column;
	}

	.servicio-para-quien__illustration {
		order: -1;
	}
}

/* ==========================================================================
   QUÉ ES KOLOKIO
   ========================================================================== */

.que-es-kolokio {
	padding: 5rem 0;
}

.que-es-kolokio__inner {
	gap: 3rem;
}

@media (max-width: 768px) {
	.que-es-kolokio {
		padding: 3rem 0;
	}

	.que-es-kolokio__inner {
		flex-direction: column;
	}

	.que-es-kolokio__content {
		order: -1;
	}
}

/* ==========================================================================
   STATS HOME
   ========================================================================== */

.stats-home {
	padding: 4rem 0;
}

.stats-home__heading {
	margin-bottom: 3rem;
}

.stats-home__grid {
	gap: 0;
}

.stats-home__item {
	padding: 0 2.5rem;
	text-align: center;
}

.stats-home__item--bordered {
	border-left: 2px solid #d0d0d0;
	border-right: 2px solid #d0d0d0;
}

.stats-home__number {
	font-size: 45px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 100;
	margin-bottom: 0;
	line-height: 1.2;
}

.stats-home__number .kolokio-counter__value {
	color: var(--wp--preset--color--secondary);
}

.stats-home__number .kolokio-counter__suffix {
	color: #000;
}

@media (max-width: 768px) {
	.stats-home__grid {
		flex-direction: column;
		gap: 2rem;
	}

	.stats-home__item--bordered {
		border-left: none;
		border-right: none;
		border-top: 2px solid #d0d0d0;
		border-bottom: 2px solid #d0d0d0;
		padding: 2rem 0;
	}

	.stats-home__item {
		padding: 0;
	}
}

/* ==========================================================================
   SERVICIOS HOME + CAROUSEL
   ========================================================================== */

.servicios-home {
	padding: 5rem 0;
}

.servicios-home__heading {
	text-align: center;
	margin-bottom: 3rem;
}

/* Carousel wrapper */
.kolokio-carousel {
	overflow: hidden;
	position: relative;
}

.kolokio-carousel__track {
	display: flex;
	gap: 1.5rem;
	touch-action: pan-y;
	align-items: stretch;
}

.kolokio-carousel__track > .wp-block-group {
	display: flex;
	flex-direction: column;
	height: auto;
}

/* Cards */
.servicios-home__card {
	background: #fff;
	padding: 2rem;
	border-radius: 16px;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	flex: 1;
	height: 100%;
	position: relative;
	cursor: pointer;
}

.servicios-home__card-title a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s;
}

.servicios-home__card-title a::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
}

.servicios-home__card:hover .servicios-home__card-title a {
	color: var(--wp--preset--color--primary);
}

/* Editor: show cards side-by-side without JS */
.editor-styles-wrapper .kolokio-carousel {
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: 1.5rem;
	overflow: hidden;
}

.editor-styles-wrapper .kolokio-carousel > .wp-block-group {
	flex: 0 0 calc( 33.333% - 1rem ) !important;
	min-width: 0;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.servicios-home__icon {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	margin-top: auto;
}

.servicios-home__icon img {
	max-height: 220px;
	max-width: 100%;
	width: auto;
	height: auto;
	display: block;
}

.servicios-home__card-title {
	margin-top: 0;
	margin-bottom: 0.75rem;
}

.servicios-home__card-desc {
	line-height: 1.7;
	color: #555;
	margin: 0 0 1rem;
}

/* Dots */
.kolokio-carousel__dots {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin-top: 2rem;
}

.kolokio-carousel__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	border: none;
	cursor: pointer;
	opacity: 0.4;
	padding: 0;
	transition: opacity 0.2s, background 0.2s;
}

.kolokio-carousel__dot--active {
	background: var(--wp--preset--color--secondary);
	opacity: 1;
}

@media (max-width: 768px) {
	.servicios-home {
		padding: 3rem 20px;
	}
}

/* ==========================================================================
   CLIENTES HOME — marquee continuo
   ========================================================================== */

.clientes-home {
	padding: 4rem 0;
	overflow: hidden;
	background-color: #ffffff;
}

.clientes-home__heading {
	text-align: center;
	margin-bottom: 2.5rem;
}

/* Query wrapper: no constrained width */
.clientes-home .wp-block-query {
	overflow: hidden;
	width: 100%;
}

/* Track: wp:post-template = ul, flex, nowrap, width driven by content */
.clientes-home__marquee-track.is-layout-flex {
	flex-wrap: nowrap !important;
	gap: 3.5rem !important;
	align-items: center;
	width: max-content;
}

/* Animation starts only after JS doubles the logos */
.clientes-home__marquee-track--ready {
	animation: clientes-marquee 30s linear infinite;
}

/* li items (wp:post-template renders ul > li) */
.clientes-home__marquee-track li {
	list-style: none;
	margin: 0;
	flex-shrink: 0;
}

.clientes-home__marquee-track li figure {
	margin: 0;
}

.clientes-home__marquee-track li img {
	height: auto;
	width: auto;
	max-height: 60px;
	display: block;
}

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

@media (max-width: 768px) {
	.clientes-home__heading {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
}

/* ==========================================================================
   CASOS DE ÉXITO HOME
   ========================================================================== */

.casos-home {
	padding: 5rem 0;
}

.casos-home__heading {
	text-align: center;
	margin-bottom: 1rem;
}

.casos-home__intro {
	text-align: center;
	color: #555;
	margin-bottom: 3rem;
}

/* wp:post-template grid inside query block */
.casos-home .wp-block-post-template.casos-home__grid {
	gap: 2rem !important;
	margin-bottom: 3rem;
	align-items: stretch !important;
}

.casos-home .wp-block-post-template.casos-home__grid > li {
	display: flex;
	flex-direction: column;
}

.casos-home__card {
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	padding: 1.25rem;
	box-sizing: border-box;
	height: 100%;
	position: relative;
	cursor: pointer;
}

/* Order: title → category → image */
.casos-home__title {
	margin: 0 0 0.25rem;
	order: 1;
}

.casos-home__title a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s;
}

.casos-home__title a::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
}

.casos-home__card:hover .casos-home__title a {
	color: var(--wp--preset--color--primary);
}

.casos-home__category {
	font-size: 0.85rem;
	font-weight: 400;
	color: #888;
	margin: 0 0 1rem;
	order: 2;
}

.casos-home__img {
	order: 3;
	margin: auto 0 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.casos-home__img img {
	width: 100%;
	height: 240px;
	object-fit: cover;
	display: block;
	border-radius: 10px;
}

.servicios-archive .casos-home__title {
	text-align: center;
}

.servicios-archive .casos-home__img {
	align-items: flex-end;
	margin-top: auto;
}

.servicios-archive .casos-home__img img {
	max-height: 220px;
	width: auto;
	height: auto;
	border-radius: 0;
}

.casos-home__img figcaption {
	display: none;
}

@media (max-width: 768px) {
	.casos-home {
		padding: 3rem 20px;
	}
}

/* ==========================================================================
   TESTIMONIOS HOME
   ========================================================================== */

.testimonios-home {
	padding: 5rem 0;
}

.testimonios-home__inner {
	gap: 3rem;
}

.testimonios-home__meta {
	flex-basis: 40%;
}

.testimonios-home__quote-col {
	flex-basis: 60%;
}

.testimonios-home__heading {
	margin-bottom: 1rem;
	margin-top: 0;
}

.testimonios-home__rating {
	margin: 0 0 1rem;
	color: #333;
	font-size: 0.95rem;
}

.testimonios-home__rating .testimonios-home__stars {
	color: var(--wp--preset--color--secondary);
}

.testimonios-home__intro {
	color: #555;
	margin: 0;
}

.testimonios-home__card {
	background: #fff;
	border-radius: 16px;
	padding: 2rem 2.5rem;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1.5rem;
	border-left: none;
	margin: 0;
}

.testimonios-home__card p {
	font-size: 1rem;
	line-height: 1.8;
	margin: 0;
	font-style: normal;
}

.testimonios-home__card cite {
	font-size: 0.9rem;
	font-style: normal;
	color: var(--wp--preset--color--secondary-dark);
}

.testimonios-home__author-row.wp-block-group {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0;
}

.testimonios-home__avatar {
	margin: 0;
	flex-shrink: 0;
}

.testimonios-home__avatar img {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.testimonios-home__rating {
	color: #333;
	font-size: 1.1rem;
	letter-spacing: 0;
}

@media (max-width: 768px) {
	.testimonios-home {
		padding: 2.5rem 0;
	}

	.testimonios-home__inner {
		flex-direction: column;
		gap: 1.5rem;
		padding-left: 20px !important;
		padding-right: 20px !important;
	}

	.testimonios-home__meta,
	.testimonios-home__quote-col {
		flex-basis: auto !important;
		width: 100% !important;
	}

	.testimonios-home__card {
		padding: 1.25rem;
		gap: 1rem;
	}

	.testimonios-home__card p {
		font-size: 0.95rem;
		line-height: 1.65;
	}
}

/* ==========================================================================
   CONTACTO HOME
   ========================================================================== */

.contacto-home__inner {
	gap: 3rem;
	align-items: center;
	background: #fff;
	border-radius: 24px;
	padding: 3rem;
}

.contacto-home__left {
	flex-basis: 40%;
}

.contacto-home__heading {
	margin-bottom: 1rem;
}

.contacto-home__intro {
	color: #555;
	margin-bottom: 1.5rem;
}

.contacto-home__img {
	margin: 0;
}

.contacto-home__img img {
	width: 60%;
	height: auto;
	display: block;
}

@media (max-width: 768px) {
	.contacto-home {
		padding: 2rem 0;
	}

	.contacto-home__inner {
		flex-direction: column;
		padding: 1.5rem 20px;
		gap: 1.5rem;
		border-radius: 16px;
		margin-left: 20px !important;
		margin-right: 20px !important;
		box-sizing: border-box;
		width: auto !important;
		max-width: none !important;
	}

	.contacto-home__img {
		display: none;
	}
}

/* ==========================================================================
   GRAVITY FORMS — contacto-home
   ========================================================================== */

.contacto-home__form-col {
	flex-basis: 60%;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.contacto-home__form-col .gform_wrapper {
	width: 100%;
	--gf-ctrl-color: #333;
	--gf-ctrl-color-hover: #333;
	--gf-ctrl-color-focus: #333;
	--gf-ctrl-bg-color: #f0f0f0;
	--gf-ctrl-bg-color-hover: #e8e8e8;
	--gf-ctrl-bg-color-focus: #f0f0f0;
	--gf-color-in-ctrl-contrast: #333;
	--gf-ctrl-border-width: 0px;
	--gf-ctrl-radius: 50px;
}

/* Hide required note */
.contacto-home__form-col .gform_required_legend {
	display: none !important;
}

/* Let GF handle its own 12-col grid; just reset list styles */
.contacto-home__form-col .gform_fields {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	row-gap: 1rem !important;
}

.contacto-home__form-col .gfield_label {
	display: block !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	color: #333 !important;
	margin-bottom: 0.4rem !important;
}

/* Required asterisk color */
.contacto-home__form-col .gfield_required {
	color: var(--wp--preset--color--secondary) !important;
}

/* Inputs */
.contacto-home__form-col .ginput_container input[type="text"],
.contacto-home__form-col .ginput_container input[type="email"],
.contacto-home__form-col .ginput_container input[type="tel"],
.contacto-home__form-col .ginput_container input[type="number"],
.contacto-home__form-col .ginput_container textarea {
	width: 100% !important;
	background: #f0f0f0 !important;
	border: none !important;
	border-radius: 50px !important;
	padding: 0.75rem 1.25rem !important;
	font-size: 0.95rem !important;
	color: #333 !important;
	-webkit-text-fill-color: #333 !important;
	outline: none !important;
	box-sizing: border-box !important;
	box-shadow: none !important;
	appearance: none !important;
	-webkit-appearance: none !important;
}

/* Select */
.contacto-home__form-col .ginput_container select,
.contacto-home__form-col .gform_wrapper .ginput_container_select select,
.contacto-home__form-col [data-form-theme] .ginput_container select {
	width: 100% !important;
	background: #f0f0f0 !important;
	background-color: #f0f0f0 !important;
	border: none !important;
	border-radius: 50px !important;
	font-size: 17px !important;
	font-family: var(--wp--preset--font-family--display) !important;
	font-weight: 300 !important;
	color: #3A3438 !important;
	-webkit-text-fill-color: #3A3438 !important;
	word-wrap: break-word !important;
	outline: none !important;
	box-sizing: border-box !important;
	box-shadow: none !important;
	appearance: none !important;
	-webkit-appearance: none !important;
}

.contacto-home__form-col .ginput_container select option {
	background: #fff;
	color: #333;
	-webkit-text-fill-color: #333;
}

.contacto-home__form-col .ginput_container textarea {
	border-radius: 16px !important;
	resize: none !important;
	min-height: 80px !important;
}

.contacto-home__form-col .ginput_container_select {
	position: relative;
}

.contacto-home__form-col .ginput_container_select::after {
	content: '';
	pointer-events: none;
	position: absolute;
	right: 1.25rem;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23666' d='M5 7l5 5 5-5z'/%3E%3C/svg%3E") center / contain no-repeat;
	z-index: 3;
}

/* Footer / submit row */
.contacto-home__form-col .gform_footer,
.contacto-home__form-col .gform_page_footer {
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	gap: 1.5rem !important;
	margin-top: 1rem !important;
	flex-wrap: wrap !important;
	padding: 0 !important;
}

/* Privacy text */
.contacto-home__form-col .gfield_description,
.contacto-home__form-col .gform_description,
.contacto-home__form-col .gfield_html p,
.contacto-home__form-col .gfield--type-html p {
	font-size: 14px !important;
	font-family: var(--wp--preset--font-family--display) !important;
	font-weight: 300 !important;
	color: #aaa !important;
	word-wrap: break-word !important;
	line-height: 1.5 !important;
	margin: 0 !important;
}

/* Submit button — same visual as .wp-element-button hero buttons */
.contacto-home__form-col button.gform_button {
	display: inline-flex !important;
	align-items: center !important;
	gap: 0.875rem !important;
	background: var(--wp--preset--color--primary) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 50px !important;
	padding: 0.75rem 1.5rem !important;
	font-size: 0.95rem !important;
	font-weight: 600 !important;
	cursor: pointer !important;
	transition: background 0.2s !important;
	white-space: nowrap !important;
	margin-left: auto !important;
}

.contacto-home__form-col button.gform_button::after {
	content: '→' !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 2.1rem !important;
	height: 2.1rem !important;
	border-radius: 50% !important;
	background: #ffffff !important;
	color: var(--wp--preset--color--secondary) !important;
	flex-shrink: 0 !important;
	font-size: 1rem !important;
	line-height: 1 !important;
}

.contacto-home__form-col button.gform_button:hover {
	background: var(--wp--preset--color--secondary) !important;
}

.contacto-home__form-col .gform_anchor,
.contacto-home__form-col .gform_validation_errors {
	display: none !important;
}

@media (max-width: 768px) {
	.contacto-home__form-col .gform_fields {
		grid-template-columns: 1fr !important;
	}
}

.gform-theme--foundation #field_submit {
	align-items: center !important;
}

/* ==========================================================================
   PAGE HERO — título dinámico de página interior
   ========================================================================== */

.page-hero {
	padding: 8rem 0 3rem;
	background: var(--wp--preset--color--tertiary);
	display: flex;
	justify-content: center;
	align-items: center;
}

.page-hero__title {
	margin: 0 !important;
	text-align: center;
}

/* ==========================================================================
   CLIENTES PAGE — grid de clientes con logo y nombre
   ========================================================================== */

.clientes-page {
	padding: 3rem 0 5rem;
}

.clientes-page .wp-block-post-template.clientes-page__grid {
	gap: 2rem !important;
	align-items: stretch !important;
}

.clientes-page .wp-block-post-template.clientes-page__grid > li {
	display: flex;
	flex-direction: column;
}

.clientes-page__card {
	background: #fff;
	border-radius: 12px;
	padding: 2rem 1.5rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.25rem;
	height: 100%;
	box-sizing: border-box;
}

.clientes-page__logo {
	margin: 0;
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.clientes-page__logo img {
	max-height: 140px;
	max-width: 100%;
	width: auto;
	height: auto;
	display: block;
	margin: 0 auto;
}

.clientes-page__name.wp-block-post-title {
	font-weight: 600;
	text-align: center;
	margin: 0;
}

/* ==========================================================================
   EQUIPO HOME
   ========================================================================== */

.equipo-home {
	padding: 4rem 0;
}

.equipo-home__heading {
	margin-bottom: 2rem;
	text-align: left !important;
}

.equipo-home__grid {
	gap: 1.5rem;
	align-items: stretch !important;
}

.equipo-home__card {
	background: rgba(255,255,255,0.5);
	border-radius: 16px;
	display: flex !important;
	flex-direction: column;
	gap: 0;
}

.equipo-home__card-header.wp-block-group {
	background: #fff;
	border-radius: 12px 12px 0 0;
	padding: 1.5rem;
	display: flex !important;
	flex-direction: row;
	align-items: center;
	gap: 1.25rem;
}

.equipo-home__card-body.wp-block-group {
	border-radius: 0 0 12px 12px;
	padding: 1.5rem;
}

.equipo-home__avatar {
	flex-shrink: 0;
	margin: 0;
}

.equipo-home__avatar img {
	width: 160px;
	height: 160px;
	object-fit: cover;
	border-radius: 12px;
	display: block;
}

.equipo-home__card-info.wp-block-group {
	display: flex !important;
	flex-direction: column;
	gap: 0.25rem;
}

.equipo-home__name {
	margin: 0 !important;
}

.equipo-home__role {
	margin: 0;
}

/* ==========================================================================
   SERVICIO — QUÉ INCLUYE
   ========================================================================== */

.servicio-incluye {
	padding: 5rem 0;
	background: var(--wp--preset--color--tertiary);
}

.servicio-incluye__intro-heading {
	margin-bottom: 2.5rem;
}

.servicio-incluye__intro-cols {
	margin-bottom: 4rem;
	gap: 3rem;
}

.servicio-incluye__divider {
	margin-bottom: var(--wp--preset--spacing--80);
	background-color: #1414263d;
	color: #1414263d;
}

.servicio-incluye__inner {
	gap: 3rem;
	align-items: flex-start !important;
}

.servicio-incluye__heading-col {
	position: sticky;
	top: 7rem;
}

.servicio-incluye__logo-icon {
	margin: 0 0 1.5rem !important;
}

.servicio-incluye__logo-icon img {
	width: 48px;
	height: auto;
	display: block;
}

.servicio-incluye__heading {
	margin: 0;
}

.servicio-incluye__list-col {
	display: flex;
	flex-direction: column;
}

.servicio-incluye__item.wp-block-group {
	gap: 1.5rem;
	padding: 2rem 0;
}

.servicio-incluye__item.wp-block-group + .servicio-incluye__item.wp-block-group {
	border-top: 1px solid #c8c8c8 !important;
}

.servicio-incluye__item.wp-block-group:first-child {
	padding-top: 0;
}

.servicio-incluye__icon {
	flex-shrink: 0;
	margin: 0;
}

.servicio-incluye__icon img {
	width: 36px;
	height: 36px;
	display: block;
}

.servicio-incluye__item-text.wp-block-group {
	flex: 1;
}

.servicio-incluye__item-title {
	margin: 0 0 0.5rem !important;
}

.servicio-incluye__item-desc {
	margin: 0 !important;
	color: #555;
	line-height: 1.65;
}

@media (max-width: 768px) {
	.servicio-incluye {
		padding: 3rem 20px;
	}

	.servicio-incluye__intro-cols {
		flex-direction: column;
	}

	.servicio-incluye__inner {
		flex-direction: column;
	}

	.servicio-incluye__heading-col {
		position: static;
	}
}

/* ==========================================================================
   VALORES
   ========================================================================== */

.valores {
	padding: 4rem 0;
}

.valores__inner {
	gap: 3rem;
	align-items: flex-start !important;
}

.valores__heading-col {
	flex-basis: 30%;
	position: sticky;
	top: 7rem;
}

.valores__heading {
	margin: 0;
}

.valores__list-col {
	flex-basis: 70%;
	display: flex;
	flex-direction: column;
}

.valores__item.wp-block-group {
	gap: 1.5rem;
	padding: 2rem 0;
	border-bottom: 1px solid #e0e0e0;
}

.valores__item.wp-block-group:first-child {
	padding-top: 0;
}

.valores__item.wp-block-group:last-child {
	border-bottom: none;
}

.valores__icon {
	flex-shrink: 0;
	margin: 0;
}

.valores__icon img {
	width: 52px;
	height: 52px;
	display: block;
}

.valores__item-text.wp-block-group {
	flex: 1;
}

.valores__item-title {
	margin: 0 0 0.5rem !important;
}

.valores__item-desc {
	margin: 0 !important;
	color: #555;
	line-height: 1.65;
}

@media (max-width: 768px) {
	.valores__inner {
		flex-direction: column;
	}

	.valores__heading-col {
		position: static;
	}
}

/* ==========================================================================
   MISIÓN Y VISIÓN
   ========================================================================== */

.mision-vision {
	padding: 4rem 0;
}

.mision-vision__row {
	gap: 3rem;
}

.mision-vision__row:last-child {
	margin-bottom: 0;
}

.mision-vision__heading {
	margin-bottom: 1rem;
}

.mision-vision__img {
	display: flex;
	justify-content: center;
}

.mision-vision__img img {
	width: 60%;
	height: auto;
}

@media (max-width: 768px) {
	.mision-vision__row {
		flex-direction: column;
		margin-bottom: 2.5rem;
	}

	.mision-vision__row:last-child .mision-vision__content {
		order: -1;
	}
}

/* ==========================================================================
   SOBRE EL PROYECTO — patrón single proyecto
   ========================================================================== */

.sobre-el-proyecto {
	padding: 4rem 0;
	background: var(--wp--preset--color--tertiary);
}

.sobre-el-proyecto__inner {
	gap: 4rem;
	align-items: flex-start;
}

.sobre-el-proyecto__content {
	flex-basis: 42%;
	position: sticky;
	top: 6rem;
	align-self: flex-start;
}

.sobre-el-proyecto__media {
	flex-basis: 58%;
}

.sobre-el-proyecto__heading {
	margin-bottom: 0.5rem;
}

/* Service label — shortcode [kolokio_servicio] */
.sobre-el-proyecto__service {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 1.5rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.sobre-el-proyecto__desc {
	color: #444;
	line-height: 1.75;
	margin-bottom: 1rem;
}

.sobre-el-proyecto__card {
	background: #ffffff;
	border-radius: 16px;
	padding: 2rem;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.07);
	margin-bottom: 20px; 
}

.sobre-el-proyecto__card .wp-block-image {
	margin: 0;
}

.sobre-el-proyecto__card .wp-block-image img {
	width: 100%;
	height: auto;
	border-radius: 8px;
	display: block;
}

@media (max-width: 768px) {
	.sobre-el-proyecto {
		padding: 3rem 20px;
	}

	.sobre-el-proyecto__inner {
		flex-direction: column;
		gap: 2rem;
	}
}

/* ==========================================================================
   PROYECTOS FILTER — archivo proyectos
   ========================================================================== */

.proyectos-filter-wrap {
	padding-top: 2rem;
	padding-bottom: 0;
}

.servicios-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	justify-content: center;
	margin-bottom: 1.5rem;
}

.servicios-filter__btn {
	background: #fff;
	border: 1.5px solid #ddd;
	border-radius: 50px;
	padding: 0.45rem 1.1rem;
	font-size: 0.9rem;
	font-family: inherit;
	color: var(--wp--preset--color--black);
	cursor: pointer;
	transition: border-color 0.2s, background 0.2s, color 0.2s;
	line-height: 1.4;
}

.servicios-filter__btn:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.servicios-filter__btn.is-active {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: #fff;
}

.proyectos-filter {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	max-width: 480px;
	margin: 0 auto;
	background: #fff;
	border: 1.5px solid #ddd;
	border-radius: 50px;
	padding: 0.6rem 1.25rem;
	transition: border-color 0.2s;
}

.proyectos-filter:focus-within {
	border-color: var(--wp--preset--color--primary);
}

.proyectos-filter__icon {
	flex-shrink: 0;
}

.proyectos-filter__input {
	border: none;
	outline: none;
	background: transparent;
	font-size: 0.95rem;
	width: 100%;
	color: var(--wp--preset--color--black);
}

.proyectos-filter__input::placeholder {
	color: #aaa;
}

.proyectos-filter__input::-webkit-search-cancel-button {
	cursor: pointer;
}


/* ==========================================================================
   PROYECTOS RELACIONADOS — single proyecto
   ========================================================================== */

.proyectos-rel {
	padding: 5rem 0;
}

.proyectos-rel__heading {
	margin-bottom: 1rem;
}

.proyectos-rel__intro {
	color: #555;
	margin-bottom: 3rem;
}

/* wp:post-template with grid layout generates .is-layout-grid */
.proyectos-rel__grid.is-layout-grid {
	gap: 1.5rem !important;
	margin-bottom: 3rem;
	align-items: stretch !important;
}

.proyectos-rel__grid.is-layout-grid > li {
	display: flex;
	flex-direction: column;
}

/* Card — wp:group inside post-template */
.proyectos-rel__card.wp-block-group {
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
	transition: box-shadow 0.2s;
	padding: 0;
	height: 100%;
	display: flex;
	flex-direction: column;
	position: relative;
	cursor: pointer;
}

.proyectos-rel__card.wp-block-group:hover {
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.1);
}

.proyectos-rel__card.wp-block-group:hover .proyectos-rel__title a {
	color: var(--wp--preset--color--primary);
}

/* Title — wp:post-title inside card */
.proyectos-rel__card .proyectos-rel__title {
	font-size: 1.1rem;
	font-weight: 700;
	margin: 1.25rem 1.25rem 0.35rem;
}

.proyectos-rel__card .proyectos-rel__title a {
	text-decoration: none;
	color: var(--wp--preset--color--black);
}

.proyectos-rel__card .proyectos-rel__title a::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Service label — wp:kolokio/proyecto-servicio renders .casos-home__category */
.proyectos-rel__card .casos-home__category {
	font-size: 0.85rem;
	color: #888;
	margin: 0 1.25rem 1rem;
	order: unset;
}

/* Featured image — wp:post-featured-image */
.proyectos-rel__card .proyectos-rel__img,
.proyectos-rel__card .wp-block-post-featured-image {
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 0 0 1.25rem;
	margin-top: auto;
}

.proyectos-rel__card .proyectos-rel__img img,
.proyectos-rel__card .wp-block-post-featured-image img {
	width: auto;
	max-width: 100%;
	height: 200px;
	object-fit: contain;
	display: block;
	border-radius: 8px;
}

@media (max-width: 768px) {
	.proyectos-rel {
		padding: 3rem 20px;
	}

	.proyectos-rel__query .is-layout-grid {
		grid-template-columns: 1fr !important;
	}
}

@media (max-width: 768px) {
	.servicio-incluye__heading-col,
	.valores__heading-col,
	.sobre-el-proyecto__content {
		position: static;
	}
}

/* ==========================================================================
   EVENTO META — shortcode [kolokio_post_meta]
   ========================================================================== */

.evento-meta {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
}

.evento-meta__row {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.5;
}

.evento-meta__label {
	font-weight: 600;
	color: var(--wp--preset--color--primary);
	flex-shrink: 0;
	min-width: 3.5rem;
}

.evento-meta__value {
	color: #444;
}

.evento-meta__value a {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	word-break: break-all;
}

/* Card variant — compact, inside archive card */
.evento-meta--card {
	padding: 0 1.25rem 1.25rem;
}

/* Single variant — prominent box above content */
.evento-meta--single {
	background: var(--wp--preset--color--tertiary);
	border-left: 4px solid var(--wp--preset--color--primary);
	border-radius: 0 8px 8px 0;
	padding: 1.25rem 1.5rem;
	margin: 2rem 0;
	gap: 0.5rem;
}

.evento-meta--single .evento-meta__label {
	min-width: 4.5rem;
}

/* Poster button wrapper — flex row: meta left, button right */
.evento-meta__wrapper {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	flex-wrap: wrap;
	margin: 2rem 0;
}

.evento-meta__wrapper .evento-meta--single {
	margin: 0;
	flex: 1 1 auto;
}

.evento-meta__poster {
	flex-shrink: 0;
}

.evento-meta__poster-btn {
	border-radius: 50px !important;
	padding: 0.75rem 1.5rem !important;
	font-size: 0.9rem !important;
	white-space: nowrap;
}

/* Single post layout */
.single-post {
	padding: 3rem 0 5rem;
}

/* Contain wide/full blocks inside single post content */
.single-post .wp-block-post-content .alignwide,
.single-post .wp-block-post-content .alignfull {
	max-width: 100% !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.single-post__terms {
	margin-top: 3rem;
	padding-top: 1.5rem;
	border-top: 1px solid #eee;
	gap: 1rem;
}

/* ==========================================================================
   BLOG FILTER — filtro de categorías hijas + buscador
   ========================================================================== */

.blog-filter-wrap {
	padding-top: 2rem;
	padding-bottom: 0;
}

.categorias-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	justify-content: center;
	margin-bottom: 1.5rem;
}

.categorias-filter__btn {
	background: #fff;
	border: 1.5px solid #ddd;
	border-radius: 50px;
	padding: 0.45rem 1.1rem;
	font-size: 0.9rem;
	font-family: inherit;
	color: var(--wp--preset--color--black);
	cursor: pointer;
	transition: border-color 0.2s, background 0.2s, color 0.2s;
	line-height: 1.4;
}

.categorias-filter__btn:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.categorias-filter__btn.is-active {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: #fff;
}

.blog-filter {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	max-width: 480px;
	margin: 0 auto;
	background: #fff;
	border: 1.5px solid #ddd;
	border-radius: 50px;
	padding: 0.6rem 1.25rem;
	transition: border-color 0.2s;
}

.blog-filter:focus-within {
	border-color: var(--wp--preset--color--primary);
}

.blog-filter__icon {
	flex-shrink: 0;
}

.blog-filter__input {
	border: none;
	outline: none;
	background: transparent;
	font-size: 0.95rem;
	width: 100%;
	color: var(--wp--preset--color--black);
}

.blog-filter__input::placeholder {
	color: #aaa;
}

.blog-filter__input::-webkit-search-cancel-button {
	cursor: pointer;
}


/* ==========================================================================
   BLOG ARCHIVE — categorías y archivos de entradas
   ========================================================================== */

.blog-archive {
	padding: 3rem 0 5rem;
}

.blog-archive .wp-block-post-template.blog-archive__grid {
	gap: 2rem !important;
	align-items: stretch !important;
	margin-bottom: 2.5rem;
}

.blog-archive .wp-block-post-template.blog-archive__grid > li {
	display: flex;
	flex-direction: column;
}

.blog-archive__card {
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	cursor: pointer;
	transition: box-shadow 0.2s;
	gap: 0;
}

.blog-archive__card:hover {
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.1);
}

.blog-archive__img {
	margin: 0;
	width: 100%;
	flex-shrink: 0;
}

.blog-archive__img img {
	width: 100%;
	height: 280px;
	object-fit: cover;
	display: block;
	border-radius: 0;
}

.blog-archive__title {
	font-size: 1.1rem;
	font-weight: 700;
	margin: 0.75rem 1.25rem 0.25rem !important;
}

.blog-archive__title a {
	text-decoration: none;
	color: var(--wp--preset--color--black);
	transition: color 0.2s;
}

.blog-archive__title a::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
}

.blog-archive__card:hover .blog-archive__title a {
	color: var(--wp--preset--color--primary);
}

.blog-archive__category {
	font-size: 0.78rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--primary);
	margin: 0 1.25rem 0.2rem !important;
}

.blog-archive__date {
	font-size: 0.8rem;
	color: #aaa;
	margin: 0 1.25rem 0.2rem !important;
	margin-block-start: 0 !important;
}

.blog-archive__excerpt {
	font-size: 0.9rem;
	color: #555;
	line-height: 1.6;
	margin: 0 1.25rem 1.25rem !important;
}

.blog-archive__pagination {
	margin-top: 2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.4rem;
	flex-wrap: wrap;
}

.blog-archive__pagination .wp-block-query-pagination-numbers,
.blog-archive__pagination.wp-block-query-pagination {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	flex-wrap: wrap;
}

.blog-archive__pagination a,
.blog-archive__pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.25rem;
	height: 2.25rem;
	padding: 0 0.6rem;
	border-radius: 6px;
	font-size: 0.9rem;
	font-weight: 500;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}

.blog-archive__pagination a {
	background: #fff;
	color: var(--wp--preset--color--black);
	border: 1.5px solid #ddd;
}

.blog-archive__pagination a:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.blog-archive__pagination .current,
.blog-archive__pagination span.page-numbers:not(.dots) {
	background: var(--wp--preset--color--primary);
	color: #fff;
	border: 1.5px solid var(--wp--preset--color--primary);
}

.blog-archive__pagination .dots {
	background: transparent;
	border: none;
	color: #aaa;
	min-width: auto;
	padding: 0 0.25rem;
}

@media (max-width: 768px) {
	.blog-archive {
		padding: 2rem 20px 3rem;
	}

	.blog-archive .wp-block-post-template.blog-archive__grid {
		grid-template-columns: 1fr !important;
	}
}

/* ==========================================================================
   HUB FORMACIÓN — filtro + archivo
   ========================================================================== */

.hub-formacion-filter-wrap {
	padding-top: 2rem;
	padding-bottom: 0;
}

.hub-formacion-filter-btns {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	justify-content: center;
	margin-bottom: 1.5rem;
}

.hub-formacion-filter__btn {
	background: #fff;
	border: 1.5px solid #ddd;
	border-radius: 50px;
	padding: 0.45rem 1.1rem;
	font-size: 0.9rem;
	font-family: inherit;
	color: var(--wp--preset--color--black);
	cursor: pointer;
	transition: border-color 0.2s, background 0.2s, color 0.2s;
	line-height: 1.4;
}

.hub-formacion-filter__btn:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.hub-formacion-filter__btn.is-active {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: #fff;
}

.hub-formacion-filter {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	max-width: 480px;
	margin: 0 auto;
	background: #fff;
	border: 1.5px solid #ddd;
	border-radius: 50px;
	padding: 0.6rem 1.25rem;
	transition: border-color 0.2s;
}

.hub-formacion-filter:focus-within {
	border-color: var(--wp--preset--color--primary);
}

.hub-formacion-filter__icon {
	flex-shrink: 0;
}

.hub-formacion-filter__input {
	border: none;
	outline: none;
	background: transparent;
	font-size: 0.95rem;
	width: 100%;
	color: var(--wp--preset--color--black);
}

.hub-formacion-filter__input::placeholder {
	color: #aaa;
}

.hub-formacion-filter__input::-webkit-search-cancel-button {
	cursor: pointer;
}

.hub-formacion-archive {
	padding: 3rem 0 5rem;
}

.hub-formacion-archive .wp-block-post-template.hub-formacion-archive__grid {
	gap: 2rem !important;
	align-items: stretch !important;
}

.hub-formacion-archive .wp-block-post-template.hub-formacion-archive__grid > li {
	display: flex;
	flex-direction: column;
}

.hub-formacion-archive__card {
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	cursor: pointer;
	transition: box-shadow 0.2s;
	gap: 0;
}

.hub-formacion-archive__card:hover {
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.1);
}

.hub-formacion-archive__img {
	margin: 0;
	width: 100%;
	flex-shrink: 0;
}

.hub-formacion-archive__img img {
	width: 100%;
	height: 280px;
	object-fit: cover;
	display: block;
	border-radius: 0;
}

.hub-formacion-archive__title {
	font-size: 1.1rem;
	font-weight: 700;
	margin: 0.75rem 1.25rem 0.25rem !important;
}

.hub-formacion-archive__title a {
	text-decoration: none;
	color: var(--wp--preset--color--black);
	transition: color 0.2s;
}

.hub-formacion-archive__title a::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
}

.hub-formacion-archive__card:hover .hub-formacion-archive__title a {
	color: var(--wp--preset--color--primary);
}

.hub-formacion-archive__category {
	font-size: 0.78rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--primary);
	margin: 0 1.25rem 0.2rem !important;
	margin-block-start: 0 !important;
}

@media (max-width: 768px) {
	.hub-formacion-archive {
		padding: 2rem 20px 3rem;
	}

	.hub-formacion-archive .wp-block-post-template.hub-formacion-archive__grid {
		grid-template-columns: 1fr !important;
	}
}