/* Paridad editor (encargo 07 Fase 4): los tokens se declaran también sobre
   .editor-styles-wrapper para que resuelvan dentro del iframe del canvas. */
:root,
.editor-styles-wrapper {

	/* === Endurance Intelligence — tokens de color (DESIGN.md 2.1 / 2.2) ===
	   IDENTIDAD DE COLOR PROPIA DEL PLUGIN. La paleta Endurance se define con
	   HEX DIRECTO, independiente del tema activo. Antes estos tokens heredaban
	   de Andromeda con fallback Endurance (var(--wp--preset--color--*, #hex)),
	   pero un tema con paleta clara (p.ej. Andromeda por defecto: surface
	   #ffffff, brand teal) ANULA el fallback y rompe la identidad de marca y el
	   contraste AA. Por eso la fuente por defecto es siempre el hex Endurance.

	   OVERRIDE OPCIONAL (NO activo, solo documentado): un sitio que quiera
	   reutilizar la paleta de su child theme (Andromeda) puede reasignar estos
	   tokens en el CSS del hijo. Al optar, el sitio asume la responsabilidad
	   del contraste AA. Ejemplo:

	   :root {
	     --rm-color-canvas:        var(--wp--preset--color--canvas);
	     --rm-color-surface:       var(--wp--preset--color--surface);
	     --rm-color-text:          var(--wp--preset--color--text);
	     --rm-color-text-soft:     var(--wp--preset--color--text-soft);
	     --rm-color-border:        var(--wp--preset--color--border);
	     --rm-color-brand:         var(--wp--preset--color--brand);
	     --rm-color-accent-signal: var(--wp--preset--color--accent);
	     --rm-color-accent-2:      var(--wp--preset--color--accent-2);
	   }
	*/
	--rm-color-canvas: #12141f;
	--rm-color-surface: #1b1e2b;
	--rm-color-surface-alt: #222537;
	--rm-color-text: #f8f4ee;
	--rm-color-text-soft: #9b9eaa;
	--rm-color-border: #2a2e3c;
	--rm-color-brand: #39ff14;
	--rm-color-accent-signal: #39ff14;
	--rm-color-accent-2: #7b6fff;
	--rm-color-positive: #00c77a;
	--rm-color-negative: #ff8080;
	--rm-color-fastest-lap: var(--rm-color-accent-2);
	--rm-color-status-live: var(--rm-color-brand);
	--rm-color-status-upcoming: #e8c14a;
	--rm-color-status-finished: #555869;
	--rm-color-status-cancelled: var(--rm-color-negative);
	--rm-color-status-scheduled: var(--rm-color-text-soft);

	/* Alias semánticos de estado (encargo 07 §2.2): un token por estado de
	   evento, espejo de las clases .rm-status-badge--* en español. Cada
	   estado se tokeniza, no se hardcodea. */
	--rm-color-status-confirmed: var(--rm-color-positive);
	--rm-color-status-postponed: var(--rm-color-status-upcoming);

	/* === Tipografía (DESIGN.md 3) === */
	--rm-font-display: "Barlow Condensed", system-ui, -apple-system, "Segoe UI", sans-serif;
	--rm-font-body: "Barlow Condensed", system-ui, -apple-system, "Segoe UI", sans-serif;
	--rm-text-hero: clamp(3rem, 8vw, 7rem);
	--rm-text-3xl: 3rem;
	--rm-text-2xl: 2rem;
	--rm-text-xl: 1.5rem;
	--rm-text-lg: 1.125rem;
	--rm-text-base: 1rem;
	--rm-text-sm: 0.8125rem;
	--rm-text-xs: 0.6875rem;

	/* === Espaciado base 4px (DESIGN.md 4) === */
	--rm-space-1: 0.25rem;
	--rm-space-2: 0.5rem;
	--rm-space-3: 0.75rem;
	--rm-space-4: 1rem;
	--rm-space-6: 1.5rem;
	--rm-space-8: 2rem;
	--rm-space-12: 3rem;
	--rm-space-16: 4rem;

	/* === Radios (DESIGN.md 5.1) === */
	--rm-radius-none: 0;
	--rm-radius-sm: 2px;
	--rm-radius-pill: 999px;

	/* === Layout (DESIGN.md 6) === */
	--rm-content-max: 1200px;
	--rm-wide-max: 1400px;
	--rm-gutter: 1.5rem;
	--rm-margin-desktop: 3rem;
	--rm-block-gap: 1.5rem;

	/* === Textura de papel milimetrado al 4% (DESIGN.md 5.3) === */
	--rm-grid-texture: radial-gradient(circle, color-mix(in srgb, var(--rm-color-text) 4%, transparent) 1px, transparent 1px);
	--rm-grid-texture-size: 20px 20px;

	/* === Derivaciones tokenizadas (encargo 07 §3) ===
	   Todo rgba()/gradiente del CSS deriva de un token base vía color-mix().
	   El oscurecedor (--rm-shade) y la base de sombra (--rm-shadow-color, rgb)
	   son fallback legítimo de última capa: las sombras proyectadas negras no
	   son pares de contraste de texto. === */
	--rm-shade: #000;
	--rm-scrim: var(--rm-color-canvas);
	--rm-shadow-color: 0 0 0;
	--rm-shadow-float: 0 16px 40px rgb(var(--rm-shadow-color) / 35%);
	--rm-shadow-card: 6px 6px 0 rgb(var(--rm-shadow-color) / 55%);
	--rm-shadow-button: 4px 4px 0 rgb(var(--rm-shadow-color) / 18%);
	--rm-text-shadow-strong: 3px 3px 0 color-mix(in srgb, var(--rm-shade) 75%, transparent);
	--rm-text-shadow-card: 2px 2px 0 color-mix(in srgb, var(--rm-shade) 75%, transparent);
	--rm-text-shadow-title: 2px 2px 0 color-mix(in srgb, var(--rm-color-text) 18%, transparent);

	/* === Alias legacy → Endurance (compatibilidad con el CSS existente).
	   El verde señal (brand) queda RESERVADO para foco / líder / LIVE: el
	   alias decorativo --rm-color-accent apunta al borde, no al verde. === */
	--rm-color-bg: var(--rm-color-canvas);
	--rm-color-surface-strong: var(--rm-color-surface-alt);
	--rm-color-muted: var(--rm-color-text-soft);
	--rm-color-accent: var(--rm-color-border);
	--rm-color-accent-contrast: var(--rm-color-canvas);
	--rm-max-width: var(--flavor-wide-width, 1400px);
}

body.rm-template-body {
	margin: 0;
	background: var(--rm-color-bg);
}

.rm-site-header {
	background: var(--rm-color-canvas);
	border-bottom: 1px solid var(--rm-color-border);
	color: var(--rm-color-text);
}

.rm-site-header__inner {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 40px;
	align-items: center;
	width: min(100% - 40px, 1720px);
	min-height: 132px;
	margin: 0 auto;
	padding: 24px 0;
}

.rm-site-title {
	display: inline-block;
	color: var(--rm-color-text);
	font-size: 2rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none;
	text-transform: uppercase;
}

.rm-site-logo img {
	display: block;
	max-width: 220px;
	height: auto;
}

.rm-site-description {
	color: var(--rm-color-text-soft);
	font-size: 1rem;
	margin: 0.4rem 0 0;
}

.rm-site-nav {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.rm-site-nav > .rm-site-nav__list,
.rm-site-nav > .menu,
.rm-site-nav .rm-site-nav__list > ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	justify-content: flex-end;
	margin: 0;
	padding: 0;
	list-style: none;
}

.rm-site-nav li {
	position: relative;
	margin: 0;
	list-style: none;
}

.rm-site-nav a {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 0 18px;
	color: var(--rm-color-text);
	font-weight: 900;
	text-decoration: none;
	text-transform: uppercase;
}

.rm-site-nav a:hover,
.rm-site-nav a:focus-visible,
.rm-site-nav .current-menu-item > a {
	background: var(--rm-color-surface-alt);
	box-shadow: inset 0 -5px 0 var(--rm-color-text-soft);
}

.rm-site-nav a:focus-visible {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

.rm-site-nav .sub-menu,
.rm-site-nav .children {
	position: absolute;
	z-index: 20;
	top: 100%;
	left: 0;
	display: none;
	min-width: 280px;
	margin: 0;
	padding: 14px 0;
	list-style: none;
	background: var(--rm-color-surface);
	border: 1px solid var(--rm-color-border);
	border-radius: 0;
	box-shadow: var(--rm-shadow-float);
}

.rm-site-nav li:hover > .sub-menu,
.rm-site-nav li:focus-within > .sub-menu,
.rm-site-nav li:hover > .children,
.rm-site-nav li:focus-within > .children {
	display: block;
}

.rm-site-nav .sub-menu a,
.rm-site-nav .children a {
	display: flex;
	width: 100%;
	min-height: 48px;
	padding: 0 24px;
	white-space: nowrap;
	box-shadow: none;
}

.rm-site-nav .sub-menu a:hover,
.rm-site-nav .sub-menu a:focus-visible,
.rm-site-nav .children a:hover,
.rm-site-nav .children a:focus-visible {
	background: var(--rm-color-surface-alt);
	box-shadow: inset 5px 0 0 var(--rm-color-text-soft);
}

.rm-template,
.rm-events,
.rm-event,
.rm-circuit,
.rm-driver,
.rm-championship,
.rm-championship-gallery,
.rm-season,
.rm-session-list,
.rm-results,
.rm-standings {
	color: var(--rm-color-text);
	background: var(--rm-color-bg);
}

/* Enlaces genéricos heredan el color del contenedor, PERO se excluyen los
   .rm-button: estos definen su propio par de contraste (fondo crema
   --rm-color-text + texto oscuro --rm-color-canvas). Sin el :not(.rm-button),
   esta regla (especificidad 0,0,1,1) ganaba a .rm-button (0,0,1,0) y forzaba
   `color: inherit` (crema) sobre el botón → texto crema sobre fondo crema,
   ilegible (contraste 1:1). Ver .rm-button en ~L2095. */

/* La exclusión del CTA de fila va en las DOS ramas que pueden envolverlo. Con
   el layout `rows` en los archivos de CPT (encargo 08) la fila vive dentro de
   `.rm-template`, y esa rama es más específica (0,2,1) que `.rm-event-row__cta`
   (0,1,0): sin la exclusión el CTA hereda el texto crema sobre su fondo brand y
   cae a ~2.6:1. Medido en /eventos/ antes del arreglo. */

/* Encargo 09: los chips y el enlace de limpiar filtros quedan fuera también.
   Un chip de estado que además es enlace (`a.rm-chip.rm-status-badge--*`,
   0,2,0) perdía contra esta rama (0,3,1) y se pintaba con el texto crema
   heredado sobre su propio relleno de estado: «FINALIZADO» quedaba en 1.9:1.
   La exclusión, y no una regla más específica, es lo que hace que un chip
   enlace y un chip span se vean EXACTAMENTE igual. */
.rm-template a:not(.rm-button):not(.rm-event-row__cta):not(.rm-chip):not(.rm-filters__clear),
.rm-events a:not(.rm-button):not(.rm-event-row__cta):not(.rm-chip):not(.rm-filters__clear),
.rm-championship-gallery a:not(.rm-button),
.rm-event a:not(.rm-button),
.rm-circuit a:not(.rm-button),
.rm-driver a:not(.rm-button),
.rm-championship a:not(.rm-button),
.rm-season a:not(.rm-button),
.rm-results a:not(.rm-button),
.rm-standings a:not(.rm-button) {
	color: inherit;
}

.rm-template a:focus-visible,
.rm-events a:focus-visible,
.rm-championship-gallery a:focus-visible,
.rm-button:focus-visible,
.rm-session-list a:focus-visible {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

.rm-kicker {
	color: var(--rm-color-accent);
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: 0;
	margin: 0 0 0.5rem;
	text-transform: uppercase;
}

.rm-section-header {
	margin: 0 0 1.5rem;
}

.rm-section-header h1,
.rm-section-header h2,
.rm-event-hero h1 {
	color: var(--rm-color-text);
	font-weight: 900;
	letter-spacing: 0;
	line-height: 1;
	margin: 0;
	text-transform: uppercase;
}

.rm-event-hero {
	min-height: 560px;
	position: relative;
	display: grid;
	align-items: end;
	overflow: hidden;
	background: var(--rm-color-bg);
}

.rm-event-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, color-mix(in srgb, var(--rm-scrim) 20%, transparent), color-mix(in srgb, var(--rm-scrim) 96%, transparent));
}

.rm-event-hero__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rm-event-hero__content {
	position: relative;
	z-index: 1;
	width: min(100% - 32px, var(--rm-max-width));
	margin: 0 auto;
	padding: 0 0 72px;
}

.rm-event-hero h1 {
	max-width: 900px;
	font-size: clamp(3rem, 8vw, 6.5rem);
}

.rm-event-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 1.25rem;
	color: var(--rm-color-muted);
	font-weight: 700;
	margin: 1rem 0 0;
}

.rm-event-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 28px;
	width: min(100% - 32px, var(--rm-max-width));
	margin: 0 auto;
	padding: 56px 0;
}

.rm-event-main,
.rm-event-sidebar,
.rm-circuit,
.rm-driver,
.rm-results,
.rm-standings {
	min-width: 0;
}

.rm-content {
	color: var(--rm-color-muted);
	line-height: 1.7;
}

.rm-event-video {
	border-top: 4px solid var(--rm-color-accent);
	margin: 32px 0;
	padding-top: 18px;
}

.rm-event-video iframe,
.rm-event-video video {
	width: 100%;
	max-width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
}

.rm-event-sidebar {

	/* Filete en el color de marca (0.9.5): con --rm-color-accent quedaba un
	   gris que no se leía como parte de la identidad del sitio. */
	border-left: 4px solid var(--rm-color-brand);
	padding-left: 24px;
}

.rm-circuit--summary,
.rm-event-card,
.rm-empty {
	background: var(--rm-color-surface);
	border: 1px solid var(--rm-color-border);
}

.rm-circuit--summary {
	padding: 24px;
}

.rm-circuit--summary h2 {
	font-size: 1rem;
	margin-top: 0;
	text-transform: uppercase;
}

.rm-spec-list {
	margin: 0;
}

.rm-spec-list div {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	border-bottom: 1px solid var(--rm-color-border);
	padding: 12px 0;
}

.rm-spec-list dt {
	color: var(--rm-color-muted);
	font-weight: 700;
	text-transform: uppercase;
}

.rm-spec-list dd {
	margin: 0;
	text-align: right;
	font-weight: 800;
}

.rm-circuit__profile-image,
.rm-circuit__profile img {
	display: block;
	width: 100%;
	height: auto;
	margin-top: 20px;
	border: 1px solid var(--rm-color-border);
}

.rm-session-list {
	background: var(--rm-color-surface);
	padding: 56px max(16px, calc((100vw - var(--rm-max-width)) / 2));
}

.rm-event-main .rm-session-list {
	background: transparent;
	margin-top: 32px;
	padding: 0;
	overflow-x: auto;
}

.rm-event-main .rm-session-list .rm-kicker {
	writing-mode: horizontal-tb;
	text-orientation: mixed;
}

.rm-event-main .rm-session-list table {
	min-width: 560px;
}

.rm-session-list table,
.rm-results table,
.rm-standings table {
	width: 100%;
	border-collapse: collapse;
	color: var(--rm-color-text);
	background: var(--rm-color-bg);
}

.rm-session-list caption,
.rm-results caption,
.rm-standings caption {
	text-align: left;
	margin-bottom: 12px;
	color: var(--rm-color-muted);
}

.rm-session-list th,
.rm-session-list td,
.rm-results th,
.rm-results td,
.rm-standings th,
.rm-standings td {
	border-bottom: 1px solid var(--rm-color-border);
	padding: 18px;
	text-align: left;
	vertical-align: middle;
}

/* El color de la cabecera de tabla se declara UNA sola vez, en la regla de la
   sección "Tablas" (~L2200). Aquí había un `background`/`color` que quedaba
   pisado por esa y por la de más abajo: tres capas para el mismo píxel. */

.rm-session-list tbody th {
	font-size: 1.05rem;
	text-transform: uppercase;
}

.rm-event-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	justify-content: flex-end;
	width: min(100% - 32px, var(--rm-max-width));
	margin: 0 auto;
	padding: 48px 0 64px;
}

.rm-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0.75rem 1.5rem;
	background: var(--rm-color-accent);
	color: var(--rm-color-accent-contrast);
	font-weight: 800;
	text-decoration: none;
	text-transform: uppercase;
	border: 2px solid var(--rm-color-accent);
}

.rm-button--secondary {
	background: transparent;
	border-color: var(--rm-color-text);
}

.rm-events {
	padding: 48px max(16px, calc((100vw - var(--rm-max-width)) / 2));
}

.rm-calendar {
	--rm-calendar-bg: var(--rm-color-canvas);
	--rm-calendar-text: var(--rm-color-text);
	--rm-calendar-muted: var(--rm-color-text-soft);
	--rm-calendar-accent: var(--rm-color-border);
	--rm-calendar-accent-strong: var(--rm-color-surface-alt);
	--rm-calendar-border: var(--rm-color-border);
	--rm-calendar-inverse: var(--rm-color-text);
	width: min(100% - 32px, var(--rm-max-width));
	margin: 0 auto;
	padding: clamp(28px, 4vw, 48px);
	color: var(--rm-calendar-text);
	background: var(--rm-calendar-bg);
	border: 1px solid var(--rm-calendar-border);
	border-radius: 0;
}

.rm-calendar__toolbar {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 1rem;
}

.rm-calendar__button {
	display: inline-grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	color: var(--rm-color-text);
	background: var(--rm-color-canvas);
	border: 2px solid var(--rm-color-text);
	border-radius: 0;
	font: inherit;
	font-size: 1.35rem;
	font-weight: 900;
	line-height: 1;
	cursor: pointer;
}

.rm-calendar__button:hover,
.rm-calendar__button:focus-visible {
	background: var(--rm-calendar-accent);
	border-color: var(--rm-calendar-accent);
	color: var(--rm-calendar-inverse);
	outline: 3px solid var(--rm-color-text);
	outline-offset: 3px;
}

.rm-calendar__button:disabled {
	color: var(--rm-color-text-soft);
	background: var(--rm-color-surface);
	border-color: var(--rm-color-border);
	cursor: not-allowed;
	opacity: 0.72;
}

.rm-calendar__button:disabled:hover,
.rm-calendar__button:disabled:focus-visible {
	color: var(--rm-color-text-soft);
	background: var(--rm-color-surface);
	border-color: var(--rm-color-border);
	outline: none;
}

.rm-calendar__chevron {
	display: block;
	width: 0.85rem;
	height: 0.85rem;
	border-top: 0.22rem solid currentcolor;
	border-right: 0.22rem solid currentcolor;
}

.rm-calendar__chevron--up {
	transform: translateY(0.18rem) rotate(-45deg);
}

.rm-calendar__chevron--down {
	transform: translateY(-0.18rem) rotate(135deg);
}

.rm-calendar__chevron--right {
	transform: translateX(-0.12rem) rotate(45deg);
}

.rm-calendar__list {
	display: grid;
	gap: var(--rm-gap, calc(1rem + 5px));
	max-height: min(72vh, 46rem);
	overflow-y: auto;
	padding-right: 0.35rem;
	scroll-snap-type: y proximity;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.rm-calendar__list::-webkit-scrollbar {
	display: none;
}

.rm-events > .rm-empty,
.rm-calendar > .rm-empty {
	display: block;
	width: 100%;
	max-width: none;
	writing-mode: horizontal-tb;
	text-orientation: mixed;
}

.rm-calendar a:focus-visible {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

.rm-calendar-event {
	display: grid;
	grid-template-columns: minmax(5.5rem, 7.75rem) minmax(11rem, 22rem) minmax(0, 1fr) minmax(3.75rem, 5rem);
	gap: 0;
	align-items: stretch;
	min-width: 0;
	min-height: clamp(11rem, 16vw, 13.75rem);
	padding: 0;
	color: var(--rm-calendar-inverse);
	background: var(--rm-color-surface);
	border: 0;
	border-left: 4px solid var(--rm-calendar-accent);
	border-radius: 0;
	scroll-snap-align: start;
}

.rm-calendar-event:nth-child(even) {
	background: var(--rm-calendar-accent);
}

.rm-calendar-event__media {
	display: grid;
	place-items: center;
	overflow: hidden;
	min-height: 100%;
	color: var(--rm-calendar-inverse);
	background: color-mix(in srgb, var(--rm-calendar-accent-strong) 72%, var(--rm-shade));
	border-radius: 0;
	text-decoration: none;
}

.rm-calendar-event__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rm-calendar-event__date {
	display: grid;
	place-content: center;
	justify-items: center;
	min-width: 0;
	padding: clamp(1rem, 2vw, 1.6rem) 0.75rem;
	color: var(--rm-calendar-inverse);
	background: var(--rm-color-canvas);
	font-weight: 900;
	line-height: 1;
	text-transform: uppercase;
}

.rm-calendar-event:nth-child(even) .rm-calendar-event__date {
	color: var(--rm-color-text);
	background: var(--rm-color-surface);
}

.rm-calendar-event__date span {
	font-size: clamp(0.85rem, 1.4vw, 1rem);
}

.rm-calendar-event__date strong {
	font-size: clamp(3rem, 5vw, 4.75rem);
}

.rm-calendar-event__body {
	display: grid;
	align-content: center;
	gap: 0.65rem;
	min-width: 0;
	padding: clamp(1.2rem, 3vw, 2.4rem);
}

.rm-calendar-event__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0;
}

.rm-calendar-event__chips span {
	display: inline-flex;
	align-items: center;
	min-height: 1.9rem;
	padding: 0.2rem 0.8rem;
	color: var(--rm-calendar-inverse);
	background: color-mix(in srgb, var(--rm-color-canvas) 82%, var(--rm-calendar-accent));
	border-radius: 0;
	font-size: 0.82rem;
	font-weight: 800;
	text-transform: uppercase;
}

.rm-calendar-event__title {
	margin: 0;
	color: var(--rm-calendar-inverse);
	font-size: clamp(1.6rem, 3.1vw, 2.85rem);
	font-weight: 900;
	line-height: 1.05;
	text-transform: uppercase;
}

.rm-calendar-event__title a {
	color: inherit;
	text-decoration: none;
}

.rm-calendar-event__title a:hover,
.rm-calendar-event__title a:focus-visible {
	text-decoration: underline;
	text-decoration-thickness: 0.14em;
	text-underline-offset: 0.18em;
}

.rm-calendar-event__meta {
	display: block;
	margin: 0;
	color: var(--rm-calendar-inverse);
	font-weight: 700;
}

.rm-calendar-event__meta div {
	display: block;
	min-width: 0;
}

.rm-calendar-event__meta dt {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.rm-calendar-event__meta dd {
	margin: 0;
	overflow-wrap: anywhere;
}

.rm-calendar-event__cta {
	display: grid;
	place-items: center;
	min-width: 0;
	color: var(--rm-calendar-inverse);
	background: color-mix(in srgb, var(--rm-color-canvas) 36%, transparent);
	border-left: 1px solid color-mix(in srgb, var(--rm-calendar-inverse) 10%, transparent);
	font-size: clamp(1.4rem, 2.4vw, 2rem);
	font-weight: 900;
	text-decoration: none;
}

.rm-calendar-event__cta .rm-calendar__chevron {
	width: 1rem;
	height: 1rem;
}

.rm-calendar-event__cta:hover,
.rm-calendar-event__cta:focus-visible {
	color: var(--rm-calendar-accent);
	background: var(--rm-calendar-inverse);
}

.rm-calendar-event__excerpt {
	max-width: 60rem;
	margin: 0;
	color: var(--rm-calendar-inverse);
	opacity: 0.9;
}

.rm-events__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 20px;
}

.rm-championship-gallery {
	width: min(100% - 32px, var(--rm-max-width));
	margin: 0 auto;
	padding: 56px 0;
}

.rm-championship-gallery__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--rm-gap, 24px);
}

.rm-championship-card {
	display: grid;
	align-content: start;
	min-height: 100%;
	border: 1px solid var(--rm-color-border);
	background: var(--rm-color-surface);
}

.rm-championship-card__media {
	display: block;
	padding: 16px 16px 0;
	text-decoration: none;
}

.rm-championship-card__image {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.rm-championship-card__media span {
	display: grid;
	place-items: center;
	aspect-ratio: 16 / 9;
	color: var(--rm-color-muted);
	background: var(--rm-color-surface);
}

.rm-championship-card__body {
	display: grid;
	gap: 18px;
	align-content: start;
	padding: 20px;
}

.rm-championship-card__title {
	margin: 0;
	font-size: clamp(1.1rem, 1.5vw, 1.45rem);
	line-height: 1.1;
	text-transform: uppercase;
}

.rm-championship-card__title a {
	text-decoration: none;
}

.rm-championship-card__excerpt {
	margin: 0;
	color: var(--rm-color-muted);
	line-height: 1.55;
}

.rm-championship-card__link {
	justify-self: start;
}

.rm-event-card {
	display: grid;
	min-height: 100%;
}

.rm-event-card__media {
	display: block;
	overflow: hidden;
}

.rm-event-card__image {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.rm-event-card__body {
	padding: 20px;
}

.rm-event-card__title {
	margin: 0;
	font-size: 1.4rem;
	text-transform: uppercase;
}

.rm-event-card__title a {
	text-decoration: none;
}

.rm-event-card__meta {
	display: grid;
	gap: 6px;
	color: var(--rm-color-muted);
}

.rm-circuit:not(.rm-circuit--summary):not(.rm-circuit--single),
.rm-driver:not(.rm-driver--single),
.rm-results,
.rm-standings {
	width: min(100% - 32px, var(--rm-max-width));
	margin: 0 auto;
	padding: 56px 0;
}

.rm-circuit--single,
.rm-driver--single,
.rm-championship--single,
.rm-season--single {
	width: auto;
	margin: 0;
	padding: 0;
}

.rm-entity-main {
	width: min(100% - 32px, var(--rm-max-width));
	margin: 0 auto;
	padding: 56px 0;
}

/* REC-3: el h2 "Eventos del campeonato" en mayúsculas, coherente con la
   identidad Endurance (resto de encabezados van uppercase). */
.rm-championship--single .rm-entity-main h2 {
	text-transform: uppercase;
}

.rm-events--embedded {
	padding-left: 0;
	padding-right: 0;
}

.rm-circuit__image,
.rm-driver__image {
	width: 100%;
	max-height: 520px;
	object-fit: cover;
	margin-bottom: 28px;
}

.rm-empty {
	color: var(--rm-color-muted);
	padding: 20px;
}

@media (prefers-reduced-motion: reduce) {

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

@media (max-width: 780px) {

	.rm-site-header__inner {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.rm-site-nav {
		justify-content: flex-start;
		overflow-x: auto;
	}

	.rm-site-nav > .rm-site-nav__list,
	.rm-site-nav > .menu,
	.rm-site-nav .rm-site-nav__list > ul {
		justify-content: flex-start;
		flex-wrap: nowrap;
	}

	.rm-site-nav .sub-menu,
	.rm-site-nav .children {
		position: static;
		min-width: 220px;
		box-shadow: none;
	}

	.rm-event-hero {
		min-height: 440px;
	}

	.rm-event-layout {
		grid-template-columns: 1fr;
	}

	.rm-event-sidebar {
		border-left: 0;
		border-top: 4px solid var(--rm-color-brand);
		padding-left: 0;
		padding-top: 24px;
	}

	.rm-session-list {
		overflow-x: auto;
	}

	.rm-event-actions {
		justify-content: stretch;
	}

	.rm-button {
		width: 100%;
	}

	.rm-calendar {
		width: min(100% - 20px, var(--rm-max-width));
		padding: 1rem;
	}

	.rm-calendar-event {
		grid-template-columns: minmax(4.8rem, 6rem) minmax(0, 1fr) minmax(3.25rem, 4rem);
	}

	.rm-calendar-event__media {
		display: none;
	}

	.rm-calendar-event__date {
		align-self: stretch;
	}

	.rm-calendar-event__body {
		grid-column: 2;
	}

	.rm-calendar-event__cta {
		grid-column: 3;
	}
}

@media (max-width: 520px) {

	.rm-calendar-event {
		grid-template-columns: 1fr;
	}

	.rm-calendar-event__date,
	.rm-calendar-event__body,
	.rm-calendar-event__cta {
		grid-column: auto;
	}

	.rm-calendar-event__media {
		display: grid;
		min-height: 12rem;
	}

	.rm-calendar-event__date {
		justify-items: start;
	}

	.rm-calendar-event__cta {
		min-height: 3.25rem;
		border-top: 1px solid color-mix(in srgb, var(--rm-calendar-inverse) 12%, transparent);
		border-left: 0;
	}
}

/* Racing visual system and resilient boxed layout */
.rm-template *,
.rm-template *::before,
.rm-template *::after,
.rm-site-header *,
.rm-site-header *::before,
.rm-site-header *::after {
	box-sizing: border-box;
}

/* stylelint-disable */
:root,
.editor-styles-wrapper {
	--rm-page-gutter: clamp(18px, 4vw, 64px);
	--rm-card-radius: 0;
	--rm-shadow-hard: 0 4px 16px rgb(var(--rm-shadow-color) / 50%);
}

.rm-template,
.rm-site-header {
	font-family: var(--rm-font-body);
}

/* Numerales tabulares en todos los contextos numéricos (DESIGN.md 3.3) */
.rm-template time,
.rm-calendar-event__date,
.rm-event-card__date,
.rm-session-list td,
.rm-session-list th,
.rm-results td,
.rm-results th,
.rm-standings td,
.rm-standings th,
.rm-circuit-card__specs dd,
.rm-spec-list dd {
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

.rm-site-header {
	position: relative;
	z-index: 30;
	border-bottom-color: var(--rm-color-border);
}

.rm-site-header__inner {
	grid-template-columns: minmax(150px, 240px) minmax(0, 1fr);
	min-height: 78px;
	width: min(100% - var(--rm-page-gutter), 1720px);
	padding: 14px 0;
}

.rm-site-title {
	color: var(--rm-color-text-soft);
	font-size: clamp(1.35rem, 2vw, 2rem);
	text-shadow: var(--rm-text-shadow-title);
}

.rm-site-description {
	max-width: 28ch;
	color: var(--rm-color-text-soft);
}

.rm-site-nav a {
	min-height: 42px;
	padding: 0 12px;
	font-size: 0.86rem;
	letter-spacing: 0.06em;
}

.rm-event-hero {
	min-height: clamp(460px, 62vw, 760px);
	isolation: isolate;
	background-position: center;
	background-size: cover;
}

.rm-event-hero--has-image {
	background-color: var(--rm-color-canvas);
}

.rm-event-hero--no-image {
	background-color: var(--rm-color-canvas);
	background-image: var(--rm-grid-texture);
	background-size: var(--rm-grid-texture-size);
}

.rm-event-hero::after {
	z-index: 1;
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--rm-scrim) 90%, transparent), color-mix(in srgb, var(--rm-scrim) 28%, transparent) 45%, color-mix(in srgb, var(--rm-scrim) 82%, transparent)),
		linear-gradient(180deg, color-mix(in srgb, var(--rm-scrim) 18%, transparent), color-mix(in srgb, var(--rm-scrim) 98%, transparent) 88%);
}

.rm-event-hero__image {
	z-index: 0;
	object-position: center;
	filter: saturate(0.9) contrast(1.08);
}

.rm-event-hero--has-image .rm-event-hero__image {
	opacity: 1;
}

.rm-event-hero__content {
	z-index: 2;
}

.rm-event-hero__content,
.rm-event-layout,
.rm-event-actions,
.rm-entity-main,
.rm-circuit:not(.rm-circuit--summary):not(.rm-circuit--single),
.rm-driver:not(.rm-driver--single),
.rm-results,
.rm-standings {
	width: min(100% - var(--rm-page-gutter), var(--rm-max-width));
}

.rm-event-hero__content {
	padding-bottom: clamp(48px, 8vw, 112px);
}

.rm-kicker {
	display: inline-flex;
	width: fit-content;
	padding: 0.35rem 0.55rem;
	color: var(--rm-color-text);
	background: var(--rm-color-accent);
	font-size: 0.76rem;
	line-height: 1;
}

/* Las dos reglas que pintaban estas etiquetas como rectangulos rellenos se
   retiraron en 0.9.3: la cabecera usa ya el chip canonico `.rm-chip`, y
   `.rm-event-hero__chips` no tiene ningun otro consumidor. */

.rm-section-header .rm-kicker,
.rm-event-main .rm-session-list .rm-kicker {
	padding-left: 0;
	color: var(--rm-color-text-soft);
	background: transparent;
}

.rm-section-header h1,
.rm-section-header h2,
.rm-event-hero h1 {
	max-width: 12ch;
	text-wrap: balance;
	text-shadow: var(--rm-text-shadow-strong);
}

.rm-event-meta {
	align-items: center;
	color: var(--rm-color-text);
	font-size: 0.92rem;
	text-transform: uppercase;
}

.rm-event-layout {
	grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
	gap: clamp(24px, 4vw, 52px);
	padding: clamp(48px, 7vw, 88px) 0;
}

.rm-event--single .rm-event-layout,
.rm-event--single .rm-event-actions {
	width: min(100% - var(--rm-page-gutter), var(--flavor-wide-width, 1500px));
}

.rm-event--single .rm-event-layout {
	grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
	gap: clamp(20px, 3vw, 40px);
}

.rm-event-main > .rm-content {
	columns: 2 260px;
	column-gap: clamp(24px, 4vw, 48px);
}

.rm-content {
	color: var(--rm-color-text);
	font-size: 1rem;
}

.rm-content > :first-child {
	margin-top: 0;
}

.rm-event-video {
	margin: clamp(28px, 5vw, 56px) 0;
	padding-top: 0;
	border-top: 0;
}

.rm-event-video h2 {
	color: var(--rm-color-text-soft);
	font-size: 0.9rem;
	text-transform: uppercase;
}

.rm-event-video__frame {
	overflow: hidden;
	background: var(--rm-color-canvas);
	border: 1px solid var(--rm-color-border);
	border-bottom: 4px solid var(--rm-color-accent);
}

.rm-event-video__frame > iframe,
.rm-event-video__frame > video,
.rm-event-video__frame .wp-video,
.rm-event-video__frame .wp-video video {
	display: block;
	width: 100% !important;
	max-width: none;
	aspect-ratio: 16 / 9;
}

.rm-event-sidebar {
	align-self: start;
	padding-left: 0;
	border-left: 0;
}

.rm-circuit--summary,
.rm-event-card,
.rm-empty {
	background: var(--rm-color-surface);
	border-color: var(--rm-color-border);
	border-radius: var(--rm-card-radius);
}

.rm-circuit--summary {
	/* Filete en el color de marca (0.9.5). Estaba en `--rm-color-accent`, que en
	   este plugin es un ALIAS de `--rm-color-border` (ver L113): de ahí que se
	   viera gris. Es el borde que realmente se dibuja en el panel lateral; el
	   `border-left` de `.rm-event-sidebar` lo anula una regla posterior. */
	border-left: 4px solid var(--rm-color-brand);
	padding: clamp(20px, 3vw, 32px);
}

.rm-spec-list div {
	align-items: baseline;
	min-width: 0;
}

.rm-spec-list dt,
.rm-spec-list dd {
	overflow-wrap: anywhere;
}

.rm-circuit__profile,
.rm-circuit__profile-image {
	overflow: hidden;
	margin: 22px 0 0;
	background: var(--rm-color-canvas);
}

.rm-circuit__profile img,
.rm-circuit__profile-image {
	aspect-ratio: 1 / 1;
	object-fit: contain;
	padding: 14px;
}

.rm-session-list {
	padding: clamp(48px, 7vw, 84px) max(var(--rm-page-gutter), calc((100vw - var(--rm-max-width)) / 2));
}

.rm-event-main .rm-session-list {
	border-top: 1px solid var(--rm-color-border);
	padding-top: clamp(34px, 5vw, 56px);
}

.rm-session-list table,
.rm-results table,
.rm-standings table {
	table-layout: fixed;
	border: 1px solid var(--rm-color-border);
}

.rm-event--single .rm-event-main .rm-session-list {
	overflow-x: auto;
}

.rm-event--single .rm-event-main .rm-session-list table {
	min-width: 860px;
	table-layout: auto;
}

.rm-event--single .rm-event-main .rm-session-list .rm-section-header h2 {
	max-width: none;
	white-space: nowrap;
}

.rm-event--single .rm-event-main .rm-session-list th,
.rm-event--single .rm-event-main .rm-session-list td {
	overflow-wrap: normal;
	word-break: normal;
}

.rm-event--single .rm-event-main .rm-session-list thead th,
.rm-event--single .rm-event-main .rm-session-list td:nth-child(1),
.rm-event--single .rm-event-main .rm-session-list td:nth-child(4),
.rm-event--single .rm-event-main .rm-session-list td:nth-child(5) {
	white-space: nowrap;
}

.rm-event--single .rm-event-main .rm-session-list thead th:nth-child(1),
.rm-event--single .rm-event-main .rm-session-list tbody td:nth-child(1) {
	width: 13%;
}

.rm-event--single .rm-event-main .rm-session-list thead th:nth-child(2),
.rm-event--single .rm-event-main .rm-session-list tbody td:nth-child(2) {
	width: 18%;
}

.rm-event--single .rm-event-main .rm-session-list thead th:nth-child(3),
.rm-event--single .rm-event-main .rm-session-list tbody th[scope="row"] {
	width: 34%;
}

.rm-event--single .rm-event-main .rm-session-list thead th:nth-child(4),
.rm-event--single .rm-event-main .rm-session-list tbody td:nth-child(4) {
	width: 15%;
}

.rm-event--single .rm-event-main .rm-session-list thead th:nth-child(5),
.rm-event--single .rm-event-main .rm-session-list tbody td:nth-child(5) {
	width: 12%;
}

.rm-session-list th,
.rm-session-list td,
.rm-results th,
.rm-results td,
.rm-standings th,
.rm-standings td {
	overflow-wrap: anywhere;
}

.rm-session-list thead th,
.rm-results thead th,
.rm-standings thead th {
	/* El `background` vivía también aquí; ver la nota de la sección "Tablas". */
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.rm-session-list tbody tr:nth-child(even),
.rm-results tbody tr:nth-child(even),
.rm-standings tbody tr:nth-child(even) {
	background: var(--rm-color-surface-alt);
}

.rm-event-actions {
	align-items: center;
	border-top: 1px solid var(--rm-color-border);
}

.rm-button {
	min-width: min(100%, 220px);
	box-shadow: var(--rm-shadow-button);
}

.rm-button:hover,
.rm-button:focus-visible {
	background: var(--rm-color-text-soft);
	border-color: var(--rm-color-text-soft);
	color: var(--rm-color-canvas);
}

.rm-events {
	padding: clamp(48px, 7vw, 84px) max(var(--rm-page-gutter), calc((100vw - var(--rm-max-width)) / 2));
}

/*
 * Caja de las plantillas de archivo (encargo 08). Las páginas compuestas meten
 * las secciones dentro de un contenedor Vulcano que las limita al ancho del
 * sitio; una plantilla clásica no tiene ese contenedor, así que la sección se
 * comía toda la ventana y las tarjetas llegaban al borde. Mismo ancho máximo y
 * mismo canalón que el resto del sitio.
 */
.rm-template__shell {
	width: min(100% - (2 * var(--rm-page-gutter)), var(--rm-max-width));
	margin-inline: auto;
}

/*
 * Sección a ancho de contenedor cuando el bloque cuelga DIRECTAMENTE del
 * contenedor de contenido.
 *
 * NO usar aquí el par `margin-left: 50%` + `transform: translateX(-50%)` ni la
 * ruptura por márgenes negativos: los contenedores de bloques ganan las dos
 * veces y solo sobrevive el transform.
 *   - WordPress core: `.is-layout-constrained > :where(:not(.alignfull)...)`
 *     impone `margin-inline: auto !important`.
 *   - Andromeda 1.4.x: `.dd-content-shell--full-width > .entry-content > *`
 *     reescribe además el `width`, y llega la última en la cascada.
 * Resultado del par roto: márgenes a auto, transform huérfano y la sección
 * desplazada media anchura a la izquierda (medido: x=-688 a 1440px). Los
 * márgenes automáticos sí sobreviven al !important, así que se centra con ellos.
 */
.is-layout-constrained > .rm-events,
.is-layout-constrained > .rm-calendar,
.wp-block-post-content > .rm-events,
.wp-block-post-content > .rm-calendar {
	width: min(100% - 32px, var(--rm-max-width));
	max-width: none;
	margin-left: auto;
	margin-right: auto;
	transform: none;
}

.rm-events--gallery {
	background:
		linear-gradient(180deg, color-mix(in srgb, var(--rm-color-text) 2%, transparent), transparent 220px),
		var(--rm-color-canvas);
}

.rm-events--gallery > .rm-section-header {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 20px;
	align-items: end;
	max-width: var(--rm-max-width);
}

.rm-events--gallery > .rm-section-header::after {
	content: "";
	width: min(28vw, 180px);
	height: 6px;
	background: var(--rm-color-accent);
}

.rm-events--gallery > .rm-section-header h2 {
	font-size: clamp(2.3rem, 6vw, 5.6rem);
}

.rm-events__grid {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
	gap: var(--rm-gap, clamp(20px, 3vw, 32px));
}

.rm-event-card {
	grid-template-rows: auto 1fr;
	min-width: 0;
	position: relative;
	overflow: hidden;
	border-top: 4px solid var(--rm-color-accent);
	transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.rm-event-card:hover,
.rm-event-card:focus-within {
	transform: translateY(-4px);
	border-color: var(--rm-color-text-soft);
	box-shadow: var(--rm-shadow-hard);
}

.rm-event-card__media {
	display: grid;
	position: relative;
	min-height: 0;
	overflow: hidden;
	background: var(--rm-color-canvas);
}

.rm-event-card__image {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 230px;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	filter: saturate(0.82) contrast(1.12);
	transition: transform 260ms ease, filter 260ms ease;
}

.rm-event-card:hover .rm-event-card__image,
.rm-event-card:focus-within .rm-event-card__image {
	transform: scale(1.045);
	filter: saturate(1) contrast(1.16);
}

.rm-event-card__media--empty {
	place-items: center;
	min-height: 230px;
	aspect-ratio: 16 / 10;
	color: var(--rm-color-text-soft);
	text-decoration: none;
	text-transform: uppercase;
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--rm-shade) 22%, transparent), transparent 48%),
		var(--rm-color-surface);
}

.rm-event-card__date {
	position: absolute;
	left: 18px;
	bottom: 18px;
	display: grid;
	place-items: center;
	min-width: 74px;
	min-height: 74px;
	padding: 8px;
	color: var(--rm-color-canvas);
	background: var(--rm-color-text-soft);
	border-left: 6px solid var(--rm-color-accent);
	text-align: center;
	text-transform: uppercase;
	box-shadow: var(--rm-shadow-card);
}

.rm-event-card__date span {
	font-size: 0.78rem;
	font-weight: 900;
	line-height: 1;
}

.rm-event-card__date strong {
	font-size: 2rem;
	line-height: 0.95;
}

.rm-event-card__body {
	display: grid;
	gap: 14px;
	align-content: start;
	min-width: 0;
	padding: clamp(20px, 3vw, 28px);
}

.rm-event-card__title {
	font-size: clamp(1.25rem, 2vw, 1.7rem);
	line-height: 1.05;
	text-shadow: var(--rm-text-shadow-card);
}

.rm-event-card__title a {
	display: inline;
	background-image: linear-gradient(var(--rm-color-text-soft), var(--rm-color-text-soft));
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 0 2px;
	transition: background-size 180ms ease;
}

.rm-event-card__title a:hover,
.rm-event-card__title a:focus-visible {
	background-size: 100% 2px;
}

.rm-event-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	margin: 0;
	color: var(--rm-color-text);
	font-size: 0.84rem;
	font-weight: 800;
	overflow-wrap: anywhere;
	text-transform: uppercase;
}

.rm-event-card__meta span,
.rm-event-card__meta time {
	display: inline-flex;
	align-items: center;
}

.rm-event-card__meta span::before {
	content: "";
	width: 6px;
	height: 6px;
	margin-right: 8px;
	background: var(--rm-color-accent);
}

.rm-event-card__link {
	justify-self: start;
	margin-top: 4px;
	color: var(--rm-color-text-soft);
	font-size: 0.82rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-decoration: none;
	text-transform: uppercase;
}

.rm-event-card__link::after {
	content: " ->";
}

.rm-event-card__link:hover,
.rm-event-card__link:focus-visible {
	color: var(--rm-color-text);
}

.rm-circuit__image,
.rm-driver__image {
	display: block;
	aspect-ratio: 16 / 7;
	max-height: none;
	background: var(--rm-color-canvas);
}

.rm-entity-main {
	display: grid;
	gap: clamp(24px, 4vw, 48px);
}

@media (max-width: 980px) {

	.rm-site-header__inner {
		grid-template-columns: 1fr;
		gap: 14px;
	}

	.rm-site-nav {
		justify-content: flex-start;
		overflow-x: auto;
		scrollbar-width: thin;
	}

	.rm-site-nav > .rm-site-nav__list,
	.rm-site-nav > .menu,
	.rm-site-nav .rm-site-nav__list > ul {
		flex-wrap: nowrap;
		justify-content: flex-start;
		width: max-content;
	}

	.rm-event-layout {
		grid-template-columns: 1fr;
	}

	.rm-event-sidebar {
		border-top: 4px solid var(--rm-color-brand);
		padding-top: 24px;
	}
}

@media (max-width: 640px) {

	.rm-event-hero {
		min-height: 390px;
	}

	.rm-event-hero h1 {
		max-width: 10ch;
		font-size: clamp(2.55rem, 15vw, 4rem);
	}

	.rm-event-meta {
		font-size: 0.84rem;
	}

	.rm-event-main > .rm-content {
		columns: auto;
	}

	.rm-session-list table,
	.rm-results table,
	.rm-standings table {
		min-width: 640px;
		table-layout: auto;
	}

	.rm-session-list,
	.rm-results,
	.rm-standings {
		overflow-x: auto;
	}

	.rm-site-nav a {
		padding: 0 10px;
	}
}

/* Upcoming events block: reference layout */
.rm-events--gallery {
	padding-top: clamp(58px, 7vw, 96px);
	padding-bottom: clamp(58px, 7vw, 96px);
}

.rm-events--gallery .rm-events__header {
	display: flex;
	gap: 24px;
	align-items: center;
	justify-content: space-between;
	max-width: none;
	margin-bottom: clamp(42px, 5vw, 72px);
	padding-bottom: 32px;
	border-bottom: 1px solid var(--rm-color-border);
}

.rm-events--gallery .rm-events__header::after {
	content: none;
}

.rm-events--gallery .rm-events__header h2 {
	max-width: none;
	margin: 0;
	font-size: clamp(3rem, 5.5vw, 6rem);
	line-height: 0.95;
	color: var(--rm-color-text);
}

.rm-events__calendar-link {
	display: inline-flex;
	gap: 16px;
	align-items: center;
	color: var(--rm-color-text-soft);
	font-size: clamp(1rem, 1.35vw, 1.55rem);
	font-weight: 900;
	letter-spacing: 0.08em;
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
}

.rm-events__calendar-link span {
	font-size: 1.8em;
	line-height: 1;
}

.rm-events__calendar-link:hover,
.rm-events__calendar-link:focus-visible {
	color: var(--rm-color-text);
}

.rm-events--gallery .rm-events__grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(28px, 3vw, 42px);
}

.rm-championship-list .rm-events__grid {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}

.rm-championship-event-card__body {
	align-content: start;
}

.rm-championship-event-card__excerpt {
	margin: 0;
	color: var(--rm-color-text);
	font-size: clamp(0.95rem, 1vw, 1.05rem);
	line-height: 1.45;
}

.rm-championship-event-card__link {
	align-self: end;
	justify-self: start;
	margin-top: auto;
}

.rm-events--gallery .rm-event-card {
	display: grid;
	grid-template-rows: auto 1fr;
	min-height: 100%;
	background: var(--rm-color-surface);
	border: 0;
	box-shadow: none;
	transform: none;
}

.rm-events--gallery .rm-event-card:hover,
.rm-events--gallery .rm-event-card:focus-within {
	transform: none;
	box-shadow: none;
}

.rm-events--gallery .rm-event-card__media {
	min-height: 0;
}

.rm-events--gallery .rm-event-card__image,
.rm-events--gallery .rm-event-card__media--empty {
	min-height: 0;
	aspect-ratio: 16 / 8.3;
}

.rm-events--gallery .rm-event-card__image {
	object-fit: cover;
	filter: saturate(0.95) contrast(1.05);
}

.rm-events--gallery .rm-event-card__body {
	gap: 16px;
	padding: clamp(28px, 3vw, 40px);
}

.rm-events--gallery .rm-event-card__round {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 6px 14px;
	align-items: start;
	margin: 0;
	color: var(--rm-color-text-soft);
	font-size: clamp(0.72rem, 0.84vw, 0.9rem);
	font-weight: 900;
	letter-spacing: 0.06em;
	line-height: 1.1;
	text-transform: uppercase;
}

.rm-events--gallery .rm-event-card__round span + span::before {
	content: none;
	margin-right: 0;
}

.rm-events--gallery .rm-event-card__event-name {
	min-width: 0;
	overflow-wrap: anywhere;
}

.rm-events--gallery .rm-event-card__date-line {
	display: inline-flex;
	gap: 0.45rem;
	align-items: center;
	justify-self: end;
	white-space: nowrap;
}

.rm-events--gallery .rm-event-card__date-line i,
.rm-events--gallery .rm-event-card__meta i {
	display: inline-block;
	flex: 0 0 auto;
	width: 1em;
	height: 1em;
	color: currentColor;
	background: currentColor;
	font-style: normal;
	line-height: 1;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.rm-events--gallery .fa-calendar {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M152 64h144V24c0-13.3 10.7-24 24-24s24 10.7 24 24v40h40c35.3 0 64 28.7 64 64v320c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V128c0-35.3 28.7-64 64-64h40V24c0-13.3 10.7-24 24-24s24 10.7 24 24v40zM48 192v256c0 8.8 7.2 16 16 16h320c8.8 0 16-7.2 16-16V192H48z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M152 64h144V24c0-13.3 10.7-24 24-24s24 10.7 24 24v40h40c35.3 0 64 28.7 64 64v320c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V128c0-35.3 28.7-64 64-64h40V24c0-13.3 10.7-24 24-24s24 10.7 24 24v40zM48 192v256c0 8.8 7.2 16 16 16h320c8.8 0 16-7.2 16-16V192H48z'/%3E%3C/svg%3E");
}

.rm-events--gallery .fa-location-dot {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 256a64 64 0 1 1 0-128a64 64 0 1 1 0 128z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 256a64 64 0 1 1 0-128a64 64 0 1 1 0 128z'/%3E%3C/svg%3E");
}

.rm-events--gallery .fa-stopwatch {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M176 0h96c17.7 0 32 14.3 32 32s-14.3 32-32 32h-16v34.4c37.5 6.6 71.3 23.8 98.2 48.5l24.9-24.9c12.5-12.5 32.8-12.5 45.3 0s12.5 32.8 0 45.3l-25.7 25.7C420.2 224.8 432 263.2 432 304c0 114.9-93.1 208-208 208S16 418.9 16 304C16 198 95.2 110.5 198 97.6V64h-22c-17.7 0-32-14.3-32-32s14.3-32 32-32zm48 448a144 144 0 1 0 0-288a144 144 0 1 0 0 288zm32-232v88c0 8.5-3.4 16.6-9.4 22.6l-48 48c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l38.6-38.6V216c0-17.7 14.3-32 32-32s32 14.3 32 32z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M176 0h96c17.7 0 32 14.3 32 32s-14.3 32-32 32h-16v34.4c37.5 6.6 71.3 23.8 98.2 48.5l24.9-24.9c12.5-12.5 32.8-12.5 45.3 0s12.5 32.8 0 45.3l-25.7 25.7C420.2 224.8 432 263.2 432 304c0 114.9-93.1 208-208 208S16 418.9 16 304C16 198 95.2 110.5 198 97.6V64h-22c-17.7 0-32-14.3-32-32s14.3-32 32-32zm48 448a144 144 0 1 0 0-288a144 144 0 1 0 0 288zm32-232v88c0 8.5-3.4 16.6-9.4 22.6l-48 48c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l38.6-38.6V216c0-17.7 14.3-32 32-32s32 14.3 32 32z'/%3E%3C/svg%3E");
}

.rm-events--gallery .fa-flag-checkered {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M32 0C49.7 0 64 14.3 64 32v16l64-16l128 32l128-32c20.2-5.1 40 10.2 40 31v256c0 14.7-10 27.5-24.2 31l-143.8 36l-128-32l-64 16v110c0 17.7-14.3 32-32 32S0 497.7 0 480V32C0 14.3 14.3 0 32 0zm32 113.5v192l64-16v-192l-64 16zm192 32v192l96-24v-192l-96 24zm-64 176v-192l-64-16v192l64 16z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M32 0C49.7 0 64 14.3 64 32v16l64-16l128 32l128-32c20.2-5.1 40 10.2 40 31v256c0 14.7-10 27.5-24.2 31l-143.8 36l-128-32l-64 16v110c0 17.7-14.3 32-32 32S0 497.7 0 480V32C0 14.3 14.3 0 32 0zm32 113.5v192l64-16v-192l-64 16zm192 32v192l96-24v-192l-96 24zm-64 176v-192l-64-16v192l64 16z'/%3E%3C/svg%3E");
}

.rm-events--gallery .rm-event-card__title {
	margin: 0;
	font-size: clamp(1.45rem, 2.15vw, 2.45rem);
	line-height: 0.95;
}

.rm-events--gallery .rm-event-card__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	margin: 0;
}

.rm-events--gallery .rm-event-card__chips span {
	display: inline-flex;
	align-items: center;
	min-height: 1.55rem;
	padding: 0.18rem 0.62rem;
	color: var(--rm-color-text);
	background: var(--rm-color-surface-alt);
	border-radius: 0;
	font-size: clamp(0.68rem, 0.78vw, 0.82rem);
	font-weight: 900;
	letter-spacing: 0;
	line-height: 1;
	text-transform: uppercase;
}

.rm-events--gallery .rm-event-card__title a {
	color: var(--rm-color-text);
	text-decoration: none;
	background: none;
}

.rm-events--gallery .rm-event-card__meta {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 10px 16px;
	margin-top: 8px;
	color: var(--rm-color-text-soft);
	font-size: clamp(0.72rem, 0.84vw, 0.9rem);
	line-height: 1.1;
}

.rm-events--gallery .rm-event-card__meta span::before {
	content: none;
}

.rm-events--gallery .rm-event-card__meta-location,
.rm-events--gallery .rm-event-card__meta-session {
	display: inline-flex;
	gap: 0.45rem;
	align-items: center;
}

.rm-events--gallery .rm-event-card__meta-location {
	min-width: 0;
	overflow-wrap: anywhere;
}

.rm-events--gallery .rm-event-card__meta-sessions {
	display: inline-flex;
	gap: 0.55rem;
	align-items: center;
	justify-self: end;
	min-width: 1.4em;
}

.rm-events--gallery .rm-event-card__meta-separator {
	color: var(--rm-color-text-soft);
	font-weight: 900;
}

.rm-events--gallery .rm-event-card__meta-separator::before {
	content: none;
}

.rm-events--gallery .rm-event-card__live {
	position: absolute;
	top: clamp(16px, 2vw, 28px);
	left: clamp(16px, 2vw, 28px);
	display: inline-flex;
	gap: 12px;
	align-items: center;
	min-height: 48px;
	padding: 0 20px;
	color: var(--rm-color-text);
	background: var(--rm-color-accent);
	font-size: clamp(1rem, 1.25vw, 1.35rem);
	font-weight: 900;
	letter-spacing: 0.08em;
	line-height: 1;
	text-transform: uppercase;
}

.rm-events--gallery .rm-event-card__live span {
	width: 12px;
	height: 12px;
	background: var(--rm-color-text);
	border-radius: 0;
}

.rm-events--gallery .rm-event-card__date,
.rm-events--gallery .rm-event-card__link,
.rm-events--gallery .rm-kicker {
	display: none;
}

@media (max-width: 1100px) {

	.rm-events--gallery .rm-events__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 720px) {

	.rm-events--gallery .rm-events__header {
		display: grid;
		gap: 16px;
		align-items: start;
	}

	.rm-events--gallery .rm-events__grid {
		grid-template-columns: 1fr;
	}

	.rm-events--gallery .rm-event-card__body {
		padding: 24px;
	}
}

/* =====================================================================
   ENDURANCE INTELLIGENCE — capa de re-tematización (Fase 4A)
   Estos overrides reservan el verde señal (brand) para foco / líder /
   LIVE, fijan esquinas rectas, la textura de papel milimetrado y los
   badges de estado. Cargan después para ganar a las reglas legacy de
   igual especificidad. DESIGN.md secciones 5, 7, 8, 9.
   ===================================================================== */

/* --- Foco visible único: verde señal 3px, offset 2px (DESIGN.md 8) --- */
.rm-template :focus-visible,
.rm-site-header :focus-visible,
.rm-calendar :focus-visible,
.rm-calendar__button:focus-visible,
.rm-circuit-gallery :focus-visible,
.rm-button:focus-visible {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

/* --- Botones: neutro de alto contraste; el verde NO se usa de relleno
   general (queda reservado al indicador único). Esquinas rectas. --- */
.rm-button {
	background: var(--rm-color-text);
	color: var(--rm-color-canvas);
	border: 2px solid var(--rm-color-text);
	border-radius: var(--rm-radius-none);
	font-family: var(--rm-font-display);
}

.rm-button:hover,
.rm-button:focus-visible {
	background: var(--rm-color-text-soft);
	border-color: var(--rm-color-text-soft);
	color: var(--rm-color-canvas);
}

.rm-button--secondary {
	background: transparent;
	border-color: var(--rm-color-text);
	color: var(--rm-color-text);
}

/*
 * Hover/foco del botón secundario en el color de marca (0.9.5). Antes pasaba a
 * `surface-alt` sobre `canvas`: un cambio de ~1.2:1 entre estados, imperceptible
 * — el usuario no sabía si el botón había respondido. El texto usa el token
 * derivado por el guard, el mismo par del CTA de fila.
 */
.rm-button--secondary:hover,
.rm-button--secondary:focus-visible {
	background: var(--rm-color-brand);
	border-color: var(--rm-color-brand);
	color: var(--rm-color-brand-contrast, var(--rm-color-canvas));
}

/* --- Kicker como etiqueta uppercase text-soft, sin chip de color --- */
.rm-kicker {
	padding: 0;
	color: var(--rm-color-text-soft);
	background: transparent;
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.1em;
}

/* --- Textura de papel milimetrado al 4% en fondos de SECCIÓN
   (no en cards ni tablas). DESIGN.md 5.3 --- */
.rm-events,
.rm-calendar,
.rm-championship-gallery,
.rm-circuit-list,
.rm-entity-main,
.rm-session-list {
	background-image: var(--rm-grid-texture);
	background-size: var(--rm-grid-texture-size);
}

.rm-events--gallery {
	background-color: var(--rm-color-canvas);
	background-image: var(--rm-grid-texture);
	background-size: var(--rm-grid-texture-size);
}

.rm-event-main .rm-session-list {
	background-image: none;
}

/* --- Cards: 1px de borde y esquinas rectas (DESIGN.md 7.3/7.7) --- */
.rm-events--gallery .rm-event-card {
	border: 1px solid var(--rm-color-border);
	border-radius: var(--rm-radius-none);
}

/* --- Indicador LIVE único: verde señal + texto (DESIGN.md 1, 7.6) --- */
.rm-events--gallery .rm-event-card__live {
	background: var(--rm-color-brand);
	color: var(--rm-color-canvas);
}

.rm-events--gallery .rm-event-card__live span {
	background: var(--rm-color-canvas);
}

/* --- Tablas: hover de fila 120ms (DESIGN.md 7.1, 9) --- */

/*
 * Cabecera de tabla en el color de marca (0.9.4). ÚNICO sitio donde se declara
 * el color de `thead th`: antes había tres reglas apilando `background` sobre el
 * mismo píxel y solo mandaba la última.
 *
 * El texto va en `--rm-color-brand-contrast`, que NO es un color fijo: el guard
 * de accesibilidad lo deriva probando `canvas` y `text` sobre `brand` y se queda
 * con el que supere 4.5:1. Así el par se valida solo en cualquier sitio que use
 * el plugin, tenga la marca que tenga; es el mismo par que ya usa el CTA de fila.
 * El fallback cubre el caso sin herencia de paleta (Endurance).
 *
 * Solo la cabecera: la zebra de filas pares y el hover siguen en surface-alt.
 */
.rm-session-list thead th,
.rm-results thead th,
.rm-standings thead th {
	background: var(--rm-color-brand);
	color: var(--rm-color-brand-contrast, var(--rm-color-canvas));
	font-size: var(--rm-text-sm);
}

.rm-session-list tbody tr:hover,
.rm-results tbody tr:hover,
.rm-standings tbody tr:hover {
	background: var(--rm-color-surface-alt);
	transition: background 120ms ease-out;
}

/* --- Badges de estado de evento: TEXTO primero, color secundario.
   Mapeo de términos rm_event_status a la tabla DESIGN.md 7.6. --- */
.rm-status-badge {
	display: inline-flex;
	align-items: center;
	align-self: start;
	width: fit-content;
	min-height: 1.6rem;
	margin: 0;
	padding: 0.2rem 0.6rem;

	/* 0.5.1: con paleta heredada el guard deriva el texto del badge neutro
	   contra el border efectivo (--rm-color-badge-neutral-text); sin herencia
	   cae a text-soft (par Endurance 5.0:1). */
	color: var(--rm-color-badge-neutral-text, var(--rm-color-text-soft));
	background: var(--rm-color-border);
	border: 1px solid var(--rm-color-border);
	border-radius: var(--rm-radius-sm);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1;
	text-transform: uppercase;
}

.rm-status-badge--programado {
	color: var(--rm-color-badge-neutral-text, var(--rm-color-text-soft));
	background: var(--rm-color-border);
	border-color: var(--rm-color-border);
}

.rm-status-badge--confirmado {
	color: var(--rm-color-canvas);
	background: var(--rm-color-status-confirmed);
	border-color: var(--rm-color-status-confirmed);
}

.rm-status-badge--aplazado {
	color: var(--rm-color-canvas);
	background: var(--rm-color-status-postponed);
	border-color: var(--rm-color-status-postponed);
}

.rm-status-badge--cancelado {
	color: var(--rm-color-canvas);
	background: var(--rm-color-status-cancelled);
	border-color: var(--rm-color-status-cancelled);
}

.rm-status-badge--finalizado {
	/* text-soft (#9B9EAA) sobre finished (#555869) = 2.6:1 FALLA AA en texto
	   pequeño 11px bold. Se usa text (#F8F4EE) = 6.4:1 AAA. El borde claro
	   refuerza el límite del badge como indicador secundario al texto. */
	color: var(--rm-color-text);
	background: var(--rm-color-status-finished);
	border-color: var(--rm-color-text-soft);
}

.rm-calendar-event__status {
	margin-bottom: 0.2rem;
}

/* --- Galería de imágenes del circuito (rm_gallery_ids) --- */
.rm-circuit-gallery {
	margin-top: clamp(24px, 4vw, 40px);
}

.rm-circuit-gallery__title {
	margin: 0 0 var(--rm-space-4);
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xl);
	font-weight: 700;
	text-transform: uppercase;
}

.rm-circuit-gallery__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
	gap: var(--rm-space-4);
	margin: 0;
	padding: 0;
	list-style: none;
}

.rm-circuit-gallery__item {
	margin: 0;
}

.rm-circuit-gallery__figure {
	margin: 0;
	background: var(--rm-color-surface);
	border: 1px solid var(--rm-color-border);
	border-radius: var(--rm-radius-none);
}

.rm-circuit-gallery__image {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.rm-circuit-gallery__caption {
	padding: var(--rm-space-2) var(--rm-space-3);
	color: var(--rm-color-text-soft);
	font-size: var(--rm-text-sm);
}

/* --- Bloque rm/circuit-gallery (listado de circuitos): reusa el patrón
   de tarjeta de campeonato + lista de specs. --- */
.rm-circuit-card__specs {
	margin: 0;
}

.rm-circuit-card__specs dd {
	font-weight: 600;
}

/* =====================================================================
   ENDURANCE INTELLIGENCE — Fase 4B
   Ficha de piloto (7.4), parrilla de pilotos (7.3) y cuenta atrás (7.5).
   Solo tokens --rm-*; el verde señal (brand) queda reservado al foco y al
   único CTA del countdown. El color de equipo (--rm-team-color) se usa
   exclusivamente como banda decorativa (DESIGN.md 2.3).
   ===================================================================== */

/* --- Texto solo para lectores de pantalla. Respaldo por si el tema no lo
   define: es crítico para la accesibilidad de la cuenta atrás. Desde 0.10.0
   también en .rm-events: las filas del listado llevan ahí el propósito de cada
   chip y el nombre del evento en el CTA, y sin el respaldo se verían. --- */
.rm-template .screen-reader-text,
.rm-events .screen-reader-text,
.rm-countdown .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	word-wrap: normal;
}

/* --- Marcador decorativo de bandera. La alternativa textual real es el
   nombre del país, que se imprime siempre junto a este marcador. --- */
.rm-flag {
	display: inline-block;
	flex: 0 0 auto;
	width: 1.6em;
	height: 1.2em;
	margin-right: 0.5em;
	background: var(--rm-color-surface-alt);
	border: 1px solid var(--rm-color-border);
	vertical-align: -0.22em;
}

/* Bandera de verdad (0.10.1). El SVG viene con su proporción 4:3, así que se
   fija el alto y el ancho lo pone el propio fichero: ninguna sale estirada.
   El filete no es decoración: las banderas con blanco al borde (Japón, Polonia,
   Finlandia) se fundirían con un fondo claro y perderían su silueta. */
.rm-flag--svg {
	width: auto;
	height: 1.2em;
	background: none;
	border: 0;
	border-radius: 2px;
	box-shadow: 0 0 0 1px var(--rm-color-border);
	object-fit: cover;
}

/* ---------- 7.4 Ficha de piloto ---------- */
.rm-driver-profile {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--rm-space-8);
	overflow: hidden;
}

@media (min-width: 768px) {

	.rm-driver-profile {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: var(--rm-space-12);
	}
}

.rm-driver-profile__dorsal-bg {
	position: absolute;
	top: -0.15em;
	right: -0.05em;
	z-index: 0;
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-hero);
	font-weight: 900;
	line-height: 0.8;
	opacity: 0.06;
	pointer-events: none;
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

.rm-driver-profile__media {
	position: relative;
	z-index: 1;
}

.rm-driver-profile__photo {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	background: var(--rm-color-surface);
	border: 1px solid var(--rm-color-border);
	border-radius: var(--rm-radius-none);
}

.rm-driver-profile__photo--empty {
	background: var(--rm-color-surface-alt);
}

.rm-driver-profile__info {
	position: relative;
	z-index: 1;
	min-width: 0;
}

.rm-driver-profile__topline {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--rm-space-4);
}

.rm-driver-profile__nationality {
	display: inline-flex;
	align-items: center;
	margin: 0;
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-sm);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.rm-driver-profile__dorsal {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	margin: 0;
	line-height: 1;
}

.rm-driver-profile__dorsal-value {
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-2xl);
	font-weight: 900;
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

.rm-driver-profile__dorsal-label {
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.rm-driver-profile__name {
	margin: var(--rm-space-3) 0 var(--rm-space-2);
	line-height: 0.92;
}

.rm-driver-profile__firstname {
	display: block;
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-lg);
	font-weight: 400;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.rm-driver-profile__lastname {
	display: block;
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-2xl);
	font-weight: 900;
	letter-spacing: 0.01em;
	text-transform: uppercase;
}

@media (min-width: 768px) {

	.rm-driver-profile__lastname {
		font-size: var(--rm-text-3xl);
	}
}

.rm-driver-profile__birth {
	margin: 0 0 var(--rm-space-3);
	color: var(--rm-color-text-soft);
	font-size: var(--rm-text-sm);
}

.rm-driver-profile__entry-label {
	margin: var(--rm-space-3) 0 var(--rm-space-1);
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.rm-driver-profile__team {
	display: flex;
	align-items: stretch;
	gap: var(--rm-space-3);
	margin: 0;
}

.rm-driver-profile__team-strip {
	display: block;
	flex: 0 0 auto;
	width: 4px;
	min-height: 1.4em;
	background: var(--rm-team-color, var(--rm-color-border));
}

.rm-driver-profile__team-name {
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-lg);
	font-weight: 700;
	text-transform: uppercase;
}

.rm-driver-stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--rm-space-4);
	margin: var(--rm-space-6) 0;
	padding: var(--rm-space-4) 0;
	border-top: 1px solid var(--rm-color-border);
	border-bottom: 1px solid var(--rm-color-border);
	list-style: none;
}

@media (max-width: 480px) {

	.rm-driver-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.rm-stat {
	display: flex;
	flex-direction: column;
	gap: var(--rm-space-1);
	margin: 0;
}

.rm-stat__value {
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-2xl);
	font-weight: 600;
	line-height: 1;
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

.rm-stat__label {
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xs);
	font-weight: 400;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.rm-driver-palmares {
	margin: var(--rm-space-6) 0 0;
}

/* El texto del piloto salía pegado a la última fila del palmarés: `.rm-content
   > :first-child { margin-top: 0 }` mata el margen del párrafo y aquí no había
   nada que lo sustituyera, así que la tabla y la prosa se tocaban. El aire va
   en el contenedor, que es lo único que la regla del primer hijo no anula. */
.rm-driver-profile .rm-content {
	margin-top: var(--rm-space-8);
}

.rm-driver-palmares__table {
	width: 100%;
	border-collapse: collapse;
}

.rm-driver-palmares__table caption {
	margin-bottom: var(--rm-space-2);
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-align: left;
	text-transform: uppercase;
}

.rm-driver-palmares__table th,
.rm-driver-palmares__table td {
	padding: var(--rm-space-3);
	text-align: left;
	border-bottom: 1px solid var(--rm-color-border);
}

.rm-driver-palmares__table thead th {
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-sm);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.rm-driver-palmares__table tbody th,
.rm-driver-palmares__table tbody td {
	color: var(--rm-color-text);
	font-size: var(--rm-text-sm);
	font-weight: 600;
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

.rm-driver-palmares__table tbody tr:hover {
	background: var(--rm-color-surface-alt);
	transition: background 120ms ease-out;
}

/* ---------- 7.3 Parrilla de pilotos ---------- */
.rm-driver-grid {
	background-color: var(--rm-color-canvas);
	background-image: var(--rm-grid-texture);
	background-size: var(--rm-grid-texture-size);
	color: var(--rm-color-text);
}

.rm-driver-grid .rm-events__header h2 {
	color: var(--rm-color-text);
}

.rm-driver-grid__group + .rm-driver-grid__group {
	margin-top: var(--rm-space-8);
}

.rm-driver-grid__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
	gap: var(--rm-gap, var(--rm-space-4));
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (max-width: 1024px) {

	.rm-driver-grid__grid {
		grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr));
	}
}

@media (max-width: 640px) {

	.rm-driver-grid__grid {
		grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr));
	}
}

.rm-driver-grid__item {
	margin: 0;
}

.rm-driver-card {
	position: relative;
	height: 100%;
	background: var(--rm-color-surface);
	border: 1px solid var(--rm-color-border);
	border-radius: var(--rm-radius-none);
	overflow: hidden;
}

.rm-driver-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.rm-driver-card__link:focus-visible {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

.rm-driver-card__dorsal {
	position: absolute;
	top: var(--rm-space-2);
	right: var(--rm-space-3);
	z-index: 1;
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: 5rem;
	font-weight: 900;
	line-height: 0.8;
	opacity: 0.12;
	pointer-events: none;
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

.rm-driver-card__media {
	display: block;
	aspect-ratio: 1 / 1;
	background: var(--rm-color-surface-alt);
}

.rm-driver-card__photo {
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

.rm-driver-card__photo--empty {
	background: var(--rm-color-surface-alt);
}

.rm-driver-card__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: var(--rm-space-1);
	padding: var(--rm-space-3) var(--rm-space-4) 0;
}

.rm-driver-card__nationality {
	display: inline-flex;
	align-items: center;
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xs);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.rm-driver-card__name {
	margin: var(--rm-space-1) 0 var(--rm-space-3);
	line-height: 0.96;
}

.rm-driver-card__surname {
	display: block;
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xl);
	font-weight: 700;
	text-transform: uppercase;
}

.rm-driver-card__firstname {
	display: block;
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-sm);
	font-weight: 400;
}

.rm-driver-card__team {
	display: block;
	margin-top: auto;
	margin-inline: calc(var(--rm-space-4) * -1);
	padding: var(--rm-space-2) var(--rm-space-4);
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-sm);
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-bottom: 4px solid var(--rm-team-color, var(--rm-color-border));
}

/* ---------- 7.5 Cuenta atrás ---------- */
.rm-countdown {
	max-width: var(--rm-content-max);
	margin-inline: auto;
	padding: var(--rm-space-12) var(--rm-margin-desktop);
	background-color: var(--rm-color-canvas);
	background-image: var(--rm-grid-texture);
	background-size: var(--rm-grid-texture-size);
	color: var(--rm-color-text);
	text-align: center;
}

.rm-countdown__header {
	margin-bottom: var(--rm-space-8);
}

.rm-countdown__event {
	display: inline-block;
	margin: 0;
	padding-bottom: var(--rm-space-3);
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-2xl);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-bottom: 3px solid var(--rm-color-border);
}

.rm-countdown__units {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: center;
	gap: var(--rm-space-4);
	margin: 0 auto;
}

.rm-countdown__unit {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--rm-space-2);
	min-width: 4.5rem;
	padding-inline: var(--rm-space-6);
}

.rm-countdown__unit + .rm-countdown__unit::before {
	content: "";
	position: absolute;
	top: 10%;
	left: 0;
	width: 1px;
	height: 60%;
	background: var(--rm-color-border);
}

.rm-countdown__value {
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-hero);
	font-weight: 900;
	line-height: 0.9;
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

.rm-countdown__label {
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.rm-countdown__when {
	margin: var(--rm-space-8) 0 var(--rm-space-6);
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-base);
	letter-spacing: 0.04em;
	font-variant-numeric: tabular-nums lining-nums;
	font-feature-settings: "tnum" 1, "lnum" 1;
}

.rm-countdown__cta {
	margin: 0;
}

/* CTA: ÚNICO uso del verde señal en esta pantalla (DESIGN.md 7.5). La doble
   clase gana en especificidad a la regla neutra de .rm-button de la Fase 4A. */
.rm-countdown__button.rm-button {
	display: inline-flex;
	align-items: center;
	gap: var(--rm-space-2);
	min-height: 44px;
	background: var(--rm-color-brand);
	border-color: var(--rm-color-brand);
	color: var(--rm-color-canvas);
}

.rm-countdown__button.rm-button:hover,
.rm-countdown__button.rm-button:focus-visible {
	background: var(--rm-color-positive);
	border-color: var(--rm-color-positive);
	color: var(--rm-color-canvas);
}

/* ===================================================================
   Fase 4C — Multiclase: clases (tabs), clasificación y resultados.
   =================================================================== */

/* --- Tabs de clase (DESIGN.md 7.1/7.2/7.3) --- */
.rm-class-tabs__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rm-space-4);
	margin-bottom: var(--rm-space-6);
	border-bottom: 1px solid var(--rm-color-border);
}

.rm-class-tabs__tab {
	display: inline-flex;
	align-items: center;
	gap: var(--rm-space-2);
	min-height: 44px;
	margin-bottom: -1px;
	padding: var(--rm-space-2) var(--rm-space-1);
	border: 0;
	border-bottom: 2px solid transparent;
	background: transparent;
	color: var(--rm-color-text-soft);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-sm);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
}

.rm-class-tabs__tab[aria-selected="true"] {
	border-bottom-color: var(--rm-color-text);
	color: var(--rm-color-text);
}

.rm-class-tabs__tab:hover {
	color: var(--rm-color-text);
}

.rm-class-tabs__tab:focus-visible {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

/* Banda de color de clase: SOLO decorativa, junto al texto del tab. */
.rm-class-tabs__swatch {
	display: inline-block;
	width: 0.75rem;
	height: 0.75rem;
	background: var(--rm-cat-color, var(--rm-color-border));
	border: 1px solid var(--rm-color-border);
}

.rm-class-section + .rm-class-section {
	margin-top: var(--rm-space-12);
}

.rm-class-section {
	overflow-x: auto;
}

.rm-class-section__title {
	display: flex;
	align-items: center;
	gap: var(--rm-space-3);
	margin: 0 0 var(--rm-space-4);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xl);
	font-weight: 700;
	text-transform: uppercase;
}

/* Banda de color de clase (decorativa) + etiqueta textual siempre visible. */
.rm-class-section__strip {
	display: inline-block;
	width: 0.5rem;
	height: 1.4rem;
	background: var(--rm-cat-color, var(--rm-color-accent-2));
}

/* --- Standings por clase (DESIGN.md 7.1) --- */
.rm-standings__table,
.rm-results__table {
	table-layout: auto;
}

.rm-standings__pos {
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-2xl);
	font-weight: 900;
	line-height: 1;
	font-variant-numeric: tabular-nums lining-nums;
}

.rm-standings__num,
.rm-standings__points,
.rm-results__num,
.rm-results__points,
.rm-results__pos {
	font-variant-numeric: tabular-nums lining-nums;
	text-align: right;
}

.rm-standings__points,
.rm-results__points {
	font-weight: 600;
}

.rm-standings__number,
.rm-results__number {
	margin-right: var(--rm-space-2);
	color: var(--rm-color-text-soft);
	font-variant-numeric: tabular-nums lining-nums;
}

/* Fila líder: verde señal ÚNICO + badge textual "LÍDER" (color nunca solo). */
.rm-standings__row--leader > * {
	background: color-mix(in srgb, var(--rm-color-brand) 6%, transparent);
}

.rm-standings__row--leader .rm-standings__pos {
	box-shadow: inset 3px 0 0 0 var(--rm-color-brand);
}

.rm-standings__leader-badge {
	display: inline-block;
	margin-left: var(--rm-space-2);
	padding: 0 var(--rm-space-1);
	color: var(--rm-color-brand);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Banda de color de equipo: border-left decorativo + nombre legible. */
.rm-standings__team,
.rm-results__driver {
	border-left: 4px solid var(--rm-team-color, transparent);
}

.rm-standings__team-name,
.rm-results__team-name {
	color: var(--rm-color-text-soft);
}

.rm-results__team {
	display: block;
	margin-top: var(--rm-space-1);
	font-size: var(--rm-text-sm);
}

/* --- Resultados de sesión (DESIGN.md 7.2) --- */
.rm-results__gap,
.rm-results__time {
	font-variant-numeric: tabular-nums lining-nums;
}

.rm-results__gap {
	color: var(--rm-color-text-soft);
}

/* Vuelta rápida: badge índigo #7B6FFF + texto "VR" SIEMPRE visible.
   Texto oscuro (canvas #12141F) sobre el morado reservado #7B6FFF = 4.85:1 (AA),
   conservando la identidad de vuelta rápida. El color nunca es el único indicador:
   el texto "VR" + el screen-reader-text "Vuelta rápida" siguen presentes. */
.rm-fl-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.8rem;
	padding: 0.1rem var(--rm-space-2);
	background: var(--rm-color-fastest-lap);

	/* 06d: con paleta heredada el guard AA deriva el texto del badge
	   (--rm-color-fastest-lap-text) contra el accent-2 efectivo; sin herencia
	   cae a canvas (par Endurance 4.85:1 validado en 0.4.1). */
	color: var(--rm-color-fastest-lap-text, var(--rm-color-canvas));
	border-radius: var(--rm-radius-sm);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Filas DNF/DNS/DSQ: opacidad + TEXTO de estado en la celda de tiempo. */
.rm-results__row--retired {
	opacity: 0.65;
}

.rm-results__row--separator > * {
	border-top: 2px solid var(--rm-color-border);
}

.rm-results__status {
	font-weight: 700;
	text-transform: uppercase;
}

.rm-results__status-note {
	display: block;
	color: var(--rm-color-text-soft);
	font-size: var(--rm-text-sm);
}

/* --- Badge de clase en la tarjeta de piloto (DESIGN.md 7.3) --- */
.rm-driver-card__class {
	display: inline-block;
	align-self: flex-start;
	margin-bottom: var(--rm-space-1);
	padding: 0 var(--rm-space-2);
	background: var(--rm-color-surface-alt);
	color: var(--rm-color-text-soft);
	border-radius: var(--rm-radius-sm);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* === Encargo 06e — driver-grid modo "destacados" (portada) ================
   Vista plana sin tabs: cards grandes con dorsal-pill brand, media alta y
   pie nombre + clase. Todo sobre tokens --rm-* (hereda la paleta del sitio
   con 06d activo). Radio propio de la variante, tokenizado. */

.rm-driver-grid--featured {
	--rm-featured-radius: 16px;

	background-image: none;
}

.rm-driver-grid__grid--featured {
	/* Columnas explicitas: auto-fit dependia del ancho asumido en la pasada
	   de tamano intrinseco (flex) y generaba altura fantasma bajo las cards. */
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--rm-space-8);
}

@media (max-width: 1024px) {

	.rm-driver-grid__grid--featured {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {

	.rm-driver-grid__grid--featured {
		grid-template-columns: minmax(0, 1fr);
	}
}

.rm-driver-grid--featured .rm-driver-card {
	border-radius: var(--rm-featured-radius);
}

.rm-driver-grid--featured .rm-driver-card__media {
	/* Altura por viewport, no por aspect-ratio: la altura dependiente del
	   ancho de columna re-alimentaba el calculo intrinseco erratico del
	   flex anfitrion (seccion mas corta/larga que su contenido). */
	height: clamp(300px, 28vw, 430px);
}

.rm-driver-grid--featured .rm-driver-card__dorsal {
	top: var(--rm-space-3);
	right: auto;
	left: var(--rm-space-3);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.6rem;
	min-height: 2.6rem;
	padding: 0.2rem;
	background: var(--rm-color-brand);
	color: var(--rm-color-canvas);
	border-radius: 999px;
	font-size: var(--rm-text-lg);
	line-height: 1;
	opacity: 1;
}

.rm-driver-grid--featured .rm-driver-card__body {
	gap: var(--rm-space-1);
	padding: var(--rm-space-4);
}

.rm-driver-grid--featured .rm-driver-card__name {
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-2xl);
	font-weight: 700;
	line-height: 1.15;
}

.rm-driver-grid--featured .rm-driver-card__specialty {
	color: var(--rm-color-brand);
	font-size: var(--rm-text-sm);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Placeholder de foto (cards sin imagen): patron diagonal sutil sobre
   surface + etiqueta decorativa abajo-izquierda. Todo aria-hidden. */
.rm-driver-grid--featured .rm-driver-card__media {
	position: relative;
}

.rm-driver-grid--featured .rm-driver-card__photo--empty {
	display: block;
	height: 100%;
	background-image: repeating-linear-gradient(
		-45deg,
		transparent 0,
		transparent 14px,
		color-mix(in srgb, var(--rm-color-text) 4%, transparent) 14px,
		color-mix(in srgb, var(--rm-color-text) 4%, transparent) 17px
	);
}

.rm-driver-grid--featured .rm-driver-card__photo-label {
	position: absolute;
	bottom: var(--rm-space-3);
	left: var(--rm-space-4);
	color: var(--rm-color-text-soft);
	font-size: var(--rm-text-xs);
	font-weight: 600;
	letter-spacing: 0.35em;
	text-transform: uppercase;
}

@media (prefers-reduced-motion: no-preference) {

	.rm-driver-grid--featured .rm-driver-card {
		transition: transform 120ms ease-out;
	}

	.rm-driver-grid--featured .rm-driver-card:hover {
		transform: translateY(-4px);
	}
}

/* Cabecera de seccion portada (featured/rows, 0.5.2): fila space-between con
   H2 display grande en una linea y enlace brand con flecha a la derecha. */
.rm-section-header--portada {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rm-space-2) var(--rm-space-6);
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: var(--rm-space-8);
}

.rm-section-header--portada h2 {
	margin: 0;
	font-family: var(--rm-font-display);
	font-size: clamp(2rem, 2.8vw, 2.75rem);
	line-height: 1;
	white-space: nowrap;
}

/* (0,4,0): por encima de la regla generica color:inherit de .rm-events,
   que quedo en (0,3,1) al ganar el :not() del CTA de filas. */
.rm-events.rm-events--rows .rm-section-header--portada .rm-events__calendar-link,
.rm-driver-grid.rm-driver-grid--featured .rm-section-header--portada .rm-events__calendar-link,
.rm-section-header--portada .rm-events__calendar-link {
	color: var(--rm-color-brand);
	font-size: var(--rm-text-lg);
	font-weight: 700;
	letter-spacing: normal;
	text-decoration: none;
	text-transform: none;
	white-space: nowrap;
}

.rm-section-header--portada .rm-events__calendar-link:hover {
	text-decoration: underline;
}

.rm-section-header--portada .rm-events__calendar-link:focus-visible {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

/* === Encargo 06f — upcoming-events modo "filas compactas" (portada) =======
   Fila horizontal: fecha (día display + mes), título h3 + serie, chip de hora
   no interactivo (borde decorativo, exento de 1.4.11) y CTA pill. */

.rm-events--rows {
	--rm-row-radius: 16px;

	padding: 0;
	background-image: none;
}

.rm-event-rows {
	display: grid;
	gap: var(--rm-gap, var(--rm-space-4));
	margin: 0;
	padding: 0;
	list-style: none;
}

.rm-event-rows__item {
	margin: 0;
}

.rm-event-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--rm-space-4) var(--rm-space-6);
	padding: var(--rm-space-8) var(--rm-space-6);
	background: var(--rm-color-surface);
	border: 1px solid var(--rm-color-border);
	border-radius: var(--rm-row-radius);
}

.rm-event-row__date {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 3.5rem;
}

.rm-event-row__day {
	color: var(--rm-color-brand);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-2xl);
	font-weight: 700;
	line-height: 1;
	font-variant-numeric: tabular-nums lining-nums;
}

.rm-event-row__month {
	color: var(--rm-color-text-soft);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.rm-event-row__main {
	flex: 1 1 16rem;
	min-width: 0;
}

.rm-event-row__title {
	margin: 0;
	font-family: var(--rm-font-body);
	font-size: var(--rm-text-xl);
	font-weight: 700;
	line-height: 1.2;
}

.rm-event-row__title a {
	color: var(--rm-color-text);
	text-decoration: none;
}

.rm-event-row__title a:hover {
	color: var(--rm-color-brand);
	text-decoration: underline;
}

.rm-event-row__title a:focus-visible {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

/*
 * Chip canónico (encargo 08). Un solo formato para estado, serie y plataforma,
 * compartido por la fila del calendario y la cabecera del detalle de evento:
 * misma píldora, mismo cuerpo, mismas versalitas. `.rm-chips` es la tira que los
 * pone en una línea; `flex-wrap` porque en móvil o con varias series no cabe
 * todo y preferimos que baje a que se recorte.
 */
.rm-chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rm-space-3);
	align-items: center;
	margin: var(--rm-space-3) 0 0;
}

.rm-chip {
	display: inline-flex;
	align-items: center;
	padding: 0.35rem 0.8rem;
	color: var(--rm-color-badge-neutral-text, var(--rm-color-text-soft));
	font-family: var(--rm-font-body);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.4;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	border: 1px solid var(--rm-color-border);
	border-radius: 999px;
}

/*
 * El estado va CODIFICADO POR COLOR con relleno, no solo con el borde: el chip
 * conserva la geometría común (misma píldora, mismo cuerpo, mismo padding) y lo
 * único que cambia es el par de color, que es justo lo que aporta información.
 *
 * Cada par (texto sobre fondo) es el ya validado de `.rm-status-badge--*`; se
 * repite aquí porque `.rm-chip` y `.rm-status-badge--*` empatan a (0,1,0) y el
 * chip va después en el fichero, así que ganaba siempre. Los selectores
 * encadenados (0,2,0) devuelven el mando a cada estado. Cero hardcodes: todo
 * sale de tokens.
 */
.rm-chip.rm-status-badge--programado {
	color: var(--rm-color-badge-neutral-text, var(--rm-color-text-soft));
	background: var(--rm-color-border);
	border-color: var(--rm-color-border);
}

.rm-chip.rm-status-badge--confirmado {
	color: var(--rm-color-canvas);
	background: var(--rm-color-status-confirmed);
	border-color: var(--rm-color-status-confirmed);
}

.rm-chip.rm-status-badge--aplazado {
	color: var(--rm-color-canvas);
	background: var(--rm-color-status-postponed);
	border-color: var(--rm-color-status-postponed);
}

.rm-chip.rm-status-badge--cancelado {
	color: var(--rm-color-canvas);
	background: var(--rm-color-status-cancelled);
	border-color: var(--rm-color-status-cancelled);
}

.rm-chip.rm-status-badge--finalizado {
	/* text-soft sobre finished da 2.6:1; con text sube a 6.4:1 (nota original
	   de .rm-status-badge--finalizado). */
	color: var(--rm-color-text);
	background: var(--rm-color-status-finished);
	border-color: var(--rm-color-status-finished);
}

.rm-chip.rm-chip--status {
	min-height: 0;
}

a.rm-chip:hover {
	color: var(--rm-color-brand-contrast, var(--rm-color-canvas));
	background: var(--rm-color-brand);
	border-color: var(--rm-color-brand);
}

a.rm-chip:focus-visible {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

.rm-event-row__time {
	padding: 0.45rem var(--rm-space-4);
	color: var(--rm-color-text);
	border: 1px solid var(--rm-color-border);
	border-radius: 999px;
	font-size: var(--rm-text-sm);
	font-weight: 600;
	white-space: nowrap;
	font-variant-numeric: tabular-nums lining-nums;
}

.rm-event-row__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.75rem;
	padding: 0.6rem var(--rm-space-6);
	background: var(--rm-color-brand);

	/* 0.5.1: texto derivado contra el brand efectivo (heredado o Endurance);
	   fallback canvas = par oscuro-sobre-verde validado del redesign 0.4.x. */
	color: var(--rm-color-brand-contrast, var(--rm-color-canvas));
	border-radius: 999px;
	font-size: var(--rm-text-base);
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}

.rm-event-row__cta:hover {
	filter: brightness(1.08);
}

.rm-event-row__cta:focus-visible {
	outline: 3px solid var(--rm-color-text);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: no-preference) {

	.rm-event-row {
		transition: transform 120ms ease-out;
	}

	.rm-event-row:hover {
		transform: translateY(-2px);
	}
}

@media (max-width: 640px) {

	.rm-event-row {
		align-items: flex-start;
	}

	.rm-event-row__cta {
		width: 100%;
	}
}

/* =====================================================================
   Encargo 07 — Fase 4: controles propios de bloque (densidad, columnas,
   acento del countdown). Los defaults ('' = heredar) no emiten clase y el
   render queda idéntico a 0.6.0. Todos los valores derivan de tokens.
   ===================================================================== */

/* Densidad compacta: menos aire en grids, cards, filas y tablas. El gap se
   canaliza por --rm-gap, el mismo token de instancia que emite el support
   spacing.blockGap (el inline del atributo gana a la clase de variante). */
.rm-density-compact {
	--rm-gap: var(--rm-space-4);
}

.rm-density-compact .rm-event-card__body,
.rm-density-compact .rm-calendar-event__body {
	gap: var(--rm-space-2);
	padding: var(--rm-space-4);
}

.rm-density-compact .rm-event-row {
	padding: var(--rm-space-4) var(--rm-space-6);
}

.rm-density-compact .rm-standings td,
.rm-density-compact .rm-standings th,
.rm-density-compact .rm-results td,
.rm-density-compact .rm-results th {
	padding: var(--rm-space-1) var(--rm-space-2);
}

/* Columnas explícitas de galería ('' = auto-fit heredado). Solo escritorio:
   en pantallas estrechas el auto-fit del grid sigue mandando. */
@media (min-width: 782px) {

	.rm-cols-2 .rm-championship-gallery__grid,
	.rm-cols-2 .rm-events__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.rm-cols-3 .rm-championship-gallery__grid,
	.rm-cols-3 .rm-events__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.rm-cols-4 .rm-championship-gallery__grid,
	.rm-cols-4 .rm-events__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* =====================================================================
   Encargo 09 — cabecera de página del calendario y filtro maestro.
   ===================================================================== */

/* Cabecera de PÁGINA (no de sección): título display grande a dos colores y
   entradilla debajo. La variante `--portada` no vale aquí: va en una fila
   space-between con `white-space: nowrap`, pensada para un H2 de una línea con
   su enlace a la derecha; un título de página de tres palabras se saldría. */
.rm-section-header--hero {
	display: block;
	margin-bottom: var(--rm-space-8);
}

.rm-section-header--hero .rm-events__heading {
	margin: 0;
	font-family: var(--rm-font-display);
	font-size: clamp(2.5rem, 7vw, 5rem);
	line-height: 0.95;
}

/* Par validado por el guard AA («cifras/fechas brand sobre fondo», 4.5:1): el
   acento sube al mismo listón que el texto normal aunque sea texto grande. */
.rm-events__heading-accent {
	color: var(--rm-color-brand);
}

.rm-events__intro {
	max-width: 46ch;
	margin: var(--rm-space-4) 0 0;
	color: var(--rm-color-text-soft);
	font-size: var(--rm-text-lg);
	line-height: 1.5;
}

.rm-section-header--hero .rm-events__calendar-link {
	display: inline-block;
	margin-top: var(--rm-space-4);
	color: var(--rm-color-brand);
	font-weight: 700;
	text-decoration: none;
}

/* --- Filtro maestro ------------------------------------------------------
   El panel se PLIEGA solo cuando hay JavaScript que sepa desplegarlo otra vez:
   `.rm-js` la pone en <html> Plugin::printJsFlag() antes de pintar, así que no
   hay parpadeo de panel abierto. Sin JS no aparece el botón y el panel se
   queda visible con su botón «Aplicar filtros», que es el filtro completo
   funcionando sin una línea de script. */
/* El filtrado en cliente esconde filas y controles con el atributo `hidden`.
   Vale la regla del navegador salvo que algo declare `display` sobre ese mismo
   elemento —una fila de una lista en grid, sin ir más lejos—, y entonces el
   atributo deja de tener efecto sin avisar. */
.rm-events [hidden] {
	display: none;
}

.rm-filters {
	margin: 0 0 var(--rm-space-8);
	padding: var(--rm-space-6);
	background: var(--rm-color-surface);
	border: 1px solid var(--rm-color-border);
	border-radius: var(--rm-row-radius, 16px);
}

.rm-filters__bar {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rm-space-3) var(--rm-space-4);
	align-items: center;
}

.rm-filters__title {
	margin: 0;
	color: var(--rm-color-text);
	font-family: var(--rm-font-display);
	font-size: var(--rm-text-xl);
	font-weight: 900;
	line-height: 1;
	text-transform: uppercase;
}

.rm-filters__toggle {
	display: none;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	padding: 0;
	background: var(--rm-color-brand);
	border: 0;
	border-radius: 999px;
	cursor: pointer;
}

.rm-js .rm-filters__toggle {
	display: inline-flex;
}

.rm-filters__toggle:focus-visible {
	outline: 3px solid var(--rm-color-text);
	outline-offset: 3px;
}

/* Signo +/− dibujado con dos barras: la vertical se retira al abrir. El estado
   real no lo lleva el dibujo sino aria-expanded y el texto del botón. */
.rm-filters__marker {
	position: relative;
	display: block;
	width: 0.75rem;
	height: 0.75rem;
}

.rm-filters__marker::before,
.rm-filters__marker::after {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 2px;
	margin-top: -1px;
	background: var(--rm-color-brand-contrast, var(--rm-color-canvas));
	content: "";
}

.rm-filters__marker::after {
	transform: rotate(90deg);
}

.rm-filters.is-open .rm-filters__marker::after {
	transform: rotate(90deg) scaleX(0);
}

.rm-filters__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.5rem;
	height: 1.5rem;
	padding: 0 0.4rem;
	background: var(--rm-color-brand);
	color: var(--rm-color-brand-contrast, var(--rm-color-canvas));
	border-radius: 999px;
	font-size: var(--rm-text-sm);
	font-weight: 700;
	font-variant-numeric: tabular-nums lining-nums;
}

.rm-filters__aside {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rm-space-3) var(--rm-space-4);
	align-items: center;
	margin-left: auto;
}

.rm-filters__count {
	margin: 0;
	color: var(--rm-color-text-soft);
	font-size: var(--rm-text-base);
}

.rm-filters__clear {
	padding: 0.5rem var(--rm-space-4);
	color: var(--rm-color-brand);
	font-size: var(--rm-text-base);
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
	border: 1px solid var(--rm-color-border);
	border-radius: 999px;
}

.rm-filters__clear:hover {
	border-color: var(--rm-color-brand);
	text-decoration: underline;
}

.rm-filters__panel {
	display: grid;
	gap: var(--rm-space-4);
	margin-top: var(--rm-space-6);
	padding-top: var(--rm-space-6);
	border-top: 1px solid var(--rm-color-border);
}

.rm-js .rm-filters:not(.is-open) .rm-filters__panel {
	display: none;
}

.rm-filters__group {
	margin: 0;
	padding: 0;
	border: 0;
}

.rm-filters__legend {
	padding: 0;
	color: var(--rm-color-text-soft);
	font-size: var(--rm-text-xs);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.rm-filters__options {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rm-space-3);
	margin-top: var(--rm-space-3);
}

/* Casilla de verdad, no un botón con aria-pressed: el estado lo cuenta el
   propio control («marcada»), el grupo lo cuenta su <legend> y el formulario
   sigue enviándose sin JavaScript. La entrada se oculta visualmente pero
   conserva el foco, que se dibuja sobre la píldora. */
.rm-filter-chip {
	position: relative;
	display: inline-flex;
}

.rm-filter-chip__input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.rm-filter-chip__label {
	display: inline-flex;
	align-items: center;
	min-height: 2.25rem;
	padding: 0.5rem var(--rm-space-4);
	color: var(--rm-color-text);
	font-family: var(--rm-font-body);
	font-size: var(--rm-text-sm);
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.4;
	text-transform: uppercase;
	white-space: nowrap;
	background: var(--rm-color-canvas);
	border: 1px solid var(--rm-color-border);
	border-radius: 999px;
	cursor: pointer;
}

.rm-filter-chip__label:hover {
	border-color: var(--rm-color-brand);
}

.rm-filter-chip__input:checked + .rm-filter-chip__label {
	background: var(--rm-color-brand);
	color: var(--rm-color-brand-contrast, var(--rm-color-canvas));
	border-color: var(--rm-color-brand);
}

.rm-filter-chip__input:focus-visible + .rm-filter-chip__label {
	outline: 3px solid var(--rm-color-brand);
	outline-offset: 2px;
}

/* Marcada, el foco en color de marca sería invisible sobre el propio relleno. */
.rm-filter-chip__input:checked:focus-visible + .rm-filter-chip__label {
	outline-color: var(--rm-color-text);
}

.rm-filters__actions {
	margin: 0;
}

.rm-events__empty {
	margin: var(--rm-space-4) 0 0;
	padding: var(--rm-space-6);
	border-radius: var(--rm-row-radius, 16px);
}

@media (max-width: 640px) {

	.rm-filters__aside {
		width: 100%;
		margin-left: 0;
	}
}

/* Countdown con acento neutro: el CTA renuncia al verde señal reservado y
   usa el par canvas/text (R16 del contrato, 16.73:1 AA). */
.rm-countdown--neutral .rm-countdown__button.rm-button {
	background: var(--rm-color-text);
	border-color: var(--rm-color-text);
	color: var(--rm-color-canvas);
}

.rm-countdown--neutral .rm-countdown__button.rm-button:hover,
.rm-countdown--neutral .rm-countdown__button.rm-button:focus-visible {
	background: var(--rm-color-text-soft);
	border-color: var(--rm-color-text-soft);
	color: var(--rm-color-canvas);
}
