/* core/group — "Tarjeta" y "Tarjeta superpuesta" (V3 §6.4). */

.wp-block-group.is-style-tarjeta {
	border-radius: 4px;
	background-color: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--soft);
	color: var(--wp--preset--color--ink);
}

.wp-block-group.is-style-tarjeta-superpuesta {
	position: relative;
	z-index: 1;
	border-radius: 4px;
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
}

/* El borde solo en escritorio: en móvil la tarjeta no lleva relleno. */
@media (width > 781px) {

	.wp-block-group.is-style-tarjeta-superpuesta {
		margin-inline-start: calc(-1 * var(--wp--preset--spacing--70));
		border: 1px solid var(--wp--preset--color--gray);
	}
}

/* ---- Inicio en móvil (diseño Stitch móvil) ---- */
@media (width <= 781px) {

	/* Hero: filete a todo el ancho y foto 4:5 al final. */
	.katfin-hero .katfin-eyebrow--rule::after {
		width: 100%;
	}

	.katfin-hero .katfin-hero__image img {
		aspect-ratio: 4 / 5 !important;
		object-position: top;
	}

	/* ¿Por qué?: logo y texto centrados; valores en filas. */
	.katfin-por-que .wp-block-columns > .wp-block-column:first-child {
		display: flex;
		justify-content: center;
	}

	.katfin-por-que .katfin-eyebrow,
	.katfin-por-que h2,
	.katfin-por-que__intro {
		text-align: center;
	}

	.katfin-valores {
		grid-template-columns: 1fr !important;
	}

	.katfin-valor {
		display: grid !important;
		grid-template-columns: 2rem 1fr;
		align-items: baseline;
		column-gap: 0.75rem;
		row-gap: 0.5rem;
		padding-block-end: 1.25rem;
		border-block-end: 1px solid rgb(194 174 113 / 30%);
	}

	.katfin-valor:last-child {
		border-block-end: 0;
	}

	.katfin-valor > * {
		margin: 0 !important;
	}

	.katfin-valor .katfin-number--big {
		width: auto;
		padding: 0;
		border: 0;
		font-size: 1.5rem;
	}

	.katfin-valor > h3 {
		grid-column: 2;
		font-size: 1.25rem;
	}

	.katfin-valor > p:not(.katfin-number) {
		grid-column: 2;
	}

	/* CTA: titular más compacto; texto en negrita para mantener contraste. */
	.katfin-cta h2 {
		font-size: 1.75rem;
	}

	.katfin-cta .katfin-cta__text {
		font-size: 1.1875rem;
		font-weight: 700;
	}

	/* Horarios compactos. */
	.katfin-horarios .katfin-horarios__title {
		font-size: 0.9375rem;
		letter-spacing: 0.1em;
	}

	.katfin-horarios .katfin-horarios__title::after {
		display: none;
	}

	.katfin-horarios .katfin-horarios__open {
		font-size: 1rem;
	}

	.katfin-horarios .katfin-horarios__closed {
		color: var(--wp--preset--color--gold-pale);
		font-size: 0.8125rem;
	}

	.katfin-disclaimer .katfin-disclaimer__text {
		font-size: 0.75rem;
	}
}

/* ---- Contacto (diseño Stitch) ---- */

/* Tarjeta: titular en mayúsculas y datos en filas etiqueta/valor. */
.katfin-contacto__card {
	box-shadow: 0 1px 2px rgb(0 0 0 / 5%);
}

.katfin-contacto__title {
	line-height: 1.15;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.katfin-contacto__datos {
	padding-block-start: var(--wp--preset--spacing--20);
	border-block-start: 1px solid var(--wp--preset--color--gray);
}

.katfin-contacto__fila {
	display: grid;
	gap: 0.25rem;
	padding-block: 0.5rem;
}

.katfin-contacto__fila + .katfin-contacto__fila {
	border-block-start: 1px solid var(--wp--preset--color--gray);
}

.katfin-contacto__fila > * {
	margin: 0 !important;
}

.katfin-contacto .katfin-label {
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.01em;
}

.katfin-contacto__fila .wp-block-buttons.is-style-katfin-text .wp-block-button__link {
	color: var(--wp--preset--color--ink);
	font-weight: 500;
	text-decoration: none;
	overflow-wrap: anywhere;
}

.katfin-contacto__fila .wp-block-buttons.is-style-katfin-text .wp-block-button__link:is(:hover, :focus-visible) {
	color: var(--wp--preset--color--gold-dark);
	text-decoration: underline;
}

.katfin-contacto__fila p:not(.katfin-label) {
	color: var(--wp--preset--color--gray-dark);
}

/* Horarios a dos columnas. */
.katfin-horarios-columnas__title {
	padding-inline-start: var(--wp--preset--spacing--30);
	border-inline-start: 2px solid var(--wp--preset--color--gold-dark);
	font-size: 1.375rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.katfin-horarios-columnas p {
	margin: 0;
}

.katfin-horarios-columnas__closed {
	font-weight: 500;
}

@media (width > 781px) {

	.katfin-contacto__fila {
		grid-template-columns: 1fr 2fr;
		align-items: baseline;
	}

	/*
	 * Acciones lado a lado: la tarjeta es estrecha para el tamaño de botón
	 * global, así que aquí se compactan y comparten el ancho sin saltar de línea.
	 */
	.katfin-contacto__acciones {
		flex-wrap: nowrap;
		gap: var(--wp--preset--spacing--20);
	}

	.katfin-contacto__acciones > .wp-block-button {
		flex: 1 1 auto;
	}

	.katfin-contacto__acciones .wp-block-button__link {
		box-sizing: border-box;
		width: 100%;
		height: 100%;
		padding-inline: 1rem;
		text-wrap: balance;
	}

	/* Foto alta como en el diseño; la tarjeta se superpone por la izquierda. */
	.katfin-contacto .katfin-contacto__image img {
		width: 100% !important;
		height: clamp(520px, 50vw, 700px) !important;
		aspect-ratio: auto !important;
	}
}

/* Contacto en móvil: sin tarjeta, datos en un recuadro crema. */
@media (width <= 781px) {

	.katfin-contacto.has-background {
		padding-block: var(--wp--preset--spacing--50) !important;
		background-color: var(--wp--preset--color--white) !important;
	}

	.katfin-contacto__card {
		margin-block-start: 1.25rem;
		padding: 0 !important;
		border: 0;
		box-shadow: none;
	}

	.katfin-contacto__title {
		font-size: 1.875rem !important;
		line-height: 1.2;
	}

	.katfin-contacto__datos {
		padding: 1.25rem;
		border: 0;
		border-radius: 8px;
		background-color: var(--wp--preset--color--gold-subtle);
	}

	.katfin-contacto__fila {
		padding-block: 0.75rem;
	}

	.katfin-contacto__fila:first-child {
		padding-block-start: 0;
	}

	.katfin-contacto__fila:last-child {
		padding-block-end: 0;
	}

	.katfin-contacto .katfin-label {
		font-size: 0.75rem;
		font-weight: 700;
		letter-spacing: 0.06em;
	}

	.katfin-contacto__acciones {
		flex-direction: column;
		align-items: stretch;
	}

	.katfin-contacto__acciones > .wp-block-button,
	.katfin-contacto__acciones .wp-block-button__link {
		width: 100%;
	}

	.katfin-horarios-columnas__title {
		font-size: 1.25rem;
	}
}

/* ---- Página de servicio (diseño Stitch) ---- */

.katfin-servicio-hero,
.katfin-servicio-incluye,
.katfin-servicio-otros {
	border-block-end: 1px solid var(--wp--preset--color--gray);
}

.katfin-servicio-hero .wp-block-post-featured-image {
	margin: 0;
}

.katfin-servicio-hero__title,
.katfin-servicio-incluye h2,
.katfin-servicio-otros__title {
	margin-block: 0;
	line-height: 1.15;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

/* Filete dorado corto bajo los titulares. */
.katfin-servicio-hero__title::after,
.katfin-servicio-incluye h2::after {
	display: block;
	width: 4rem;
	height: 1px;
	margin-block-start: var(--wp--preset--spacing--30);
	background-color: var(--wp--preset--color--gold-light);
	content: "";
}

.katfin-servicio-hero__excerpt p {
	margin: 0;
}

.katfin-servicio-hero__acciones {
	margin-block-start: var(--wp--preset--spacing--50);
}

/* Banda "Incluye": se oculta si el servicio no tiene contenido. */
.katfin-servicio-incluye:not(:has(.wp-block-post-content > *)) {
	display: none;
}

.katfin-servicio-incluye h2 {
	margin-block-end: var(--wp--preset--spacing--50);
	font-size: var(--wp--preset--font-size--x-large);
}

/* "Otros servicios": cabecera con el botón a la derecha y mosaico debajo. */
.katfin-servicio-otros__inner {
	display: grid;
	grid-template-areas:
		"head todos"
		"grid grid";
	grid-template-columns: 1fr auto;
	align-items: end;
	gap: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40);
}

.katfin-servicio-otros__inner > * {
	margin: 0 !important;
}

.katfin-servicio-otros__head {
	grid-area: head;
}

.katfin-servicio-otros__head > p {
	margin-block: var(--wp--preset--spacing--20) 0;
}

.katfin-servicio-otros__todos {
	grid-area: todos;
}

.katfin-servicio-otros__grid {
	grid-area: grid;
}

.katfin-servicio-otros__title {
	font-size: var(--wp--preset--font-size--x-large);
}

@media (width > 781px) {

	.katfin-servicio-incluye .wp-block-list.is-style-check {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--60);
	}

	.katfin-servicio-incluye .wp-block-list.is-style-check > li + li {
		margin-block-start: 0;
	}
}

/* Servicio en móvil: título, extracto, foto, ficha y botones. */
@media (width <= 781px) {

	.katfin-servicio-hero__cols {
		flex-direction: column;
		align-items: stretch !important;
		gap: 1.5rem !important;
	}

	.katfin-servicio-hero__text {
		display: contents;
	}

	.katfin-servicio-hero__cols > *,
	.katfin-servicio-hero__text > * {
		width: 100%;
		margin: 0 !important;
	}

	.katfin-servicio-hero__title {
		order: 1;
		font-size: 2.25rem !important;
		line-height: 1.2;
	}

	.katfin-servicio-hero__title::after {
		display: none;
	}

	.katfin-servicio-hero__excerpt {
		order: 2;
	}

	.katfin-servicio-hero__media {
		order: 3;
	}

	.katfin-servicio-hero .katfin-service-meta {
		order: 4;
	}

	.katfin-servicio-hero__acciones {
		order: 5;
		flex-direction: column;
		align-items: stretch;
	}

	.katfin-servicio-hero__acciones > .wp-block-button,
	.katfin-servicio-hero__acciones .wp-block-button__link,
	.katfin-servicio-otros__todos > .wp-block-button,
	.katfin-servicio-otros__todos .wp-block-button__link {
		width: 100%;
	}

	.katfin-servicio-incluye h2,
	.katfin-servicio-otros__title {
		font-size: 1.875rem;
	}

	.katfin-servicio-otros__inner {
		grid-template-areas:
			"head"
			"grid"
			"todos";
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}
}
