/* ==========================================================================
   YOUNG 2026 — Retoques sobre los módulos propios de Zeen
   (bloques de Tipi Builder, relacionados, artículo siguiente, menú…)

   1. Nunca esquinas rectas: toda imagen de tarjeta a 9 px.
   2. El icono de formato siempre arriba a la derecha (no pisa el titular)
      y con los iconos de la app YOUNG.

   La imagen destacada de la cabecera del artículo (.hero-wrap) no se toca.
   ========================================================================== */

/* 1. Esquinas ----------------------------------------------------------------
   Se redondea la IMAGEN (.mask y equivalentes), no el <article>: Zeen separa
   las tarjetas de rejilla con bordes transparentes, y redondear el artículo
   redondearía ese hueco en vez de la foto. */
.young-2026 .mask:not(.hero-wrap .mask),
.young-2026 .mask__wrap,
.young-2026 .mask-img,
.young-2026 .block-wrap .event__img,
.young-2026 .block-wrap .gallery-block__image,
.young-2026 .block-wrap .video-wrap,
.young-2026 .block-wrap-instagram a,
.young-2026 .block-wrap-twitch iframe,
.young-2026 .block-wrap-youtube-playlist iframe {
	border-radius: var(--young-radius-card);
	overflow: hidden;
	isolation: isolate; /* evita que el zoom al pasar el ratón «rompa» la esquina en Safari */
}

/* La foto y todo lo que se pinta encima heredan la esquina */
.young-2026 .mask:not(.hero-wrap .mask) :is(img, picture, video, iframe, .mask-overlay),
.young-2026 .mask__wrap img,
.young-2026 .block-wrap .event__img img,
.young-2026 .block-wrap .gallery-block__image img,
.young-2026 .block-wrap-instagram img,
.young-2026 .zeen-pin-it {
	border-radius: inherit;
}

/* Zeen trae 5 px en su opción «esquinas redondeadas»: pasa a la medida de la casa */
.young-2026 .rounded-corners .mask,
.young-2026 .rounded-corners .mask img,
.young-2026 .rounded-corners .slider .slide {
	border-radius: var(--young-radius-card);
}

/* El visor del slider no se redondea (en un carrusel redondearía solo los
   extremos); la esquina la lleva cada tarjeta. */
.young-2026 .rounded-corners .slider,
.young-2026 .rounded-corners .flickity-viewport {
	border-radius: 0;
}

/* Excepciones: lo que va a sangre o no es una tarjeta */
.young-2026 .zeen-top-block :is(.mask, .mask img, .mask__wrap, .slider .slide),
.young-2026 .mask.mask-transparent,
.young-2026 .mask.mask-transparent img,
.young-2026 .mask.splitter--fade,
.young-2026 .mask.splitter--fade img,
.young-2026 .young-sangre :is(.mask, .mask img, .mask__wrap, .slider .slide, .video-wrap) {
	border-radius: 0;
}
.young-2026 .mask.mask-transparent,
.young-2026 .mask.splitter--fade {
	overflow: visible;
}

/* 2. Icono de formato --------------------------------------------------------
   Zeen lo pone en el centro, abajo a la izquierda o arriba a la izquierda
   según el ajuste. En YOUNG va siempre arriba a la derecha, separado 10 px de
   la esquina, en una caja gris claro con el icono de la app. */
.young-2026 .media-icon:not(.hero-wrap .media-icon) {
	position: absolute !important;
	top: var(--young-badge-inset) !important;
	right: var(--young-badge-inset) !important;
	bottom: auto !important;
	left: auto !important;
	transform: none !important;
	width: var(--young-badge-size) !important;
	height: var(--young-badge-size) !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	border-radius: var(--young-radius-card);
	color: var(--young-text) !important;
	z-index: 4;
}
.young-2026 .media-icon:not(.hero-wrap .media-icon) .icon-bg {
	border: 0 !important;
	border-radius: inherit !important;
	background: var(--young-badge-bg) !important;
	box-shadow: none !important;
	transform: none !important;
}
.young-2026 .media-icon:not(.hero-wrap .media-icon) :is(i, .image__count) {
	display: none !important;
}
.young-2026 .media-icon:not(.hero-wrap .media-icon)::before {
	content: "";
	width: 24px;
	height: 24px;
	background: var(--young-text) !important; /* oscuro siempre: la caja es gris claro */
	-webkit-mask: var(--young-icon-video) center / contain no-repeat;
	        mask: var(--young-icon-video) center / contain no-repeat;
}
.young-2026 :is(.format-gallery, [data-format="gallery"]) .media-icon:not(.hero-wrap .media-icon)::before,
.young-2026 .media-icon[data-format="gallery"]::before {
	-webkit-mask-image: var(--young-icon-gallery);
	        mask-image: var(--young-icon-gallery);
}
.young-2026 .format-audio .media-icon:not(.hero-wrap .media-icon)::before,
.young-2026 .media-icon[data-format="audio"]::before {
	-webkit-mask-image: var(--young-icon-audio);
	        mask-image: var(--young-icon-audio);
}

/* Insignia pequeña en miniaturas */
.young-2026 :is(.icon-size-xs, .icon-size-s).media-icon:not(.hero-wrap .media-icon) {
	top: var(--young-badge-inset-sm) !important;
	right: var(--young-badge-inset-sm) !important;
	width: 30px !important;
	height: 30px !important;
	border-radius: var(--young-radius-badge);
}
.young-2026 :is(.icon-size-xs, .icon-size-s).media-icon:not(.hero-wrap .media-icon)::before {
	width: 18px;
	height: 18px;
}

/* 3. Nunca se recorta un titular ----------------------------------------------
   Zeen corta con «…» los titulares de la miniatura redonda y de la lista de
   vídeos. En YOUNG pasan a ocupar las líneas que necesiten. */
.young-2026 .preview-25 .preview-mini-wrap .title,
.young-2026 .videos-mini-wrap article .title a {
	white-space: normal !important;
	text-overflow: clip !important;
	overflow: visible !important;
}
.young-2026 :is(.preview-mini-wrap, .preview-grid, .preview-slider, .preview-classic) :is(.title, .subtitle) {
	overflow-wrap: break-word;
	-webkit-line-clamp: unset !important;
}

/* 4. Movimiento: zoom al pasar el ratón más ligero y fluido ------------------
   Zeen acerca la foto ×1,1 en 1 s; en YOUNG ×1,06 en 1,5 s con curva suave. */
.young-2026 .img-ani-base :is(.fi-bg, .mask img) {
	transition: transform 1.5s cubic-bezier(.22, .61, .36, 1), opacity .5s ease;
}
@media (hover: hover) and (pointer: fine) {
	.young-2026 :is(.img-ani-1.block-wrap-tiles:hover img, .img-ani-1:hover .fi-bg, .img-ani-1.cta-tile:hover img, .img-ani-1 .mask:hover img) {
		transform: scale(1.06);
	}
}

/* 5. Flechas (megamenú, sliders, «cargar más»): esquinas de la casa -------- */
.young-2026 .tipi-arrow {
	border-radius: var(--young-radius-label);
}
.young-2026 .tipi-arrow.tipi-arrow-m {
	border-radius: var(--young-radius-button);
}

/* 6. Megamenú: títulos de los artículos con la fuente de titulares (Museo) */
.young-2026 .mm-art :is(.title, .title a),
.young-2026 .mm-art .preview-mini-wrap .title {
	font-family: var(--young-font-display);
}

/* 7. Nota de las reviews (Let's Review) en las tarjetas de Zeen y el megamenú
   Antes: esquina de color con la nota. Ahora: la misma caja que las insignias
   YOUNG (46 px, gris #E5E5EA, cifra oscura), arriba a la derecha.
   El color de la caja le llega como estilo en línea: de ahí los !important. */
.young-2026 .zeen-review:not(.hero-wrap .zeen-review) {
	position: absolute !important;
	top: var(--young-badge-inset) !important;
	right: var(--young-badge-inset) !important;
	bottom: auto !important;
	left: auto !important;
	width: var(--young-badge-size) !important;
	min-width: 0 !important;
	height: var(--young-badge-size) !important;
	padding: 0 !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	border: 0 !important;
	border-radius: var(--young-radius-card);
	background: var(--young-badge-bg) !important;
	color: var(--young-text) !important;
	box-shadow: none !important;
	opacity: 1 !important;
	line-height: 1 !important;
	text-align: center !important;
	z-index: 4;
}
.young-2026 .zeen-review:not(.hero-wrap .zeen-review) .lets-review-api-score-box {
	position: static !important;
	width: auto !important;
	transform: none !important;
	background: none !important;
	color: inherit !important;
}
.young-2026 .zeen-review:not(.hero-wrap .zeen-review) .lets-review-final-score {
	padding: 0 !important;
	opacity: 1 !important;
	color: var(--young-text) !important;
	font: 700 17px / 1 var(--young-font-text) !important;
	letter-spacing: 0 !important;
}
.young-2026 .zeen-review:not(.hero-wrap .zeen-review) .cb-percent-sign { font-size: 10px !important; padding-left: 1px; }
.young-2026 .zeen-review:not(.hero-wrap .zeen-review) :is(.cb-bar, .lets-review-subtitle) { display: none !important; }
/* Valoración con iconos (estrellas…): la caja se ensancha lo justo */
.young-2026 .zeen-review.lr-api-has-icons:not(.hero-wrap .zeen-review) {
	width: auto !important;
	padding: 0 10px !important;
}
/* Miniaturas */
.young-2026 .preview-thumbnail .zeen-review:not(.hero-wrap .zeen-review) {
	top: var(--young-badge-inset-sm) !important;
	right: var(--young-badge-inset-sm) !important;
	width: 30px !important;
	height: 30px !important;
	border-radius: var(--young-radius-badge);
}
.young-2026 .preview-thumbnail .zeen-review .lets-review-final-score { font-size: 13px !important; }
/* La nota manda: si el artículo es una review, no se muestra además el icono de formato */
.young-2026 article:has(.zeen-review) .media-icon:not(.hero-wrap .media-icon) { display: none !important; }