/* Extremadura.video — catálogo, portada y relacionados.
   Fondo oscuro a propósito: en un banco de imágenes lo que tiene que brillar
   es el material, no la interfaz. */

.evc {
	--evc-verde: #74a84a;
	--evc-verde-claro: #8dc45f;
	--evc-fondo: #0d0e10;
	--evc-carta: #17191c;
	--evc-borde: #2a2d32;
	--evc-texto: #f2f3f4;
	--evc-suave: #9aa0a6;
	--evc-radio: 2px;

	width: 100vw;
	max-width: 100vw;
	min-width: 100vw;
	flex-shrink: 0;
	margin-left: calc(50% - 50vw);
	background: var(--evc-fondo);
	color: var(--evc-texto);
	padding: 0 clamp(16px, 4vw, 56px) clamp(40px, 6vw, 80px);
	box-sizing: border-box;
	font-family: Karla, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	overflow-x: clip;
}

.evc *,
.evc *::before,
.evc *::after {
	box-sizing: border-box;
}

.evc a {
	color: inherit;
	text-decoration: none;
}

/* ---------- Barra de búsqueda y formato ---------- */

.evc-barra {
	position: sticky;
	/* Justo debajo de la cabecera fija, si no se esconde detrás. */
	top: 68px;
	z-index: 20;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	padding: 16px 0 14px;
	margin-bottom: 4px;
	background: linear-gradient(var(--evc-fondo) 82%, transparent);
}

.evc-buscador {
	position: relative;
	flex: 1 1 260px;
	display: flex;
	align-items: center;
}

.evc-buscador svg {
	position: absolute;
	left: 14px;
	width: 18px;
	height: 18px;
	fill: none;
	stroke: var(--evc-suave);
	stroke-width: 2;
	stroke-linecap: round;
	pointer-events: none;
}

.evc-buscador input {
	width: 100%;
	padding: 12px 42px;
	border: 1px solid var(--evc-borde);
	border-radius: 999px;
	background: var(--evc-carta);
	color: var(--evc-texto);
	font: inherit;
	font-size: 15px;
	-webkit-appearance: none;
	appearance: none;
}

.evc-buscador input::placeholder { color: #6d7278; }

.evc-buscador input:focus {
	outline: 2px solid var(--evc-verde);
	outline-offset: -1px;
	border-color: var(--evc-verde);
}

.evc-limpiar {
	position: absolute;
	right: 8px;
	width: 28px;
	height: 28px;
	border: 0;
	border-radius: 50%;
	background: #2a2d32;
	color: var(--evc-texto);
	font-size: 17px;
	line-height: 1;
	cursor: pointer;
}

.evc-formato {
	display: flex;
	gap: 6px;
	padding: 3px;
	border: 1px solid var(--evc-borde);
	border-radius: 999px;
}

/* ---------- Botones de filtro ---------- */

.evc-chip {
	padding: 8px 16px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--evc-suave);
	font: inherit;
	font-size: 14px;
	line-height: 1.2;
	cursor: pointer;
	white-space: nowrap;
	transition: color .15s, background-color .15s;
}

.evc-chip:hover { color: var(--evc-texto); }

.evc-chip.is-on {
	background: var(--evc-verde);
	color: #fff;
}

.evc-select select {
	padding: 11px 34px 11px 16px;
	border: 1px solid var(--evc-borde);
	border-radius: 999px;
	background: var(--evc-carta) url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa0a6' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 15px;
	color: var(--evc-suave);
	font: inherit;
	font-size: 14px;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	max-width: 15rem;
}

.evc-select select:hover { color: var(--evc-texto); }
.evc-select select option,
.evc-select select optgroup { color: #111; }

.evc-cuenta {
	margin-left: auto;
	color: var(--evc-suave);
	font-size: 13px;
	letter-spacing: .04em;
	white-space: nowrap;
}

.evc-vacio {
	margin: 40px auto;
	max-width: 46ch;
	text-align: center;
	color: var(--evc-suave);
	line-height: 1.6;
}

.evc-vacio a { color: var(--evc-verde-claro); text-decoration: underline; }

/* ---------- Mosaico ---------- */

.evc-mosaico {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 16px;
}

.evc-pieza {
	position: relative;
	background: var(--evc-carta);
	border-radius: var(--evc-radio);
	overflow: hidden;
}

.evc-pieza::after {
	content: "";
	position: absolute;
	inset: 0;
	border: 1px solid transparent;
	pointer-events: none;
	transition: border-color .2s;
}

.evc-pieza:hover::after,
.evc-pieza:focus-within::after { border-color: rgba(141, 196, 95, .55); }

.evc-pieza[hidden] { display: none; }

.evc-enlace {
	position: relative;   /* la capa de información se ancla a la imagen, no a la tarjeta */
	display: block;
}

.evc-medio {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #0a0b0c;
}

.evc-poster,
.evc-preview {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .5s ease, opacity .3s ease;
}

.evc-preview { opacity: 0; }

.evc-pieza:hover .evc-preview,
.evc-pieza:focus-within .evc-preview { opacity: 1; }

.evc-pieza:hover .evc-poster,
.evc-pieza:focus-within .evc-poster { transform: scale(1.06); }

.evc-pieza:not(:has(.evc-preview)):hover .evc-poster { transform: scale(1.08); }

.evc-sello {
	position: absolute;
	top: 10px;
	left: 10px;
	padding: 3px 8px;
	background: rgba(0, 0, 0, .62);
	backdrop-filter: blur(2px);
	color: #fff;
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.evc-play {
	position: absolute;
	right: 10px;
	top: 10px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: rgba(0, 0, 0, .62);
	transition: background-color .2s;
}

.evc-play::after {
	content: "";
	position: absolute;
	left: 10px;
	top: 8px;
	border-style: solid;
	border-width: 5px 0 5px 8px;
	border-color: transparent transparent transparent #fff;
}

.evc-pieza:hover .evc-play { background: var(--evc-verde); }

.evc-capa {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 34px 14px 12px;
	background: linear-gradient(transparent, rgba(0, 0, 0, .88));
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .2s ease, transform .2s ease;
	pointer-events: none;
}

.evc-pieza:hover .evc-capa,
.evc-pieza:focus-within .evc-capa {
	opacity: 1;
	transform: none;
}

.evc-titulo {
	font-size: 14px;
	line-height: 1.35;
	color: #fff;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.evc-meta {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	margin-top: 3px;
}

.evc-lugar {
	font-size: 12px;
	color: #c9ced3;
	letter-spacing: .04em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.evc-precio {
	font-size: 12px;
	color: #fff;
	letter-spacing: .06em;
	white-space: nowrap;
}

/* El precio de la tarjeta es el de la licencia estándar: es un punto de
   partida, no un precio cerrado. */
.evc-precio-desde {
	color: #9aa0a6;
	font-size: 10.5px;
	letter-spacing: .14em;
	text-transform: uppercase;
}

/* ---------- Tiras horizontales (portada y relacionados) ---------- */

.evc-tira { padding: clamp(28px, 4vw, 48px) 0 0; }

.evc-tira header {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 14px;
}

.evc-tira h2 {
	margin: 0;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
	font-size: clamp(20px, 2.2vw, 28px);
	color: var(--evc-texto);
	letter-spacing: .01em;
}

.evc-tira header a {
	color: var(--evc-verde-claro);
	font-size: 13px;
	letter-spacing: .1em;
	text-transform: uppercase;
	white-space: nowrap;
}

.evc-carril {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(280px, 32%);
	gap: 14px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding-bottom: 10px;
	scrollbar-width: thin;
	scrollbar-color: #3a3e44 transparent;
}

.evc-carril .evc-pieza { scroll-snap-align: start; }

.evc-carril::-webkit-scrollbar { height: 6px; }
.evc-carril::-webkit-scrollbar-thumb { background: #3a3e44; }

/* ---------- Portada ---------- */

.evc-portada { padding-top: 0; }

.evc-hero {
	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	min-height: min(78vh, 720px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(60px, 9vw, 120px) clamp(16px, 4vw, 56px) clamp(70px, 8vw, 100px);
	overflow: hidden;
	isolation: isolate;
}

.evc-hero-foto,
.evc-hero-video,
.evc-hero-tubo,
.evc-hero-media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: -2;
	object-fit: cover;
	border: 0;
}

.evc-hero-video,
.evc-hero-tubo { pointer-events: none; }

.evc-hero-tubo iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100vw;
	height: 56.25vw;
	min-height: 100%;
	min-width: 177.78vh;
	transform: translate(-50%, -50%);
	border: 0;
	pointer-events: none;
	opacity: 0;
	transition: opacity 1s ease;
}

.evc-hero-tubo.esta-lista iframe { opacity: 1; }

.evc-hero-video iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100vw;
	height: 56.25vw;
	min-height: 100%;
	min-width: 177.78vh;
	transform: translate(-50%, -50%);
	border: 0;
	pointer-events: none;
}

.evc-hero-velo {
	position: absolute;
	inset: 0;
	z-index: -1;
	/* Bastante oscuro a propósito: el fondo viene de la previsualización marcada
	   al agua y así la marca queda como una textura, no como un cartel. */
	/* Oscurece donde va el texto y deja respirar la imagen a la derecha. La
	   legibilidad la termina de asegurar la sombra del propio texto. */
	background:
		linear-gradient(95deg, rgba(6, 7, 8, .88) 0%, rgba(6, 7, 8, .58) 36%, rgba(6, 7, 8, .12) 70%, rgba(6, 7, 8, .3) 100%),
		linear-gradient(rgba(6, 7, 8, .42), rgba(6, 7, 8, .04) 45%, rgba(6, 7, 8, .72));
}

.evc-hero-foto,
.evc-hero-video,
.evc-hero-media { filter: saturate(1.06) contrast(1.03); }

.evc-hero-media {
	z-index: -2;
	opacity: 0;
	transition: opacity .9s ease;
}

.evc-hero-media.esta-lista { opacity: 1; }

.evc-hero-texto h1,
.evc-hero-kicker,
.evc-hero-sub,
.evc-hero-atajos a,
.evc-hero-cifra {
	text-shadow: 0 2px 22px rgba(0, 0, 0, .75), 0 1px 3px rgba(0, 0, 0, .5);
}

.evc-hero-kicker {
	margin: 0 0 12px;
	color: #8dc45f;
	font-size: 13px;
	letter-spacing: .22em;
	text-transform: uppercase;
}

.evc-hero-texto { max-width: 40rem; }

.evc-hero h1 {
	margin: 0 0 18px;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
	font-size: clamp(32px, 5.2vw, 62px);
	line-height: 1.06;
	color: #fff;
	text-wrap: balance;
}

.evc-hero-sub {
	margin: 0 0 26px;
	max-width: 34rem;
	font-size: clamp(15px, 1.4vw, 18px);
	line-height: 1.6;
	color: #d7dade;
}

.evc-hero-busca {
	display: flex;
	gap: 8px;
	max-width: 32rem;
}

.evc-hero-busca input {
	flex: 1;
	padding: 15px 18px;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: var(--evc-radio);
	background: rgba(10, 11, 12, .62);
	color: #fff;
	font: inherit;
	font-size: 16px;
	-webkit-appearance: none;
	appearance: none;
}

.evc-hero-busca input::placeholder { color: #a6abb1; }

.evc-hero-busca input:focus {
	outline: 2px solid var(--evc-verde);
	outline-offset: -1px;
}

.evc-hero-busca button {
	padding: 15px 26px;
	border: 0;
	border-radius: var(--evc-radio);
	background: var(--evc-verde);
	color: #fff;
	font: inherit;
	font-size: 14px;
	letter-spacing: .14em;
	text-transform: uppercase;
	cursor: pointer;
}

.evc-hero-busca button:hover { background: var(--evc-verde-claro); }

.evc-hero-atajos {
	display: flex;
	flex-wrap: wrap;
	gap: 22px;
	margin: 22px 0 0;
}

.evc-hero-atajos a {
	color: #e6e8ea;
	font-size: 13px;
	letter-spacing: .12em;
	text-transform: uppercase;
	border-bottom: 1px solid rgba(255, 255, 255, .3);
	padding-bottom: 3px;
}

.evc-hero-atajos a:hover {
	color: #fff;
	border-color: var(--evc-verde);
}

.evc-hero-cifra {
	position: absolute;
	left: clamp(16px, 4vw, 56px);
	bottom: clamp(20px, 3vw, 34px);
	color: #9aa0a6;
	font-size: 12px;
	letter-spacing: .1em;
	text-transform: uppercase;
}

/* ---------- Bloque de confianza ---------- */

.evc-confianza {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: clamp(20px, 3vw, 40px);
	margin-top: clamp(44px, 6vw, 72px);
	padding-top: clamp(32px, 4vw, 48px);
	border-top: 1px solid var(--evc-borde);
}

.evc-confianza h3 {
	margin: 0 0 8px;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 400;
	font-size: 16px;
	color: #fff;
}

.evc-confianza p {
	margin: 0;
	color: var(--evc-suave);
	font-size: 14px;
	line-height: 1.65;
}

.evc-confianza a { color: var(--evc-verde-claro); text-decoration: underline; }

/* ---------- Relacionados ---------- */

.evc-relacionados { margin-top: clamp(36px, 5vw, 60px); padding-bottom: clamp(32px, 4vw, 56px); }

/* ---------- Pantallas pequeñas ---------- */

@media (max-width: 900px) {
	.evc-mosaico { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
	.evc-carril { grid-auto-columns: minmax(230px, 76%); }
	.evc-hero-video,
	.evc-hero-tubo,
	.evc-hero-media { display: none; }
}

@media (max-width: 600px) {
	.evc-mosaico { grid-template-columns: 1fr 1fr; gap: 12px; }

	/* En el móvil la tarjeta es solo la imagen.
	 *
	 * Aquí no hay hover, así que el rótulo se quedaba fijo tapando la foto, y
	 * para que estorbase poco había que encogerlo hasta dejarlo ilegible. Pero
	 * el arreglo no era bajarlo: es que no hace falta. Las 33 fotos valen 59 € y
	 * los 47 vídeos 129 €, o sea que el precio no dice nada que la etiqueta de
	 * la esquina no diga ya, y el título tampoco decide una compra —quien busca
	 * Trujillo ya ha filtrado por Trujillo—. En una tienda de imágenes se elige
	 * mirando, no leyendo.
	 *
	 * El texto alternativo sigue en el HTML: esto no le quita nada a Google ni a
	 * un lector de pantalla.
	 *
	 * Cuando existan precios Premium habrá que devolver el precio: entonces
	 * dejará de ser adivinable y volverá a ser un dato que decide. */
	.evc-capa { display: none; }

	/* El desplegable de provincia cortaba el texto («Toda Extremadur»). */
	.evc-select { flex: 1 1 100%; }
	.evc-select select { width: 100%; max-width: none; }
	.evc-cuenta { margin-left: 0; }

	.evc-barra { position: static; }
	.evc-hero { min-height: 62vh; }
}

@media (prefers-reduced-motion: reduce) {
	.evc-hero-video,
	.evc-hero-tubo,
	.evc-hero-media { display: none; }
	.evc-poster,
	.evc-preview,
	.evc-capa { transition: none; }
	.evc-pieza:hover .evc-poster { transform: none; }
}

/* La cabecera de la página se alinea con el mosaico en vez de quedarse en una
   columna estrecha centrada, que parte la página en dos. */
body.evc-oscuro .site-content > .ast-container {
	max-width: none;
	padding: 0 clamp(16px, 4vw, 56px);
}

body.evc-oscuro .entry-content > p,
body.evc-oscuro .entry-header {
	max-width: 68ch;
}

body.evc-oscuro .entry-title {
	font-weight: 300;
	letter-spacing: .01em;
}

/* ---------- Página oscura completa (catálogo y portada) ----------
   El tema pinta el contenido sobre una tarjeta blanca. En una página cuyo
   protagonista es el material, esa franja clara encima del mosaico distrae. */

body.evc-oscuro {
	background-color: #0d0e10;
	color: #c9ced3;
}

/* El tema pinta este fondo desde una regla en línea, que gana por orden de
   aparición; aquí sí hace falta forzar. */
body.evc-oscuro .site-content,
body.evc-oscuro .site-content .ast-container,
body.evc-oscuro .ast-article-single,
body.evc-oscuro .ast-separate-container .ast-article-single,
body.evc-oscuro .ast-separate-container .ast-article-single:not(.ast-related-post),
body.evc-oscuro .entry-content,
body.evc-oscuro #primary,
body.evc-oscuro #content {
	background-color: transparent !important;
	box-shadow: none !important;
}

body.evc-oscuro .ast-separate-container .ast-article-single {
	padding-left: 0;
	padding-right: 0;
}

body.evc-oscuro .entry-title,
body.evc-oscuro .entry-content h1,
body.evc-oscuro .entry-content h2,
body.evc-oscuro .entry-content h3,
body.evc-oscuro .ast-archive-title {
	color: #ffffff !important;
}

body.evc-oscuro .entry-content > p {
	color: #b6bcc2 !important;
}

body.evc-oscuro .entry-content > p a {
	color: #8dc45f;
}

body.evc-oscuro .entry-content > p strong {
	color: #e8eaec;
}

body.evc-oscuro .ast-single-post .entry-header,
body.evc-oscuro .entry-meta,
body.evc-oscuro .post-navigation {
	color: #9aa0a6;
}


/* ---------- La portada no lleva el título del tema ---------- */

body.evc-es-portada .entry-header,
body.evc-es-portada .ast-single-post-order,
body.evc-es-portada .entry-title {
	display: none !important;
}

body.evc-es-portada .site-content > .ast-container,
body.evc-es-portada .ast-separate-container .ast-article-single {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.evc-es-portada .evc-portada { padding-left: 0; padding-right: 0; }

body.evc-es-portada .evc-tira,
body.evc-es-portada .evc-confianza {
	padding-left: clamp(16px, 4vw, 56px);
	padding-right: clamp(16px, 4vw, 56px);
}

body.evc-es-portada .evc-confianza {
	margin-left: clamp(16px, 4vw, 56px);
	margin-right: clamp(16px, 4vw, 56px);
	padding-left: 0;
	padding-right: 0;
}


/* El tema deja un hueco encima del artículo que en la portada se ve como una
   franja negra entre la cabecera y el héroe. */
body.evc-es-portada .content-area { margin-top: 0 !important; }

body.evc-es-portada .site-main > article,
body.evc-es-portada article.ast-article-single,
body.evc-es-portada .ast-separate-container .site-main > article {
	padding: 0 !important;
	margin: 0 !important;
}

/* =========================================================================
   Cabecera propia
   ========================================================================= */

/* La del tema estorba: sobra un menú blanco encima de un catálogo oscuro. */
body.evc-con-cabecera #masthead,
body.evc-con-cabecera .site-header {
	display: none !important;
}

.evc-cabecera {
	--evc-verde: #74a84a;
	--evc-verde-claro: #8dc45f;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 990;
	font-family: Karla, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	background: rgba(10, 11, 12, .94);
	backdrop-filter: saturate(140%) blur(10px);
	border-bottom: 1px solid rgba(255, 255, 255, .08);
	transition: background-color .3s ease, border-color .3s ease, padding .3s ease;
}

.admin-bar .evc-cabecera { top: 32px; }

@media (max-width: 782px) {
	.admin-bar .evc-cabecera { top: 46px; }
}

/* Sobre el héroe de la portada la barra desaparece hasta que se baja. */
.evc-cabecera.es-suelta {
	background: transparent;
	backdrop-filter: none;
	border-bottom-color: transparent;
}

.evc-cabecera.es-suelta::before {
	content: "";
	position: absolute;
	inset: 0 0 -40px 0;
	background: linear-gradient(rgba(0, 0, 0, .55), transparent);
	pointer-events: none;
	z-index: -1;
}

.evc-cab-caja {
	display: flex;
	align-items: center;
	gap: clamp(16px, 3vw, 40px);
	max-width: 1800px;
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 56px);
	height: 68px;
}

.evc-cabecera.es-suelta .evc-cab-caja { height: 88px; }

.evc-marca {
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
	font-size: clamp(17px, 1.5vw, 21px);
	letter-spacing: -.01em;
	color: #fff;
	text-decoration: none;
	white-space: nowrap;
}

.evc-marca span { color: var(--evc-verde-claro); }

.evc-marca:hover { color: #fff; }

.evc-nav {
	display: flex;
	gap: clamp(14px, 2vw, 30px);
	margin-left: auto;
}

.evc-nav a {
	position: relative;
	color: #d8dbde;
	text-decoration: none;
	font-size: 13px;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: 6px 0;
	white-space: nowrap;
}

.evc-nav a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 100%;
	bottom: 0;
	height: 1px;
	background: var(--evc-verde-claro);
	transition: right .25s ease;
}

.evc-nav a:hover { color: #fff; }
.evc-nav a:hover::after { right: 0; }

.evc-acciones {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-left: clamp(8px, 2vw, 22px);
}

.evc-icono {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 0;
	background: transparent;
	color: #d8dbde;
	cursor: pointer;
	border-radius: 50%;
	transition: background-color .2s, color .2s;
}

.evc-icono:hover { background: rgba(255, 255, 255, .1); color: #fff; }

.evc-icono svg {
	width: 19px;
	height: 19px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.evc-bolita {
	position: absolute;
	top: 4px;
	right: 3px;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	border-radius: 9px;
	background: var(--evc-verde);
	color: #fff;
	font-size: 11px;
	line-height: 17px;
	text-align: center;
	display: none;
}

.evc-bolita.se-ve { display: block; }

.evc-abre-menu { display: none; flex-direction: column; gap: 5px; }

.evc-abre-menu span {
	display: block;
	width: 20px;
	height: 1.5px;
	background: currentColor;
	transition: transform .25s ease, opacity .2s ease;
}

.evc-abre-menu[aria-expanded="true"] span:first-child { transform: translateY(3.2px) rotate(45deg); }
.evc-abre-menu[aria-expanded="true"] span:last-child { transform: translateY(-3.2px) rotate(-45deg); }

/* Buscador desplegable */

.evc-cab-busca {
	display: flex;
	gap: 8px;
	max-width: 1800px;
	margin: 0 auto;
	padding: 0 clamp(16px, 4vw, 56px) 18px;
}

.evc-cab-busca[hidden] { display: none; }

.evc-cab-busca input {
	flex: 1;
	padding: 13px 16px;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 2px;
	background: rgba(10, 11, 12, .7);
	color: #fff;
	font: inherit;
	font-size: 16px;
	-webkit-appearance: none;
	appearance: none;
}

.evc-cab-busca input::placeholder { color: #9aa0a6; }
.evc-cab-busca input:focus { outline: 2px solid var(--evc-verde); outline-offset: -1px; }

.evc-cab-busca button {
	padding: 13px 24px;
	border: 0;
	border-radius: 2px;
	background: var(--evc-verde);
	color: #fff;
	font: inherit;
	font-size: 13px;
	letter-spacing: .14em;
	text-transform: uppercase;
	cursor: pointer;
}

.evc-cab-busca button:hover { background: var(--evc-verde-claro); }

/* Panel de móvil */

.evc-panel {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 8px clamp(16px, 4vw, 56px) 26px;
	background: rgba(10, 11, 12, .98);
}

.evc-panel[hidden] { display: none; }

.evc-panel a {
	padding: 14px 0;
	border-bottom: 1px solid rgba(255, 255, 255, .08);
	color: #e6e8ea;
	text-decoration: none;
	font-size: 17px;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
}

.evc-panel a:last-child { border-bottom: 0; }

/* Hueco para la barra fija */

body.evc-con-cabecera { padding-top: 68px; }
body.evc-con-cabecera.evc-cabecera-encima { padding-top: 0; }

@media (max-width: 860px) {
	.evc-nav { display: none; }
	.evc-abre-menu { display: inline-flex; }
	.evc-acciones { margin-left: auto; }
	.evc-cab-caja,
	.evc-cabecera.es-suelta .evc-cab-caja { height: 60px; }
	body.evc-con-cabecera { padding-top: 60px; }
	body.evc-con-cabecera.evc-cabecera-encima { padding-top: 0; }
}


/* La barra de filtros vive debajo de la cabecera fija; con la barra de
   administración de WordPress hay que bajarla otro poco. */
.admin-bar .evc-barra { top: 100px; }

html { scroll-padding-top: 84px; }

@media (max-width: 860px) {
	.evc-barra { top: 60px; }
	.admin-bar .evc-barra { top: 106px; }
}


/* =========================================================================
   Pórtico del catálogo: la misma banda de vídeo que la portada, más baja,
   con el título abajo. Entrar en una pared negra desanimaba.
   ========================================================================= */

.evc-portico {
	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	min-height: min(46vh, 430px);
	display: flex;
	align-items: flex-end;
	padding: clamp(70px, 12vw, 150px) clamp(16px, 4vw, 56px) clamp(26px, 3.5vw, 44px);
	overflow: hidden;
	isolation: isolate;
	margin-bottom: 4px;
}

/* El velo solo tiene que hacer legible el texto, que va abajo a la izquierda.
   Antes oscurecía la foto entera y las imágenes a contraluz se perdían: se
   deja limpio el tercio superior y se concentra el oscurecido en la base. */
.evc-portico .evc-hero-velo {
	background:
		linear-gradient(to bottom, rgba(6, 7, 8, .2) 0%, rgba(6, 7, 8, .02) 26%, rgba(6, 7, 8, .26) 58%, rgba(6, 7, 8, .62) 78%, rgba(6, 7, 8, .92) 100%),
		linear-gradient(95deg, rgba(6, 7, 8, .5) 0%, rgba(6, 7, 8, .12) 42%, rgba(6, 7, 8, 0) 100%);
}

/* En la banda baja hay menos alto, así que la rampa de abajo entra antes. */
.evc-portico.es-bajo .evc-hero-velo {
	background:
		linear-gradient(to bottom, rgba(6, 7, 8, .16) 0%, rgba(6, 7, 8, .02) 22%, rgba(6, 7, 8, .32) 52%, rgba(6, 7, 8, .64) 76%, rgba(6, 7, 8, .92) 100%),
		linear-gradient(95deg, rgba(6, 7, 8, .5) 0%, rgba(6, 7, 8, .1) 44%, rgba(6, 7, 8, 0) 100%);
}

/* Estas fotos son 4:3 en una banda muy apaisada: encuadrar por el centro se
   come el cielo. Se sube el punto de interés. */
.evc-portico .evc-hero-foto { object-position: 50% 42%; }

.evc-portico-texto { max-width: 46rem; }

.evc-portico h1 {
	margin: 0 0 10px;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
	font-size: clamp(27px, 3.6vw, 46px);
	line-height: 1.08;
	color: #fff;
	text-wrap: balance;
	text-shadow: 0 2px 22px rgba(0, 0, 0, .75);
}

.evc-portico p {
	margin: 0;
	max-width: 40rem;
	color: #d7dade;
	font-size: clamp(14px, 1.2vw, 16px);
	line-height: 1.6;
	text-shadow: 0 2px 18px rgba(0, 0, 0, .7);
}

/* En las páginas del catálogo el título lo pone el pórtico, no el tema.
   En las fichas y en las páginas de texto sí hace falta, así que se marcan
   con «evc-con-titulo» y se quedan fuera de esta regla. */
body.evc-oscuro:not(.evc-con-titulo) .entry-header,
body.evc-oscuro:not(.evc-con-titulo) .entry-title {
	display: none !important;
}

body.evc-oscuro .site-main > article,
body.evc-oscuro article.ast-article-single {
	padding-top: 0 !important;
}

body.evc-oscuro .content-area { margin-top: 0 !important; }

/* ---------- Logotipo en la cabecera ---------- */

.evc-marca.tiene-logo { display: flex; align-items: center; }

.evc-marca.tiene-logo img {
	display: block;
	width: auto;
	height: 26px;
	transition: height .3s ease;
}

.evc-cabecera.es-suelta .evc-marca.tiene-logo img { height: 34px; }

@media (max-width: 860px) {
	.evc-marca.tiene-logo img,
	.evc-cabecera.es-suelta .evc-marca.tiene-logo img { height: 24px; }
	.evc-barra { gap: 8px; }
	.evc-buscador { flex: 1 1 100%; }
	.evc-cuenta { margin-left: 0; }
	.evc-select select { max-width: 10rem; font-size: 13px; }
}


/* Sin hueco entre la cabecera y el pórtico: el vídeo empieza donde acaba la barra. */
body.evc-oscuro .site-content,
body.evc-oscuro .site-main,
body.evc-oscuro .entry-content { padding-top: 0 !important; margin-top: 0 !important; }

body.evc-oscuro .evc-portico { margin-top: 0; }

/* Astra mete un acolchado grande encima del artículo; con pórtico sobra. */
body.evc-oscuro .ast-article-single,
body.evc-oscuro .ast-separate-container .ast-article-single,
body.evc-oscuro .site-content > .ast-container { padding-top: 0 !important; }

/* =========================================================================
   Páginas de texto con pórtico: tarifas, contacto, legales
   ========================================================================= */

.evc-solo-portico {
	padding: 0;
	margin-bottom: clamp(28px, 4vw, 48px);
}

.evc-portico.es-bajo {
	min-height: min(34vh, 320px);
	padding-top: clamp(60px, 9vw, 110px);
}

/* El contenido de estas páginas lo escribe WordPress, así que hay que vestirlo
   para que no cante contra el fondo oscuro. */

body.evc-oscuro .entry-content {
	color: #b6bcc2;
	font-size: 16px;
	line-height: 1.7;
}

body.evc-oscuro .entry-content > *:not(.evc):not(.evc-solo-portico):not(.evc-ancho) {
	max-width: 68rem;
	margin-left: auto;
	margin-right: auto;
}

body.evc-oscuro .entry-content h2 {
	margin: 2.4em 0 .7em;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
	font-size: clamp(22px, 2.4vw, 30px);
	color: #fff !important;
}

body.evc-oscuro .entry-content h3 {
	margin: 1.8em 0 .5em;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 400;
	font-size: 18px;
	color: #fff !important;
}

body.evc-oscuro .entry-content a { color: #8dc45f; }
body.evc-oscuro .entry-content strong { color: #e8eaec; }

body.evc-oscuro .entry-content ul,
body.evc-oscuro .entry-content ol { padding-left: 1.2em; }

body.evc-oscuro .entry-content li { margin-bottom: .45em; }

body.evc-oscuro .entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.4em 0 2em;
	font-size: 15px;
}

body.evc-oscuro .entry-content th,
body.evc-oscuro .entry-content td {
	padding: 13px 16px;
	border: 1px solid #2a2d32;
	text-align: left;
	vertical-align: top;
}

body.evc-oscuro .entry-content thead th {
	background: #17191c;
	color: #fff;
	font-weight: 400;
	font-size: 12px;
	letter-spacing: .12em;
	text-transform: uppercase;
}

body.evc-oscuro .entry-content tbody tr:nth-child(even) { background: rgba(255, 255, 255, .022); }

/* Tarjetas de precio y bloques de aviso */

.evc-precios {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 16px;
	margin: 1.6em 0 2.4em;
}

.evc-precio-carta {
	padding: 26px 24px 28px;
	border: 1px solid #2a2d32;
	background: #17191c;
}

.evc-precio-carta h3 {
	margin: 0 0 6px !important;
	font-size: 17px !important;
}

.evc-precio-carta .evc-cifra {
	display: block;
	margin: 10px 0 14px;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
	font-size: 38px;
	line-height: 1;
	color: #fff;
}

.evc-precio-carta .evc-cifra small {
	display: block;
	margin-top: 6px;
	font-size: 12px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #9aa0a6;
}

.evc-precio-carta p { margin: 0 0 14px; font-size: 14px; color: #9aa0a6; }

.evc-boton {
	display: inline-block;
	padding: 12px 24px;
	background: #74a84a;
	color: #fff !important;
	font-size: 13px;
	letter-spacing: .14em;
	text-transform: uppercase;
	text-decoration: none !important;
}

.evc-boton:hover { background: #8dc45f; }

.evc-boton.es-hueco {
	background: transparent;
	border: 1px solid #3a3e44;
	color: #d8dbde !important;
}

.evc-boton.es-hueco:hover { border-color: #74a84a; color: #fff !important; }

.evc-aviso {
	margin: 2em 0;
	padding: 20px 22px;
	border-left: 2px solid #74a84a;
	background: rgba(116, 168, 74, .07);
	font-size: 15px;
}

.evc-aviso p:last-child { margin-bottom: 0; }

/* Formulario de contacto */

body.evc-oscuro .wpforms-container { max-width: 40rem; margin: 0 auto; }

body.evc-oscuro .wpforms-field-label,
body.evc-oscuro .wpforms-container label { color: #d8dbde !important; font-weight: 400 !important; }

body.evc-oscuro .wpforms-container input[type=text],
body.evc-oscuro .wpforms-container input[type=email],
body.evc-oscuro .wpforms-container input[type=tel],
body.evc-oscuro .wpforms-container textarea,
body.evc-oscuro .wpforms-container select {
	background: #17191c !important;
	border: 1px solid #2a2d32 !important;
	color: #f2f3f4 !important;
	border-radius: 2px !important;
}

body.evc-oscuro .wpforms-container input:focus,
body.evc-oscuro .wpforms-container textarea:focus {
	border-color: #74a84a !important;
	outline: none !important;
}

body.evc-oscuro .wpforms-container button[type=submit] {
	background: #74a84a !important;
	border: 0 !important;
	color: #fff !important;
	border-radius: 2px !important;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-size: 13px !important;
	padding: 13px 28px !important;
}

body.evc-oscuro .wpforms-container button[type=submit]:hover { background: #8dc45f !important; }

/* Fichas de contacto */

.evc-contacto {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 18px;
	margin: 2.4em 0 0;
	padding-top: 2em;
	border-top: 1px solid #2a2d32;
}

.evc-contacto h3 { margin: 0 0 6px !important; font-size: 15px !important; }
.evc-contacto p { margin: 0; font-size: 14px; color: #9aa0a6; }

/* =========================================================================
   Piezas de maquetación para tarifas y contacto
   Menos cajas, más aire y una cifra grande: lo que se lee de un vistazo.
   ========================================================================= */

.evc-ancho {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	padding: 0 clamp(16px, 4vw, 56px);
	box-sizing: border-box;
}

.evc-limite { max-width: 1240px; margin: 0 auto; }

/* --- Tarjetas de precio --- */

.evc-precios {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 1px;
	margin: 0 0 clamp(40px, 6vw, 72px);
	background: #2a2d32;
	border: 1px solid #2a2d32;
}

.evc-precio-carta {
	display: flex;
	flex-direction: column;
	padding: clamp(28px, 3.5vw, 46px);
	background: #101215;
	border: 0;
	transition: background-color .25s ease;
}

.evc-precio-carta:hover { background: #14171b; }

.evc-precio-carta .evc-eti {
	display: block;
	margin-bottom: 22px;
	color: #8dc45f;
	font-size: 12px;
	letter-spacing: .22em;
	text-transform: uppercase;
}

.evc-precio-carta h3 {
	margin: 0 0 4px !important;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300 !important;
	font-size: clamp(24px, 2.6vw, 32px) !important;
	color: #fff !important;
	line-height: 1.15;
}

/* «Desde»: el precio de la web es el de la licencia estándar; las ampliadas
   suben, así que la cifra no puede presentarse como precio único. */
.evc-precio-carta .evc-desde {
	display: block;
	margin-bottom: 4px;
	color: #8a9096;
	font-family: Karla, sans-serif;
	font-size: 12px;
	letter-spacing: .2em;
	text-transform: uppercase;
}

.evc-precio-carta .evc-cifra {
	display: block;
	margin: 18px 0 4px;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
	font-size: clamp(52px, 6vw, 76px);
	line-height: .95;
	letter-spacing: -.02em;
	color: #fff;
}

.evc-precio-carta .evc-cifra small {
	display: block;
	margin-top: 10px;
	font-size: 12px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #8a9096;
}

.evc-precio-carta ul {
	margin: 26px 0 30px !important;
	padding: 0 !important;
	list-style: none;
}

.evc-precio-carta li {
	position: relative;
	margin: 0 0 11px;
	padding-left: 22px;
	font-size: 14.5px;
	line-height: 1.55;
	color: #a9afb5;
}

.evc-precio-carta li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 9px;
	width: 9px;
	height: 5px;
	border-left: 1.5px solid #74a84a;
	border-bottom: 1.5px solid #74a84a;
	transform: rotate(-45deg);
}

.evc-precio-carta .evc-boton { align-self: flex-start; }

/* wpautop envuelve el botón en un <p>: el que empuja hacia abajo es el <p>. */
.evc-precio-carta > *:last-child { margin-top: auto !important; margin-bottom: 0 !important; }
.evc-precio-carta > p:last-child { display: flex; }

/* --- Banda de llamada --- */

.evc-banda {
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	gap: clamp(24px, 4vw, 60px);
	align-items: center;
	margin: 0 0 clamp(40px, 6vw, 72px);
	padding: clamp(32px, 4.5vw, 60px);
	background: #17191c;
	border-left: 2px solid #74a84a;
}

.evc-banda h2 {
	margin: 0 0 12px !important;
	font-size: clamp(22px, 2.6vw, 34px) !important;
	line-height: 1.15;
}

.evc-banda p { margin: 0 0 8px; color: #a9afb5; font-size: 15.5px; line-height: 1.65; }

.evc-banda .evc-lado { text-align: left; }

@media (max-width: 820px) {
	.evc-banda { grid-template-columns: 1fr; }
}

/* --- Rejilla de cuatro puntos --- */

.evc-cuatro {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
	gap: clamp(20px, 3vw, 44px);
	margin: 0 0 clamp(40px, 6vw, 72px);
	padding-top: clamp(28px, 3.5vw, 44px);
	border-top: 1px solid #2a2d32;
}

.evc-cuatro h3 {
	margin: 0 0 8px !important;
	font-size: 15px !important;
	color: #fff !important;
	letter-spacing: .01em;
}

.evc-cuatro p { margin: 0; font-size: 14px; line-height: 1.6; color: #8a9096; }

/* --- Preguntas --- */

.evc-faq {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: clamp(22px, 3vw, 44px);
	margin: 0 0 clamp(30px, 4vw, 56px);
	padding-top: clamp(28px, 3.5vw, 44px);
	border-top: 1px solid #2a2d32;
}

.evc-faq h3 {
	margin: 0 0 7px !important;
	font-size: 15.5px !important;
	color: #fff !important;
}

.evc-faq p { margin: 0; font-size: 14.5px; line-height: 1.65; color: #8a9096; }

/* --- Dos columnas (contacto) --- */

.evc-dos {
	display: grid;
	grid-template-columns: 0.85fr 1.15fr;
	gap: clamp(30px, 5vw, 80px);
	align-items: start;
	margin-bottom: clamp(40px, 6vw, 70px);
}

.evc-dos .evc-marca-grande img {
	display: block;
	width: 100%;
	max-width: 320px;
	height: auto;
	margin-bottom: 28px;
}

.evc-dos h2 {
	margin: 0 0 14px !important;
	font-size: clamp(24px, 2.8vw, 34px) !important;
	line-height: 1.15;
}

.evc-dos .evc-lado p { color: #a9afb5; font-size: 15.5px; line-height: 1.7; }

.evc-datos { margin-top: 30px; padding-top: 26px; border-top: 1px solid #2a2d32; }

.evc-datos dl { margin: 0; }

.evc-datos dt {
	margin-top: 18px;
	color: #6f757b;
	font-size: 11.5px;
	letter-spacing: .18em;
	text-transform: uppercase;
}

.evc-datos dt:first-child { margin-top: 0; }

.evc-datos dd {
	margin: 5px 0 0;
	color: #d8dbde;
	font-size: 15px;
	line-height: 1.55;
}

.evc-datos dd a { color: #8dc45f; }

.evc-caja-form {
	padding: clamp(26px, 3.2vw, 42px);
	background: #101215;
	border: 1px solid #2a2d32;
}

.evc-caja-form h2 { margin-top: 0 !important; }

body.evc-oscuro .evc-caja-form .wpforms-container { max-width: none; margin: 0; }

@media (max-width: 860px) {
	.evc-dos { grid-template-columns: 1fr; }
	.evc-dos .evc-marca-grande img { max-width: 240px; }
}

/* En estas páginas el texto suelto no se centra: manda la rejilla. */
body.evc-oscuro .entry-content > .evc-limite { max-width: 1240px; }
body.evc-oscuro .entry-content > .evc-limite > * { max-width: none; }

/* Cuando la «cifra» es una palabra («Consultar») no puede ir a 76 px: parte. */
.evc-precio-carta .evc-cifra.es-texto {
	font-size: clamp(30px, 3.1vw, 42px);
	line-height: 1.1;
	hyphens: none;
}

/* wpautop mete párrafos vacíos entre bloques; que no abran hueco. */
.evc-precio-carta > p:empty,
.evc-dos p:empty,
.evc-cuatro p:empty,
.evc-faq p:empty { display: none; }

/* =========================================================================
   Pie de página
   Astra lo pinta claro y con el isotipo negro; sobre una web oscura canta.
   Se oscurece en todas las páginas, no solo en las del catálogo.
   ========================================================================= */

.site-footer,
.site-footer .site-primary-footer-wrap,
.site-footer .site-below-footer-wrap,
.site-footer .ast-builder-grid-row-container {
	background-color: #0a0b0d !important;
	color: #8a9096 !important;
	border: 0 !important;
}

.site-footer {
	border-top: 1px solid #24272b !important;
}

.site-footer,
.site-footer p,
.site-footer .ast-builder-html-element {
	font-size: 13.5px;
	line-height: 1.7;
}

.site-footer a {
	color: #9aa0a6 !important;
	text-decoration: none;
	transition: color .2s ease;
}

.site-footer a:hover,
.site-footer a:focus {
	color: #8dc45f !important;
}

.site-footer .footer-navigation ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px clamp(16px, 2.4vw, 34px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-footer .footer-navigation li { margin: 0; }

.site-footer .footer-navigation a {
	padding: 4px 0;
	font-size: 13.5px;
	letter-spacing: .01em;
}

/* El isotipo negro se cambia por el logotipo en blanco, que sí se lee. */
.site-footer .ast-builder-html-element img { display: none !important; }

.site-footer .ast-builder-html-element:has(img)::before {
	content: "";
	display: block;
	width: 220px;
	max-width: 70%;
	height: 46px;
	margin: 0 auto;
	background: var(--evc-logo, none) center / contain no-repeat;
	opacity: .85;
}

.site-footer .site-footer-section-3,
.site-footer .ast-footer-copyright {
	color: #6f757b !important;
	font-size: 12.5px;
}

/* =========================================================================
   Acordeón de preguntas
   Seis respuestas seguidas son un muro de texto. Plegadas, la página se lee
   de un vistazo y cada uno abre solo lo que le interesa.
   ========================================================================= */

.evc-acordeon {
	margin: 0 0 clamp(30px, 4vw, 56px);
	padding-top: clamp(28px, 3.5vw, 44px);
	border-top: 1px solid #2a2d32;
}

.evc-acordeon > h2 {
	margin: 0 0 clamp(18px, 2vw, 28px) !important;
	font-size: clamp(22px, 2.4vw, 30px) !important;
}

.evc-acordeon details {
	border-bottom: 1px solid #22252a;
}

.evc-acordeon details:first-of-type { border-top: 1px solid #22252a; }

.evc-acordeon summary {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: clamp(17px, 1.9vw, 24px) 4px;
	cursor: pointer;
	list-style: none;
	color: #e8eaec;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
	font-size: clamp(16px, 1.35vw, 19px);
	line-height: 1.35;
	transition: color .25s ease, padding-left .25s ease;
}

.evc-acordeon summary::-webkit-details-marker { display: none; }
.evc-acordeon summary::marker { content: ""; }

.evc-acordeon summary:hover,
.evc-acordeon details[open] > summary { color: #ffffff; }

.evc-acordeon summary:hover { padding-left: 10px; }

.evc-acordeon summary:focus-visible {
	outline: 2px solid #74a84a;
	outline-offset: 3px;
}

/* El signo: una cruz que gira hasta convertirse en un menos al abrir. */
.evc-acordeon .evc-signo {
	position: relative;
	flex: 0 0 auto;
	width: 17px;
	height: 17px;
	margin-left: auto;
	transition: transform .38s cubic-bezier(.4, 0, .2, 1);
}

.evc-acordeon .evc-signo::before,
.evc-acordeon .evc-signo::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 1.5px;
	background: #74a84a;
	transform: translateY(-50%);
	transition: opacity .3s ease, background-color .25s ease;
}

.evc-acordeon .evc-signo::after { transform: translateY(-50%) rotate(90deg); }

.evc-acordeon details[open] > summary .evc-signo { transform: rotate(180deg); }
.evc-acordeon details[open] > summary .evc-signo::after { opacity: 0; }

.evc-acordeon summary:hover .evc-signo::before,
.evc-acordeon summary:hover .evc-signo::after { background: #8dc45f; }

/* El cuerpo: lo abre y lo cierra el guion midiendo la altura real. */
.evc-acordeon .evc-respuesta {
	overflow: hidden;
}

.evc-acordeon .evc-respuesta > div {
	padding: 0 46px clamp(20px, 2.2vw, 28px) 4px;
	color: #969ca2;
	font-size: 15px;
	line-height: 1.75;
	opacity: 0;
	transform: translateY(-6px);
	transition: opacity .35s ease .06s, transform .35s ease .06s;
}

.evc-acordeon details[open] .evc-respuesta > div {
	opacity: 1;
	transform: none;
}

.evc-acordeon .evc-respuesta p { margin: 0 0 10px; }
.evc-acordeon .evc-respuesta p:last-child { margin-bottom: 0; }

/* Sin guion sigue funcionando: se abre de golpe, pero se abre. */
.evc-acordeon details:not([open]) .evc-respuesta { height: 0; }

@media (prefers-reduced-motion: reduce) {
	.evc-acordeon .evc-respuesta,
	.evc-acordeon .evc-respuesta > div,
	.evc-acordeon .evc-signo,
	.evc-acordeon summary { transition: none !important; }
}

@media (max-width: 600px) {
	.evc-acordeon .evc-respuesta > div { padding-right: 12px; }
}

/* =========================================================================
   Fichas y páginas de texto sobre fondo oscuro
   El catálogo es negro; entrar en una ficha y encontrarse una página blanca
   rompe el hilo. Estas reglas visten lo que pinta el tema.
   ========================================================================= */

body.evc-con-titulo .entry-header {
	max-width: 68rem;
	margin: 0 auto clamp(18px, 2.4vw, 30px);
	padding-top: clamp(26px, 3.4vw, 48px);
}

body.evc-con-titulo .entry-title {
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300 !important;
	font-size: clamp(26px, 3vw, 40px) !important;
	line-height: 1.12;
	color: #ffffff !important;
}

/* La firma «Por admin / fecha» no aporta nada en una ficha de producto. */
body.evc-con-titulo.single-download .entry-meta,
body.evc-con-titulo.single-download .post-meta,
body.evc-con-titulo.single-download .ast-single-post-order { display: none !important; }

body.evc-oscuro .ast-article-single > .entry-content > p:first-of-type { margin-top: 0; }

/* Precio, botón de compra y avisos de EDD. */
body.evc-oscuro .edd_price,
body.evc-oscuro .edd_download_purchase_form .edd_price_options label,
body.evc-oscuro .edd_purchase_submit_wrapper { color: #e8eaec; }

body.evc-oscuro .edd_purchase_tax_rate { color: #8a9096; }

body.evc-oscuro .edd-add-to-cart,
body.evc-oscuro .edd_go_to_checkout,
body.evc-oscuro input[type="submit"].edd-submit,
body.evc-oscuro .button.edd-submit {
	background: #74a84a !important;
	border-color: #74a84a !important;
	color: #ffffff !important;
	border-radius: 0 !important;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-size: 12.5px;
}

body.evc-oscuro .edd-add-to-cart:hover,
body.evc-oscuro .edd_go_to_checkout:hover,
body.evc-oscuro input[type="submit"].edd-submit:hover {
	background: #8dc45f !important;
	border-color: #8dc45f !important;
}

body.evc-oscuro .edd_added_to_cart_alert,
body.evc-oscuro .edd_cart_amount { color: #8dc45f; }

/* Formularios sobre oscuro: los campos del tema son blancos. */
body.evc-oscuro input[type="text"],
body.evc-oscuro input[type="email"],
body.evc-oscuro input[type="tel"],
body.evc-oscuro input[type="url"],
body.evc-oscuro input[type="number"],
body.evc-oscuro input[type="search"],
body.evc-oscuro textarea,
body.evc-oscuro select {
	background: #101215 !important;
	border: 1px solid #2a2d32 !important;
	color: #e8eaec !important;
	border-radius: 0 !important;
}

body.evc-oscuro input::placeholder,
body.evc-oscuro textarea::placeholder { color: #6f757b !important; }

body.evc-oscuro input:focus,
body.evc-oscuro textarea:focus,
body.evc-oscuro select:focus { border-color: #74a84a !important; }

body.evc-oscuro label,
body.evc-oscuro legend { color: #b6bcc2; }

/* Navegación entre entradas y bloques sueltos del tema. */
body.evc-oscuro .post-navigation a,
body.evc-oscuro .ast-single-related-posts-container { color: #b6bcc2; }

/* El acceso a «Mis descargas» solo aparece si hay sesión iniciada. */
.evc-cuenta svg { width: 20px; height: 20px; }

/* =========================================================================
   Carrito, pago, recibo e historial
   El pago va en oscuro como el resto, con una excepción: el campo de tarjeta
   de Stripe es un iframe con sus propios estilos y no se puede pintar desde
   aquí. Se le deja una caja clara alrededor, deliberada, para que parezca una
   decisión y no un despiste.
   ========================================================================= */

body.evc-tienda #edd_checkout_wrap,
body.evc-tienda #edd_checkout_cart_wrap {
	max-width: 62rem;
	margin: 0 auto;
}

body.evc-tienda #edd_checkout_cart,
body.evc-tienda #edd_checkout_cart th,
body.evc-tienda #edd_checkout_cart td {
	background: #101215 !important;
	border-color: #2a2d32 !important;
	color: #c9ced3 !important;
}

body.evc-tienda #edd_checkout_cart thead th,
body.evc-tienda #edd_checkout_cart .edd_cart_header_row th {
	background: #17191c !important;
	color: #9aa0a6 !important;
	font-size: 12px;
	letter-spacing: .12em;
	text-transform: uppercase;
}

body.evc-tienda #edd_checkout_cart .edd_cart_total,
body.evc-tienda #edd_checkout_cart .edd_cart_total .edd_cart_amount {
	color: #ffffff !important;
	font-size: 17px;
}

body.evc-tienda #edd_checkout_cart a { color: #8dc45f !important; }

body.evc-tienda fieldset,
body.evc-tienda #edd_checkout_form_wrap fieldset {
	background: #101215;
	border: 1px solid #2a2d32;
	padding: clamp(20px, 2.6vw, 32px);
	margin-bottom: 22px;
}

body.evc-tienda #edd_checkout_form_wrap legend,
body.evc-tienda #edd_checkout_form_wrap fieldset > span.edd-description,
body.evc-tienda #edd_checkout_form_wrap .edd-legend {
	background: transparent !important;
	border: 0 !important;
	color: #ffffff !important;
	font-family: Rubik, Karla, sans-serif;
	font-weight: 300;
	font-size: 19px;
	padding: 0 0 6px;
}

body.evc-tienda #edd_checkout_form_wrap label { color: #b6bcc2 !important; }
body.evc-tienda #edd_checkout_form_wrap .edd-description { color: #7d838a !important; font-style: normal; }
body.evc-tienda #edd_checkout_form_wrap .edd-required-indicator { color: #cf6b5c !important; }

body.evc-tienda #edd_checkout_form_wrap input[type="submit"],
body.evc-tienda #edd_purchase_submit .edd-submit {
	background: #74a84a !important;
	border: 0 !important;
	color: #fff !important;
	border-radius: 0 !important;
	padding: 14px 30px !important;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-size: 13px;
}

body.evc-tienda #edd_checkout_form_wrap input[type="submit"]:hover { background: #8dc45f !important; }

/* El iframe de la tarjeta necesita fondo claro para verse: se le da su propia
   caja, con etiqueta, en vez de dejarlo flotando sobre el negro. */
body.evc-tienda #edd_secure_site_wrapper,
body.evc-tienda .edd-stripe-card-element,
body.evc-tienda #edd-card-element,
body.evc-tienda .edd-card-element {
	background: #f7f8f9;
	border: 1px solid #2a2d32;
	border-radius: 2px;
	padding: 14px;
}

body.evc-tienda #edd_secure_site_wrapper { color: #4a4f55; }

/* Historial de descargas del cliente. */
body.evc-oscuro #edd_user_history,
body.evc-oscuro #edd_user_history th,
body.evc-oscuro #edd_user_history td,
body.evc-oscuro .edd-table,
body.evc-oscuro .edd-table th,
body.evc-oscuro .edd-table td {
	background: #101215 !important;
	border-color: #2a2d32 !important;
	color: #c9ced3 !important;
}

body.evc-oscuro #edd_user_history a,
body.evc-oscuro .edd-table a { color: #8dc45f !important; }

/* Avisos de EDD (carrito vacío, descuento aplicado, errores). */
body.evc-oscuro .edd_errors,
body.evc-oscuro .edd_success,
body.evc-oscuro .edd-alert {
	background: #17191c !important;
	border: 1px solid #2a2d32 !important;
	border-left-width: 2px !important;
	color: #c9ced3 !important;
}

body.evc-oscuro .edd_errors,
body.evc-oscuro .edd-alert-error { border-left-color: #cf6b5c !important; }
body.evc-oscuro .edd_success,
body.evc-oscuro .edd-alert-success { border-left-color: #74a84a !important; }

/* ---------- Archivo de categoría ----------
   Estas páginas usaban la plantilla clara por defecto de EDD y parecían de
   otra web. Ahora comparten la rejilla y el fondo del catálogo. */

.evc-categoria { padding-top: clamp(28px, 4vw, 56px); }

.evc-migas {
	margin-bottom: 18px;
	font-size: 12px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--evc-suave);
}
.evc-migas a { color: var(--evc-suave); }
.evc-migas a:hover { color: var(--evc-verde-claro); }
.evc-migas span { margin: 0 8px; }

.evc-cat-cabecera { margin-bottom: clamp(24px, 3vw, 40px); }
.evc-cat-cabecera h1 {
	margin: 0 0 12px !important;
	font-weight: 300;
	font-size: clamp(30px, 4.4vw, 52px);
	line-height: 1.05;
	color: var(--evc-texto);
}
.evc-cat-entradilla {
	margin: 0 0 10px;
	max-width: 68ch;
	font-size: clamp(15px, 1.5vw, 18px);
	line-height: 1.55;
	color: #c9cdd2;
}
.evc-cat-datos {
	margin: 0;
	max-width: 72ch;
	font-size: 14px;
	line-height: 1.6;
	color: var(--evc-suave);
}

.evc-cat-hermanos { margin: clamp(36px, 5vw, 64px) 0 0; }
.evc-cat-hermanos h2 {
	margin: 0 0 16px !important;
	font-weight: 300;
	font-size: clamp(19px, 2.2vw, 26px);
}
.evc-cat-hermanos ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.evc-cat-hermanos li { margin: 0; }
.evc-cat-hermanos a {
	display: inline-flex;
	align-items: baseline;
	gap: 8px;
	padding: 9px 14px;
	border: 1px solid var(--evc-borde);
	background: var(--evc-carta);
	font-size: 14px;
	color: var(--evc-texto);
	transition: border-color .2s ease, background-color .2s ease;
}
.evc-cat-hermanos a:hover {
	border-color: var(--evc-verde);
	background: #1b1f23;
}
.evc-cat-hermanos a span {
	font-size: 12px;
	color: var(--evc-suave);
}

.evc-cat-volver {
	margin: clamp(28px, 4vw, 48px) 0 0;
	font-size: 13px;
	letter-spacing: .14em;
	text-transform: uppercase;
}
.evc-cat-volver a { color: var(--evc-verde-claro); border-bottom: 1px solid currentColor; }

.evc-categoria .evc-banda { margin-top: clamp(36px, 5vw, 64px); }
.evc-categoria .evc-vacio { display: block; }

/* ---------- Diario ----------
   Las entradas las escribe una persona y se leen seguidas: aquí manda la
   legibilidad, no la rejilla. Columna estrecha, aire entre párrafos y
   enlaces que se vean, que es justo lo que el tema no da por defecto. */

/* La medida va en rem y no en ch a propósito: el título usa otra tipografía,
   su «ch» mide distinto y la cabecera acababa desalineada del texto. */
body.evc-oscuro.single-post .entry-content > p,
body.evc-oscuro.single-post .entry-content > h2,
body.evc-oscuro.single-post .entry-content > h3,
body.evc-oscuro.single-post .entry-header {
	max-width: 68rem;
	margin-left: auto;
	margin-right: auto;
}

body.evc-oscuro.single-post .entry-content > p {
	margin: 0 0 1.35em;
	line-height: 1.75;
}

body.evc-oscuro.single-post .entry-content > h2 {
	margin: 2.1em 0 .65em;
	font-size: clamp(21px, 2.3vw, 29px);
	font-weight: 400;
	letter-spacing: .01em;
}

body.evc-oscuro.single-post .entry-content > h3 {
	margin: 1.7em 0 .45em;
	font-size: clamp(17px, 1.7vw, 20px);
	font-weight: 400;
	color: #e8eaec !important;
}

body.evc-oscuro.single-post .entry-content > p a {
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

body.evc-oscuro.single-post .entry-content > p a:hover {
	color: #a6d97a;
}

/* En medio del texto, la cursiva es énfasis y tiene que leerse como el resto:
   en gris apagado parecía texto desactivado. El gris se reserva para la firma,
   que es el último párrafo. */
body.evc-oscuro.single-post .entry-content em {
	color: inherit;
	font-style: italic;
}

body.evc-oscuro.single-post .entry-content > p:last-child em {
	color: #9aa0a6;
	font-style: normal;
}

/* La firma va en el texto; el «Por admin» del tema sobra y además miente. */
body.evc-oscuro.single-post .entry-meta,
body.evc-oscuro.single-post .post-navigation,
body.evc-oscuro.single-post .ast-single-related-posts-container {
	display: none;
}

/* Listado del diario. Lo pinta plantillas/diario.php: el listado del tema
   salía en tarjetas blancas, sin título y firmado por «admin». */

.evc-diario { padding-top: clamp(28px, 4vw, 56px); }

.evc-diario-lista {
	list-style: none;
	margin: clamp(28px, 4vw, 48px) 0 0;
	padding: 0;
	max-width: 68rem;
}

.evc-diario-pieza {
	border-top: 1px solid var(--evc-borde);
	padding: clamp(22px, 3vw, 34px) 0;
}

.evc-diario-fecha {
	margin: 0 0 .5em;
	font-size: 12px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--evc-suave);
}

.evc-diario-titulo {
	margin: 0 0 .5em;
	font-size: clamp(21px, 2.3vw, 30px);
	font-weight: 400;
	line-height: 1.25;
}

.evc-diario-titulo a {
	color: var(--evc-texto);
	text-decoration: none;
}

.evc-diario-titulo a:hover { color: #8dc45f; }

.evc-diario-resumen {
	margin: 0 0 .8em;
	color: #b6bcc2;
	line-height: 1.7;
}

.evc-diario-mas { margin: 0; }

.evc-diario-mas a {
	color: #8dc45f;
	text-decoration: underline;
	text-underline-offset: 3px;
	font-size: 14px;
	letter-spacing: .04em;
}

.evc-diario .navigation.pagination {
	margin-top: clamp(24px, 3vw, 40px);
}

.evc-diario .page-numbers {
	color: var(--evc-suave);
	padding: 6px 12px;
	border: 1px solid var(--evc-borde);
	margin-right: 6px;
	text-decoration: none;
	display: inline-block;
}

.evc-diario .page-numbers.current,
.evc-diario .page-numbers:hover {
	color: var(--evc-texto);
	border-color: #8dc45f;
}