/**
 * BusinessGO Blocks – tokens de diseño y estilos de bloque compartidos.
 *
 * Los tokens se declaran con :where() (especificidad 0) para que cada web los
 * sobrescriba desde su tema sin pelear con el orden de carga:
 *   :root { --bgo-primary: #005a64; --bgo-accent: #d68a1e; ... }
 */

/* =========================================================================
   Tokens
   ========================================================================= */
:where(:root) {
	--bgo-primary: #292b6c;   /* azul marino corporativo (logo #262967) */
	--bgo-accent: #e23c70;    /* rosa de los CTA (logo #c24971) */
	--bgo-dark: #042040;      /* textos y líneas */
	--bgo-light: #f0f1f8;     /* fondos claros, tinte del azul marino */
	--bgo-muted: #8989a2;     /* textos secundarios */
	--bgo-radius: 18px;
	--bgo-font-head: Montserrat, sans-serif;
	--bgo-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--bgo-ease: cubic-bezier(.2, .7, .2, 1);
}

/* =========================================================================
   Formato «Resaltado» (marcador bajo el texto)
   ========================================================================= */
mark.bgo-mark {
	background: linear-gradient(transparent 62%, color-mix(in srgb, var(--bgo-accent) 45%, transparent) 62%, color-mix(in srgb, var(--bgo-accent) 45%, transparent) 92%, transparent 92%);
	color: inherit;
	padding: 0 2px;
}

/* =========================================================================
   Párrafo · Antetítulo
   ========================================================================= */
.is-style-bgo-eyebrow,
.bgo-eyebrow {
	width: fit-content;
	padding-bottom: 14px;
	border-bottom: 1px solid color-mix(in srgb, currentColor 35%, transparent);
	font-family: var(--bgo-font-mono);
	font-size: 13px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: .1em;
	text-transform: uppercase;
}

/* =========================================================================
   Párrafo · Enlace con flecha
   ========================================================================= */
.is-style-bgo-arrow-link a,
.bgo-arrow-link a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--bgo-primary);
	text-decoration: none;
}

.is-style-bgo-arrow-link a::before,
.bgo-arrow-link a::before {
	content: "";
	flex: 0 0 auto;
	width: 21px;
	height: 15px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21 15' fill='none' stroke='%23000' stroke-width='1.5'%3E%3Cpath d='M1.5 0v9.5h17'/%3E%3Cpath d='M14 5l4.5 4.5L14 14'/%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21 15' fill='none' stroke='%23000' stroke-width='1.5'%3E%3Cpath d='M1.5 0v9.5h17'/%3E%3Cpath d='M14 5l4.5 4.5L14 14'/%3E%3C/svg%3E") no-repeat center / contain;
	transition: transform .2s ease;
}

.is-style-bgo-arrow-link a:hover::before,
.bgo-arrow-link a:hover::before {
	transform: translateX(3px);
}

/* =========================================================================
   Título · Contorno (números grandes, palabras destacadas)
   ========================================================================= */
.is-style-bgo-outline,
.bgo-outline {
	color: transparent !important;
	-webkit-text-stroke: 1.5px var(--bgo-outline-color, var(--bgo-primary));
	transition: color .35s ease;
}

.is-style-bgo-outline:hover,
.bgo-outline:hover {
	color: var(--bgo-outline-color, var(--bgo-primary)) !important;
}

/* =========================================================================
   Grupo · Trama técnica (cuadrícula sutil que se desvanece)
   ========================================================================= */
.is-style-bgo-grid-pattern,
.bgo-grid-pattern {
	position: relative;
	isolation: isolate;
	overflow: hidden;
}

.is-style-bgo-grid-pattern::before,
.bgo-grid-pattern::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-image:
		linear-gradient(color-mix(in srgb, currentColor 8%, transparent) 1px, transparent 1px),
		linear-gradient(90deg, color-mix(in srgb, currentColor 8%, transparent) 1px, transparent 1px);
	background-size: 48px 48px;
	-webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, .9), transparent 70%);
	mask-image: linear-gradient(90deg, rgba(0, 0, 0, .9), transparent 70%);
}

/* =========================================================================
   Listas
   ========================================================================= */
:is(ul, ol):is(.is-style-bgo-dash, .is-style-bgo-check, .is-style-bgo-tags, .is-style-bgo-chips, .is-style-bgo-split) {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}

:is(.is-style-bgo-dash, .is-style-bgo-check, .is-style-bgo-tags, .is-style-bgo-chips, .is-style-bgo-split) > li {
	margin: 0;
}

/* Guiones */
.is-style-bgo-dash > li {
	position: relative;
	padding: 13px 0 13px 34px;
	border-bottom: 1px solid color-mix(in srgb, var(--bgo-primary) 16%, transparent);
}

.is-style-bgo-dash > li:last-child {
	border-bottom: 0;
}

.is-style-bgo-dash > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: calc(13px + .75em);
	width: 18px;
	height: 1px;
	background: var(--bgo-primary);
}

/* Check */
.is-style-bgo-check > li {
	position: relative;
	padding-left: 30px;
	margin-bottom: 11px;
}

.is-style-bgo-check > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .15em;
	width: 18px;
	height: 18px;
	border-radius: 6px;
	background: color-mix(in srgb, var(--bgo-accent) 14%, transparent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' fill='none' stroke='%23d68a1e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 4.2l2.6 2.4L9 1.2'/%3E%3C/svg%3E") no-repeat center;
}

/* Etiquetas (borde) y píldoras (relleno) */
.is-style-bgo-tags,
.is-style-bgo-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.is-style-bgo-tags > li {
	padding: 9px 14px;
	border: 1px solid color-mix(in srgb, currentColor 35%, transparent);
	border-radius: 999px;
	font-size: 14px;
	line-height: 18px;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.is-style-bgo-tags > li:hover {
	background: var(--bgo-primary);
	border-color: var(--bgo-primary);
	color: #fff;
}

.is-style-bgo-chips > li {
	padding: 7px 12px;
	background: color-mix(in srgb, currentColor 8%, transparent);
	border-radius: 999px;
	font-size: 13px;
	line-height: 16px;
}

/* Etiqueta y valor: la etiqueta en negrita a la izquierda, el resto a la derecha */
.is-style-bgo-split {
	border-top: 1px solid color-mix(in srgb, currentColor 25%, transparent);
}

.is-style-bgo-split > li {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid color-mix(in srgb, currentColor 14%, transparent);
	text-align: right;
}

.is-style-bgo-split > li > strong:first-child {
	font-family: var(--bgo-font-head);
	font-weight: 700;
	text-align: left;
}



/* Carrusel BGO: imágenes ajustadas a sus tarjetas */

.wp-block-bgo-logo-marquee.has-cards
.bgo-marquee__track > figure {
    width: var(--bgo-mq-w, 210px) !important;
    height: var(--bgo-mq-h, 121px) !important;
    flex: 0 0 var(--bgo-mq-w, 210px);
    box-sizing: border-box;
    padding: 4px !important;
    margin-top: 0;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.wp-block-bgo-logo-marquee.has-cards
.bgo-marquee__track > figure > img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center;
}