/* rm-page-downloads.css - the Downloads page's own layout (menu.downloads.php, 15 Oct 2026: the three editing-software plugins, Windows and
   macOS side by side). The values are the site's tokens (rm-layout-tokens.css, rm-brand-tokens.css); the cards are the site's grid frames
   (.grid-frame: dark box, light border). One card a row on phones and tablets, three side by side from 992 px (Bootstrap lg) */

.rm-downloads__intro { max-width: 60rem; }

.rm-downloads__list {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--rm-space-5);
}
@media (min-width: 992px) {
	.rm-downloads__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.rm-downloads__plugin {
	display: flex;
	flex-direction: column;
	padding: var(--rm-space-4);
	margin: 0;
	scroll-margin-top: var(--rm-space-9);			/* (a link to #premiere-pro ... stops below the sticky header) */
}

/* The host software's icon (15 Oct 2026): 40 px with 20 px of empty space all round - Avid's logo rule asks for at least half the logo's
   height between it and any text, border or edge (the card's padding is 20 px too) */
.rm-downloads__head {
	display: flex;
	align-items: center;
	gap: var(--rm-space-4);
	margin-bottom: var(--rm-space-4);
}
.rm-downloads__icon {
	flex: none;
	width: 40px;
	height: 40px;
}
.rm-downloads__plugin h2.rm-downloads__name {
	margin: 0;
	color: var(--rm-lighter);
	font-size: 1.25rem;
	line-height: 1.4;
	letter-spacing: normal;
}

.rm-downloads__about { margin: 0 0 var(--rm-space-4); }

.rm-downloads__plugin h3.rm-downloads__label {
	margin: 0 0 var(--rm-space-2);
	color: var(--rm-lighter);
	text-transform: uppercase;
}
.rm-downloads__plugin h3.rm-downloads__label--download { margin-top: auto; padding-top: var(--rm-space-2); }	/* the downloads at the card's foot, level across a row */

.rm-downloads__needs {
	margin: 0 0 var(--rm-space-2);
	padding-left: var(--rm-space-4);
}
.rm-downloads__start {
	margin: 0 0 var(--rm-space-4);
	color: var(--rm-grey-aa);
	font-size: var(--rm-font-size-small);
}

.rm-downloads__systems {
	list-style: none;
	margin: 0;
	padding: 0;
}
.rm-downloads__system {
	display: flex;
	align-items: center;
	gap: var(--rm-space-3);
	padding: var(--rm-space-2) 0;
	border-top: var(--rm-border-width) solid var(--rm-grey-49);
}
.rm-downloads__os-icon {
	flex: none;
	width: 24px;
	height: 24px;
}
.rm-downloads__os {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	line-height: 1.3;
}
.rm-downloads__os-name { color: var(--rm-lighter); font-weight: bold; }
.rm-downloads__os-meta { color: var(--rm-grey-aa); font-size: var(--rm-font-size-small); }
.rm-downloads__btn { flex: none; min-width: 7.5rem; }
@media (min-width: 544px) {
	.rm-downloads__btn { min-width: 9rem; }
}
.rm-downloads__system--soon .rm-downloads__os-icon { opacity: 0.5; }
.rm-downloads__system--soon .rm-downloads__btn { cursor: default; }

/* What's new (17 Oct 2026): the plugin's version history from downloads/updates.json under its downloads, a <details> closed until
   opened (the keyboard ring is the site's own, rm-brand-states.css); the same line and colours as the systems above it */
.rm-downloads__history {
	border-top: var(--rm-border-width) solid var(--rm-grey-49);
	padding-top: var(--rm-space-2);
}
.rm-downloads__history-toggle {
	cursor: pointer;
	color: var(--rm-lighter);
	font-size: var(--rm-font-size-small);
	font-weight: bold;
}
.rm-downloads__history-toggle:hover { color: var(--rm-white); }
.rm-downloads__releases {
	list-style: none;
	margin: var(--rm-space-2) 0 0;
	padding: 0;
	font-size: var(--rm-font-size-small);
}
.rm-downloads__release + .rm-downloads__release { margin-top: var(--rm-space-2); }
.rm-downloads__release-head { margin: 0; }
.rm-downloads__release-version { color: var(--rm-lighter); font-weight: bold; }
.rm-downloads__release-date { color: var(--rm-grey-aa); }
.rm-downloads__release-notes {
	margin: 0;
	padding-left: var(--rm-space-4);
	list-style: disc;						/* (as the Requirements list - a list in a list would get circles) */
	overflow-wrap: anywhere;
}

.rm-downloads__note { margin-top: var(--rm-space-5); }
.rm-downloads__trademarks {
	margin: var(--rm-space-4) 0 0;
	max-width: 60rem;
	color: var(--rm-grey-aa);
	font-size: var(--rm-font-size-small);
}
