/* ═══════════════════════════════════════════════════════════════
 * MCCI · Block styles para bloques nativos (core/*).
 * Aplicados desde el inserter "Estilos" del bloque.
 * ═══════════════════════════════════════════════════════════════ */

/* Buttons ────────────────────────────────────────────────────── */
.is-style-mcci-primary .wp-block-button__link,
.wp-block-button.is-style-mcci-primary .wp-block-button__link {
	font-family: var(--f-mono);
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--c-dark);
	background: var(--c-bg-1);
	padding: 0.9rem 1.75rem;
	border: none;
	border-radius: 0;
	transition: all 0.4s var(--ease);
}
.is-style-mcci-primary .wp-block-button__link:hover,
.wp-block-button.is-style-mcci-primary .wp-block-button__link:hover {
	background: #fff;
	transform: translateY(-1px);
}

.is-style-mcci-ghost .wp-block-button__link,
.wp-block-button.is-style-mcci-ghost .wp-block-button__link {
	background: transparent;
	color: rgba(245,243,238,0.6);
	border: none;
	border-bottom: 1px solid rgba(245,243,238,0.2);
	padding: 0 0 3px 0;
	border-radius: 0;
	font-family: var(--f-mono);
	font-size: 0.68rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.is-style-mcci-ghost .wp-block-button__link:hover,
.wp-block-button.is-style-mcci-ghost .wp-block-button__link:hover {
	color: var(--c-inverse);
	border-color: rgba(245,243,238,0.5);
}

.is-style-mcci-link-arrow .wp-block-button__link,
.wp-block-button.is-style-mcci-link-arrow .wp-block-button__link {
	background: transparent;
	color: var(--c-accent);
	border: none;
	padding: 0;
	font-family: var(--f-mono);
	font-size: 0.6rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
/* La flecha legacy ::after se sustituye por el <span class="arrow"> inyectado por
 * render_block (ver inc/blocks.php). El estilo del .arrow está abajo y aplica a
 * todos los botones que usen el atributo mcciIcon o el estilo link-arrow. */
.wp-block-button__link .arrow,
.wp-block-button__link .mcci-button-icon {
	display: inline-flex;
	align-items: center;
	margin-left: 0.5em;
	transition: transform 0.3s ease;
	line-height: 0;
}
.wp-block-button__link .arrow svg,
.wp-block-button__link .mcci-button-icon svg {
	width: 1em;
	height: 1em;
	display: block;
}
.wp-block-button__link:hover .arrow,
.wp-block-button__link:hover .mcci-button-icon {
	transform: translateX(4px);
}

/* Group / Section ────────────────────────────────────────────── */
.is-style-mcci-section {
	background: var(--c-bg-1);
	color: var(--c-text);
	padding-top: clamp(5rem, 10vw, 9rem);
	padding-bottom: clamp(5rem, 10vw, 9rem);
}
.is-style-mcci-section-dark {
	background: var(--c-dark);
	color: var(--c-inverse);
	padding-top: clamp(5rem, 10vw, 9rem);
	padding-bottom: clamp(5rem, 10vw, 9rem);
}
.is-style-mcci-section-dark h1,
.is-style-mcci-section-dark h2,
.is-style-mcci-section-dark h3,
.is-style-mcci-section-dark h4 { color: var(--c-inverse); }
.is-style-mcci-section-dark p { color: rgba(245,243,238,0.65); }

.is-style-mcci-section-cream {
	background: var(--c-bg-2);
	color: var(--c-text);
	padding-top: clamp(5rem, 10vw, 9rem);
	padding-bottom: clamp(5rem, 10vw, 9rem);
}

.is-style-mcci-container-narrow {
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
}
.is-style-mcci-container-wide {
	max-width: var(--max-w);
	margin-left: auto;
	margin-right: auto;
	padding-left: clamp(1.5rem, 4vw, 3rem);
	padding-right: clamp(1.5rem, 4vw, 3rem);
}

/* Columns ────────────────────────────────────────────────────── */
.is-style-mcci-editorial {
	max-width: var(--max-w);
	margin: 0 auto;
	padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 4vw, 3rem);
	gap: clamp(3rem, 6vw, 6rem);
	align-items: center;
}
.is-style-mcci-editorial > .wp-block-column { flex-basis: auto !important; }

/* Image / Cover reveal ───────────────────────────────────────── */
.is-style-mcci-image-reveal {
	overflow: hidden;
	position: relative;
}
.is-style-mcci-image-reveal::before {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--c-bg-1);
	z-index: 2;
	transform: scaleY(1);
	transform-origin: top;
	transition: transform 1.2s var(--ease-out);
}
.is-style-mcci-image-reveal.vis::before {
	transform: scaleY(0);
	transform-origin: bottom;
}
.is-style-mcci-image-reveal img {
	transform: scale(1.18);
	transition: transform 1.8s var(--ease-out);
}
.is-style-mcci-image-reveal.vis img {
	transform: scale(1);
}