/*
 * Conqr Conquer (widget). Port exacto de site.css: .screen, .conquer, .conquer video, .knock, .outline,
 * .kw, .entry, .head, .ph, .cls, .def y sus @media. El vídeo es una vista del motor 3D a pantalla
 * completa; la figura mide lo que pide el control (× hero), lo calcula conquer.js.
 */

.cq-conquer {
	height: 100vh;
	height: 100svh;
	position: relative;
	overflow: hidden;
	background: #000;
}

.cq-conquer__vid {
	position: absolute;
	inset: 0;
}

/* Negro con las letras en blanco: multiply deja ver el cromo solo dentro de las letras. */
.cq-knock {
	position: absolute;
	inset: 0;
	background: #000;
	mix-blend-mode: multiply;
	display: flex;
	align-items: center;
}
.cq-outline {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	pointer-events: none;
}
.cq-kw {
	white-space: nowrap;
	font-size: clamp(180px, 34vw, 560px);
	font-weight: 700;
	letter-spacing: -.075em;
	line-height: 1;
	text-transform: lowercase;
	transform-origin: 0 50%;
	will-change: transform;
}
.cq-knock .cq-kw {
	color: #fff;
}
.cq-outline .cq-kw {
	color: transparent;
	-webkit-text-stroke: 1px rgba(169, 188, 255, .35);
}

.cq-entry {
	position: absolute;
	left: 0;
	right: 0;
	bottom: calc(env(safe-area-inset-bottom, 0px) + 11vh);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 0 var(--cq-m);
	gap: 14px;
	pointer-events: none;
}
.cq-entry__head {
	display: flex;
	align-items: center;
	gap: 14px;
}
.cq-entry__head span {
	font-size: clamp(14px, 1.2vw, 18px);
	color: var(--cq-sky);
}
.cq-entry__head .cq-cls {
	font-style: italic;
	color: var(--cq-dim);
}
.cq-entry__head .cq-ph::after {
	content: "";
	display: inline-block;
	width: 28px;
	height: 1px;
	margin-left: 14px;
	vertical-align: middle;
	background: var(--cq-faint);
}
.cq-def {
	margin: 0;
	padding: 0;
	font-size: clamp(30px, 4.2vw, 72px);
	font-weight: 700;
	letter-spacing: -.045em;
	line-height: 1;
	text-transform: lowercase;
	color: inherit;
}
.cq-entry__head,
.cq-def {
	opacity: 0;
}

/* Reduce: sin timeline, todo visible. El original solo soltaba .entry .head>* y dejaba .head y .def en 0
   (no se leía la definición); aquí se muestran (decisión de Samuel, 2026-10-26). */
@media (prefers-reduced-motion: reduce) {
	.cq-entry__head,
	.cq-def,
	.cq-entry__head > * {
		opacity: 1 !important;
		filter: none !important;
		transform: none !important;
	}
}
