/*
Theme Name: Metricsio
Author: Metricsio Lab
Description: A data-panel dashboard theme for market intelligence sites — fixed terminal sidebar, live metric grids, seeded mini charts and gridline sectioning.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: metricsio
Tags: dashboard, dark-sidebar, two-columns, custom-logo, translation-ready
*/

/* ==========================================================================
   0. Tokens
   ========================================================================== */
:root {
	--mtr-navy:      #0F172A;
	--mtr-navy-2:    #131C33;
	--mtr-navy-3:    #1B2742;
	--mtr-cyan:      #06B6D4;
	--mtr-cyan-deep: #164E63;
	--mtr-fog:       #F1F5F9;
	--mtr-white:     #FFFFFF;
	--mtr-line:      rgba(6, 182, 212, .2);
	--mtr-line-soft: rgba(6, 182, 212, .12);
	--mtr-ink:       #0F172A;
	--mtr-ink-soft:  #475569;
	--mtr-mist:      #94A3B8;
	--mtr-mist-dim:  #64748B;
	--mtr-up:        #34D399;
	--mtr-down:      #F87171;
	--mtr-panel-w:   240px;
	--mtr-font-display: "Bahnschrift", "DIN Alternate", "DIN Condensed", "Oswald", "Arial Narrow", "PingFang SC", "Microsoft YaHei", sans-serif;
	--mtr-font-body: Georgia, "Times New Roman", "Songti SC", "SimSun", serif;
	--mtr-font-mono: ui-monospace, "Cascadia Mono", "SF Mono", Consolas, "Liberation Mono", monospace;
}

/* ==========================================================================
   1. Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 84px; }

body {
	margin: 0;
	background: var(--mtr-fog);
	color: var(--mtr-ink);
	font-family: var(--mtr-font-body);
	font-size: 16px;
	line-height: 1.7;
}

img, svg { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--mtr-font-display);
	font-weight: 700;
	line-height: 1.18;
	letter-spacing: .01em;
	margin: 0 0 .5em;
}

p { margin: 0 0 1em; }

::selection { background: var(--mtr-cyan); color: var(--mtr-navy); }

.mtr-mono, .mtr-num { font-family: var(--mtr-font-mono); font-variant-numeric: tabular-nums; }

.mtr-screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* ==========================================================================
   2. Layout shell — fixed left terminal panel (spec A) + main column
   ========================================================================== */
.mtr-shell { display: block; }

.mtr-panel {
	position: fixed;
	top: 0; left: 0; bottom: 0;
	width: var(--mtr-panel-w);
	z-index: 90;
	display: flex;
	flex-direction: column;
	background:
		radial-gradient(520px 260px at -10% -5%, rgba(6, 182, 212, .14), transparent 65%),
		radial-gradient(420px 320px at 110% 105%, rgba(22, 78, 99, .5), transparent 60%),
		var(--mtr-navy);
	border-right: 1px solid var(--mtr-line);
	color: var(--mtr-fog);
	overflow-y: auto;
	overscroll-behavior: contain;
}

.mtr-panel::-webkit-scrollbar { width: 4px; }
.mtr-panel::-webkit-scrollbar-thumb { background: var(--mtr-cyan-deep); }

.mtr-main {
	margin-left: var(--mtr-panel-w);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

.mtr-wrap {
	width: 100%;
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 36px;
}

/* Panel: brand block */
.mtr-panel__brand {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 22px 20px 18px;
	border-bottom: 1px solid var(--mtr-line);
}

.mtr-panel__mark {
	width: 34px; height: 34px;
	flex: 0 0 34px;
	display: grid;
	place-items: center;
	background: linear-gradient(135deg, var(--mtr-cyan), var(--mtr-cyan-deep));
	color: var(--mtr-navy);
	clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}

.mtr-panel__mark svg { width: 18px; height: 18px; }

.mtr-panel__name {
	font-family: var(--mtr-font-display);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--mtr-white);
	line-height: 1.1;
}

.mtr-panel__name em {
	display: block;
	font-family: var(--mtr-font-mono);
	font-size: 9px;
	font-style: normal;
	font-weight: 400;
	letter-spacing: .28em;
	color: var(--mtr-cyan);
}

.mtr-panel__brand img { max-height: 38px; width: auto; }

/* Panel: mini ticker readouts */
.mtr-ticker {
	padding: 14px 20px;
	border-bottom: 1px solid var(--mtr-line);
	display: grid;
	gap: 10px;
}

.mtr-ticker__row {
	display: grid;
	grid-template-columns: 34px 1fr auto;
	align-items: center;
	gap: 8px;
	font-family: var(--mtr-font-mono);
	font-size: 11px;
}

.mtr-ticker__sym { color: var(--mtr-mist); letter-spacing: .06em; }

.mtr-ticker__spark { width: 56px; height: 16px; opacity: .9; }
.mtr-ticker__spark svg { width: 100%; height: 100%; display: block; }

.mtr-ticker__val { text-align: right; color: var(--mtr-white); font-size: 11.5px; }
.mtr-ticker__val .mtr-tick { transition: color .3s; }
.mtr-ticker__val .mtr-tick--flash-up { color: var(--mtr-up); }
.mtr-ticker__val .mtr-tick--flash-down { color: var(--mtr-down); }

.mtr-ticker__chg { font-size: 10px; margin-left: 6px; }
.mtr-up { color: var(--mtr-up); }
.mtr-down { color: var(--mtr-down); }

/* Panel: navigation */
.mtr-panel__nav { padding: 14px 12px; flex: 1 1 auto; }

.mtr-panel__navtitle {
	font-family: var(--mtr-font-mono);
	font-size: 9px;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--mtr-mist-dim);
	padding: 0 8px 8px;
}

.mtr-menu { list-style: none; margin: 0; padding: 0; }

.mtr-menu__item a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 10px;
	border-left: 2px solid transparent;
	font-family: var(--mtr-font-display);
	font-size: 13.5px;
	letter-spacing: .04em;
	color: #CBD5E1;
	transition: background .2s, color .2s, border-color .2s;
}

.mtr-menu__item a:hover,
.mtr-menu__item.current-menu-item a,
.mtr-menu__item.current_page_item a {
	background: rgba(6, 182, 212, .08);
	border-left-color: var(--mtr-cyan);
	color: var(--mtr-white);
}

.mtr-menu__icon { display: inline-flex; width: 18px; height: 18px; color: var(--mtr-cyan); flex: 0 0 18px; }
.mtr-menu__icon svg { width: 100%; height: 100%; }

.mtr-panel__login { padding: 4px 20px 12px; }

.mtr-loginlink {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--mtr-font-mono);
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--mtr-cyan);
	border-bottom: 1px dashed rgba(6, 182, 212, .5);
	padding-bottom: 2px;
	transition: color .2s, border-color .2s;
}

.mtr-loginlink:hover { color: var(--mtr-white); border-color: var(--mtr-white); }
.mtr-loginlink svg { width: 13px; height: 13px; }

/* Panel: embedded CTA (ad slot 0 — spec G) */
.mtr-panel__cta {
	margin: 8px 16px 14px;
	padding: 16px 14px;
	background: linear-gradient(160deg, rgba(6, 182, 212, .16), rgba(22, 78, 99, .35));
	border: 1px solid var(--mtr-line);
	position: relative;
	overflow: hidden;
}

.mtr-panel__cta::before {
	content: "";
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient(0deg, transparent 0 11px, rgba(6, 182, 212, .07) 11px 12px);
	pointer-events: none;
}

.mtr-panel__cta h4 {
	margin: 0 0 6px;
	font-size: 14px;
	color: var(--mtr-white);
	letter-spacing: .03em;
}

.mtr-panel__cta p {
	margin: 0 0 12px;
	font-size: 11.5px;
	line-height: 1.55;
	color: #A5B4C8;
	font-family: var(--mtr-font-mono);
}

/* Panel: footer (language + status) */
.mtr-panel__foot {
	padding: 12px 20px 16px;
	border-top: 1px solid var(--mtr-line);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.mtr-status {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--mtr-font-mono);
	font-size: 9.5px;
	letter-spacing: .18em;
	color: var(--mtr-mist-dim);
}

.mtr-status__dot {
	width: 7px; height: 7px;
	border-radius: 50%;
	background: var(--mtr-up);
	box-shadow: 0 0 0 0 rgba(52, 211, 153, .6);
	animation: mtr-live 2.2s infinite;
}

@keyframes mtr-live {
	0%   { box-shadow: 0 0 0 0 rgba(52, 211, 153, .55); }
	70%  { box-shadow: 0 0 0 7px rgba(52, 211, 153, 0); }
	100% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0); }
}

.mtr-langswitch { display: inline-flex; gap: 4px; font-family: var(--mtr-font-mono); font-size: 10.5px; }
.mtr-langswitch a {
	padding: 3px 8px;
	border: 1px solid var(--mtr-line);
	color: var(--mtr-mist);
	letter-spacing: .08em;
	transition: all .2s;
}
.mtr-langswitch a:hover { color: var(--mtr-white); border-color: var(--mtr-cyan); }
.mtr-langswitch a.mtr-active { background: var(--mtr-cyan); border-color: var(--mtr-cyan); color: var(--mtr-navy); font-weight: 700; }
.mtr-langswitch--foot a { border-color: rgba(6, 182, 212, .3); }

/* ==========================================================================
   3. Topbar (inner pages + mobile)
   ========================================================================== */
.mtr-topbar {
	position: sticky;
	top: 0;
	z-index: 80;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 14px 36px;
	background: rgba(15, 23, 42, .92);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--mtr-line);
	color: var(--mtr-fog);
}

.mtr-topbar__crumb {
	font-family: var(--mtr-font-mono);
	font-size: 11px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--mtr-mist);
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.mtr-topbar__crumb strong { color: var(--mtr-cyan); font-weight: 400; }
.mtr-topbar__crumb span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.mtr-topbar__actions { display: flex; align-items: center; gap: 14px; flex: 0 0 auto; }

.mtr-topbar .mtr-langswitch a { border-color: rgba(6, 182, 212, .35); }

.mtr-burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	background: transparent;
	border: 1px solid var(--mtr-line);
	color: var(--mtr-cyan);
	cursor: pointer;
}

.mtr-burger svg { width: 20px; height: 20px; }

.mtr-panel__close {
	display: none;
	position: absolute;
	top: 14px; right: 12px;
	width: 32px; height: 32px;
	background: transparent;
	border: 1px solid var(--mtr-line);
	color: var(--mtr-cyan);
	cursor: pointer;
	align-items: center;
	justify-content: center;
}

.mtr-panel__close svg { width: 16px; height: 16px; }
.mtr-panel__scrim { display: none; }

/* ==========================================================================
   4. Buttons & chips
   ========================================================================== */
.mtr-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 11px 22px;
	font-family: var(--mtr-font-display);
	font-size: 13.5px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	border: 1px solid transparent;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	transition: transform .18s, box-shadow .18s, background .18s, color .18s;
	clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
}

.mtr-btn svg { width: 15px; height: 15px; }

.mtr-btn--cyan {
	background: var(--mtr-cyan);
	color: var(--mtr-navy);
	box-shadow: 0 0 0 rgba(6, 182, 212, 0);
}

.mtr-btn--cyan:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 22px rgba(6, 182, 212, .4);
}

.mtr-btn--ghost {
	background: transparent;
	color: var(--mtr-cyan);
	border-color: var(--mtr-cyan);
}

.mtr-btn--ghost:hover { background: rgba(6, 182, 212, .12); transform: translateY(-2px); }

.mtr-btn--navy { background: var(--mtr-navy); color: var(--mtr-white); }
.mtr-btn--navy:hover { background: var(--mtr-navy-3); transform: translateY(-2px); }

.mtr-btn--sm { padding: 7px 14px; font-size: 11.5px; letter-spacing: .08em; }

.mtr-btn--block { display: flex; width: 100%; }

.mtr-tagchip {
	display: inline-block;
	padding: 3px 10px;
	font-family: var(--mtr-font-mono);
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--mtr-cyan);
	border: 1px solid var(--mtr-line);
	background: rgba(6, 182, 212, .06);
}

.mtr-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--mtr-mist); display: inline-block; }

.mtr-spark { display: block; }
.mtr-content-main { flex: 1 1 auto; min-width: 0; }
.mtr-single { min-width: 0; }
.mtr-card--chart { background-image: linear-gradient(180deg, rgba(6, 182, 212, .04), transparent 120px); }
.mtr-footer__left { min-width: 0; }
.mtr-instr__deco { display: block; height: 32px; opacity: .8; }
.mtr-instr__deco svg { height: 32px; display: block; }

/* ==========================================================================
   5. Section scaffolding — gridline separators (spec H)
   ========================================================================== */
.mtr-section {
	border-bottom: 1px solid var(--mtr-line);
	padding: 76px 0;
	position: relative;
}

.mtr-section--flush { padding-bottom: 0; border-bottom: 0; }

.mtr-section--dark { background: var(--mtr-navy); color: var(--mtr-fog); }

.mtr-section--gridbg::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(6, 182, 212, .05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(6, 182, 212, .05) 1px, transparent 1px);
	background-size: 44px 44px;
	pointer-events: none;
}

.mtr-section__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 40px;
}

.mtr-kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--mtr-font-mono);
	font-size: 10.5px;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--mtr-cyan);
	margin-bottom: 12px;
}

.mtr-kicker::before { content: ""; width: 22px; height: 1px; background: var(--mtr-cyan); }

.mtr-section__head h2 { font-size: clamp(26px, 3.4vw, 40px); margin: 0; }
.mtr-section--dark .mtr-section__head h2 { color: var(--mtr-white); }

.mtr-section__sub {
	margin: 10px 0 0;
	color: var(--mtr-ink-soft);
	font-size: 15px;
	max-width: 560px;
}

.mtr-section--dark .mtr-section__sub { color: var(--mtr-mist); }

/* ==========================================================================
   6. Hero dashboard (spec B) — 2x3 metric grid + wide banner
   ========================================================================== */
.mtr-hero {
	background:
		radial-gradient(760px 420px at 85% -10%, rgba(6, 182, 212, .12), transparent 60%),
		radial-gradient(560px 360px at -5% 110%, rgba(22, 78, 99, .35), transparent 60%),
		var(--mtr-navy);
	color: var(--mtr-fog);
	padding: 56px 0 0;
	border-bottom: 1px solid var(--mtr-line);
	position: relative;
	overflow: hidden;
}

.mtr-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(6, 182, 212, .045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(6, 182, 212, .045) 1px, transparent 1px);
	background-size: 44px 44px;
	pointer-events: none;
}

.mtr-hero__intro {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	gap: 40px;
	align-items: end;
	margin-bottom: 44px;
}

.mtr-hero__intro h1 {
	font-size: clamp(34px, 4.6vw, 58px);
	color: var(--mtr-white);
	margin: 0 0 14px;
	text-transform: uppercase;
	letter-spacing: .02em;
}

.mtr-hero__intro h1 .mtr-hero__accent { color: var(--mtr-cyan); }

.mtr-hero__intro p { color: var(--mtr-mist); font-size: 16px; margin: 0; max-width: 480px; }

.mtr-hero__actions {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding-bottom: 6px;
}

.mtr-hero__note {
	font-family: var(--mtr-font-mono);
	font-size: 10.5px;
	letter-spacing: .1em;
	color: var(--mtr-mist-dim);
}

.mtr-metrics {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border: 1px solid var(--mtr-line);
	background: rgba(15, 23, 42, .55);
}

.mtr-metric {
	position: relative;
	padding: 22px 22px 0;
	min-height: 158px;
	border-right: 1px solid var(--mtr-line);
	border-bottom: 1px solid var(--mtr-line);
	display: flex;
	flex-direction: column;
	transition: background .25s;
	overflow: hidden;
}

.mtr-metric:nth-child(3n) { border-right: 0; }
.mtr-metric:nth-child(n+4) { border-bottom: 0; }

.mtr-metric:hover { background: rgba(6, 182, 212, .06); }

.mtr-metric::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 2px;
	background: var(--mtr-cyan);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .3s;
}

.mtr-metric:hover::after { transform: scaleX(1); }

.mtr-metric__top { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.mtr-metric__icon { width: 16px; height: 16px; color: var(--mtr-cyan); flex: 0 0 16px; }
.mtr-metric__icon svg { width: 100%; height: 100%; }

.mtr-metric__label {
	font-family: var(--mtr-font-mono);
	font-size: 10px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--mtr-mist);
	flex: 1 1 auto;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mtr-metric__delta { font-family: var(--mtr-font-mono); font-size: 10.5px; flex: 0 0 auto; }

.mtr-metric__value {
	font-family: var(--mtr-font-display);
	font-size: clamp(30px, 3.4vw, 44px);
	font-weight: 700;
	color: var(--mtr-white);
	letter-spacing: .01em;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.mtr-metric__chart { display: block; margin: auto -22px -2px; height: 46px; }
.mtr-metric__chart svg { width: 100%; height: 46px; display: block; }

/* Wide banner under the metric grid */
.mtr-herobanner {
	position: relative;
	overflow: hidden;
	margin-top: 34px;
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) auto;
	gap: 28px;
	align-items: center;
	padding: 30px 34px;
	border: 1px solid var(--mtr-line);
	background: linear-gradient(115deg, rgba(22, 78, 99, .55), rgba(15, 23, 42, .2) 55%, rgba(6, 182, 212, .12));
}

.mtr-herobanner::after {
	content: "";
	position: absolute;
	top: 0; bottom: 0; right: 0;
	width: 34%;
	background: repeating-linear-gradient(-45deg, transparent 0 9px, rgba(6, 182, 212, .07) 9px 10px);
	pointer-events: none;
}

.mtr-herobanner__text { position: relative; z-index: 1; }
.mtr-herobanner__text h3 { color: var(--mtr-white); font-size: clamp(19px, 2.2vw, 26px); text-transform: uppercase; margin: 6px 0 8px; }
.mtr-herobanner__text p { color: var(--mtr-mist); font-size: 14px; margin: 0; max-width: 620px; }
.mtr-herobanner__action { position: relative; z-index: 1; }
.mtr-herobanner__bg { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; opacity: .16; pointer-events: none; }

.mtr-hero__footpad { height: 56px; }

/* ==========================================================================
   7. Market table (home section 3)
   ========================================================================== */
.mtr-board {
	border: 1px solid var(--mtr-line);
	background: var(--mtr-white);
	overflow-x: auto;
}

.mtr-board table { width: 100%; border-collapse: collapse; min-width: 860px; }

.mtr-board th {
	font-family: var(--mtr-font-mono);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--mtr-mist-dim);
	text-align: left;
	padding: 14px 18px;
	border-bottom: 1px solid var(--mtr-line);
	background: rgba(241, 245, 249, .7);
	white-space: nowrap;
}

.mtr-board td {
	padding: 14px 18px;
	border-bottom: 1px solid rgba(6, 182, 212, .1);
	font-size: 14px;
	vertical-align: middle;
	white-space: nowrap;
}

.mtr-board tbody tr { transition: background .18s; }
.mtr-board tbody tr:hover { background: rgba(6, 182, 212, .05); }
.mtr-board tbody tr:last-child td { border-bottom: 0; }

.mtr-board__market { display: flex; align-items: center; gap: 12px; }

.mtr-board__code {
	width: 38px; height: 38px;
	flex: 0 0 38px;
	display: grid;
	place-items: center;
	background: var(--mtr-navy);
	color: var(--mtr-cyan);
	font-family: var(--mtr-font-mono);
	font-size: 10px;
	letter-spacing: .04em;
	clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}

.mtr-board__name { font-family: var(--mtr-font-display); font-size: 14.5px; font-weight: 700; letter-spacing: .02em; }
.mtr-board__name a:hover { color: var(--mtr-cyan); }
.mtr-board__sub { display: block; font-family: var(--mtr-font-mono); font-size: 10px; color: var(--mtr-mist-dim); letter-spacing: .06em; }

.mtr-board td.mtr-num { font-family: var(--mtr-font-mono); font-size: 12.5px; color: var(--mtr-ink-soft); }
.mtr-board__trend { width: 120px; }
.mtr-board__trend svg { width: 120px; height: 34px; display: block; }
.mtr-board__chg { font-family: var(--mtr-font-mono); font-size: 13px; font-weight: 700; }
.mtr-board__empty { padding: 40px 18px; text-align: center; color: var(--mtr-mist-dim); font-family: var(--mtr-font-mono); font-size: 12.5px; }

/* ==========================================================================
   8. Alternating 2-column insights (spec C) + horizontal cards (spec D)
   ========================================================================== */
.mtr-insights { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }

.mtr-card {
	position: relative;
	background: var(--mtr-white);
	border: 1px solid var(--mtr-line);
	padding: 26px 26px 22px;
	transition: transform .22s, box-shadow .22s, border-color .22s;
	overflow: hidden;
}

.mtr-card:hover {
	transform: translateY(-4px);
	border-color: rgba(6, 182, 212, .55);
	box-shadow: 0 14px 34px rgba(15, 23, 42, .12);
}

.mtr-card::before {
	content: "";
	position: absolute;
	top: 0; left: 0;
	width: 3px; height: 100%;
	background: linear-gradient(180deg, var(--mtr-cyan), var(--mtr-cyan-deep));
	transform: scaleY(0);
	transform-origin: top;
	transition: transform .28s;
}

.mtr-card:hover::before { transform: scaleY(1); }

.mtr-card--text { background: var(--mtr-navy); border-color: rgba(6, 182, 212, .25); color: var(--mtr-fog); }
.mtr-card--text:hover { box-shadow: 0 14px 34px rgba(15, 23, 42, .4); }

.mtr-card__deco { position: absolute; top: 18px; right: 20px; width: 120px; height: 36px; opacity: .95; pointer-events: none; }
.mtr-card__deco svg { width: 120px; height: 36px; display: block; }
.mtr-card__deco .mtr-bars { width: 84px; height: 32px; }

.mtr-card__main { position: relative; }

.mtr-card__head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding-right: 130px; }
.mtr-card__delta { font-family: var(--mtr-font-mono); font-size: 11.5px; font-weight: 700; }

.mtr-card__title { font-size: 20px; margin: 0 0 10px; line-height: 1.3; }
.mtr-card__title a:hover { color: var(--mtr-cyan); }
.mtr-card--text .mtr-card__title { color: var(--mtr-white); }
.mtr-card--text .mtr-card__title a:hover { color: var(--mtr-cyan); }

.mtr-card__excerpt { font-size: 14px; color: var(--mtr-ink-soft); margin: 0 0 16px; }
.mtr-card--text .mtr-card__excerpt { color: var(--mtr-mist); }

.mtr-card__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--mtr-font-mono);
	font-size: 10.5px;
	letter-spacing: .06em;
	color: var(--mtr-mist-dim);
}

.mtr-card--text .mtr-card__meta { color: var(--mtr-mist); }

.mtr-card__link {
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	color: var(--mtr-cyan);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .12em;
	transition: gap .2s;
}

.mtr-card__link:hover { gap: 9px; }
.mtr-card__link svg { width: 13px; height: 13px; }

.mtr-section__more { display: flex; justify-content: center; margin-top: 44px; }

/* ==========================================================================
   9. Instruments (4-col icon cards)
   ========================================================================== */
.mtr-instruments { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }

.mtr-instr {
	position: relative;
	background: var(--mtr-navy);
	border: 1px solid rgba(6, 182, 212, .3);
	padding: 28px 24px 24px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	transition: transform .22s, box-shadow .22s, border-color .22s;
	overflow: hidden;
}

.mtr-instr::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(260px 160px at 100% 0, rgba(6, 182, 212, .18), transparent 60%);
	opacity: 0;
	transition: opacity .25s;
	pointer-events: none;
}

.mtr-instr:hover { transform: translateY(-5px); border-color: var(--mtr-cyan); box-shadow: 0 16px 40px rgba(2, 8, 23, .55); }
.mtr-instr:hover::after { opacity: 1; }

.mtr-instr__icon {
	width: 52px; height: 52px;
	display: grid;
	place-items: center;
	border: 1px solid var(--mtr-cyan);
	color: var(--mtr-cyan);
	background: rgba(6, 182, 212, .08);
	clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}

.mtr-instr__icon svg { width: 24px; height: 24px; }
.mtr-instr__icon img { width: 26px; height: 26px; object-fit: contain; display: block; }

.mtr-instr h3 { color: var(--mtr-white); font-size: 19px; margin: 0; text-transform: uppercase; letter-spacing: .03em; }
.mtr-instr h3 a:hover { color: var(--mtr-cyan); }

.mtr-instr__desc { font-size: 13px; color: var(--mtr-mist); margin: 0; flex: 1 1 auto; }

.mtr-instr__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 6px; border-top: 1px solid rgba(6, 182, 212, .18); }

.mtr-instr__count { font-family: var(--mtr-font-mono); font-size: 11px; color: var(--mtr-cyan); letter-spacing: .08em; }

/* ==========================================================================
   10. Platform widgets (3-col)
   ========================================================================== */
.mtr-widgets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }

.mtr-widget {
	background: var(--mtr-white);
	border: 1px solid var(--mtr-line);
	border-top: 3px solid var(--mtr-cyan);
	padding: 26px 24px;
	position: relative;
	transition: transform .22s, box-shadow .22s;
}

.mtr-widget:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(15, 23, 42, .1); }

.mtr-widget__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }

.mtr-widget__icon { width: 40px; height: 40px; display: grid; place-items: center; background: var(--mtr-navy); color: var(--mtr-cyan); }
.mtr-widget__icon svg { width: 20px; height: 20px; }
.mtr-widget__spark { width: 84px; height: 32px; }
.mtr-widget__spark svg { width: 84px; height: 32px; display: block; }

.mtr-widget h3 { font-size: 18px; margin: 0 0 8px; text-transform: uppercase; letter-spacing: .03em; }
.mtr-widget p { font-size: 13.5px; color: var(--mtr-ink-soft); margin: 0 0 14px; }

.mtr-widget__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }

.mtr-widget__list li {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: var(--mtr-font-mono);
	font-size: 11px;
	letter-spacing: .04em;
	color: var(--mtr-ink-soft);
}

.mtr-widget__list svg { width: 13px; height: 13px; color: var(--mtr-cyan); flex: 0 0 13px; }

/* ==========================================================================
   11. Stats band (cyan) + generic CTA band
   ========================================================================== */
.mtr-stats {
	background:
		repeating-linear-gradient(90deg, transparent 0 87px, rgba(15, 23, 42, .06) 87px 88px),
		linear-gradient(120deg, var(--mtr-cyan), #22D3EE 55%, var(--mtr-cyan));
	color: var(--mtr-navy);
	padding: 64px 0;
	border-bottom: 1px solid var(--mtr-line);
}

.mtr-stats__head { text-align: center; margin-bottom: 42px; }
.mtr-stats__head .mtr-kicker { color: var(--mtr-navy); }
.mtr-stats__head .mtr-kicker::before { background: var(--mtr-navy); }
.mtr-stats__head h2 { font-size: clamp(24px, 3vw, 36px); text-transform: uppercase; margin: 0; color: var(--mtr-navy); }
.mtr-stats__head p { font-family: var(--mtr-font-mono); font-size: 11.5px; letter-spacing: .12em; margin: 8px 0 0; color: rgba(15, 23, 42, .75); }

.mtr-stats__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid rgba(15, 23, 42, .3); }

.mtr-stat {
	padding: 26px 22px;
	text-align: center;
	border-right: 1px solid rgba(15, 23, 42, .25);
	border-bottom: 1px solid rgba(15, 23, 42, .25);
}

.mtr-stat:nth-child(3n) { border-right: 0; }
.mtr-stat:nth-child(n+4) { border-bottom: 0; }

.mtr-stat__value {
	font-family: var(--mtr-font-display);
	font-size: clamp(34px, 4vw, 52px);
	font-weight: 700;
	line-height: 1;
	color: var(--mtr-navy);
	font-variant-numeric: tabular-nums;
}

.mtr-stat__label {
	display: block;
	margin-top: 10px;
	font-family: var(--mtr-font-mono);
	font-size: 10.5px;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: rgba(15, 23, 42, .8);
}

.mtr-ctaband {
	position: relative;
	background:
		radial-gradient(620px 320px at 15% 0, rgba(6, 182, 212, .18), transparent 60%),
		var(--mtr-navy);
	border: 1px solid var(--mtr-line);
	padding: 56px 48px;
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) auto;
	gap: 32px;
	align-items: center;
	overflow: hidden;
}

.mtr-ctaband::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(6, 182, 212, .05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(6, 182, 212, .05) 1px, transparent 1px);
	background-size: 40px 40px;
	pointer-events: none;
}

.mtr-ctaband__text { position: relative; }
.mtr-ctaband__text h2 { color: var(--mtr-white); font-size: clamp(24px, 3vw, 36px); text-transform: uppercase; margin: 8px 0 12px; }
.mtr-ctaband__text p { color: var(--mtr-mist); font-size: 14.5px; margin: 0; max-width: 560px; }
.mtr-ctaband__action { position: relative; display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }

/* ==========================================================================
   12. Footer (spec F) — 2-col dark with summary metrics
   ========================================================================== */
.mtr-footer {
	background:
		radial-gradient(560px 300px at 90% 0, rgba(22, 78, 99, .4), transparent 60%),
		var(--mtr-navy);
	color: var(--mtr-fog);
	margin-top: auto;
}

.mtr-footer__main {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: 56px;
	padding: 64px 0 48px;
}

.mtr-footer__brandline { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.mtr-footer__brandline .mtr-panel__mark { width: 30px; height: 30px; flex-basis: 30px; }
.mtr-footer__brandline .mtr-panel__mark svg { width: 16px; height: 16px; }
.mtr-footer__brandname { font-family: var(--mtr-font-display); font-size: 20px; letter-spacing: .08em; text-transform: uppercase; color: var(--mtr-white); }

.mtr-footer__about { font-size: 13.5px; color: var(--mtr-mist); max-width: 440px; margin: 0 0 26px; }

.mtr-footer__summary { display: flex; gap: 0; border: 1px solid var(--mtr-line); max-width: 440px; }

.mtr-footer__metric { flex: 1; padding: 16px 18px; border-right: 1px solid var(--mtr-line); }
.mtr-footer__metric:last-child { border-right: 0; }

.mtr-footer__metric b {
	display: block;
	font-family: var(--mtr-font-display);
	font-size: 24px;
	color: var(--mtr-cyan);
	font-variant-numeric: tabular-nums;
	line-height: 1.1;
}

.mtr-footer__metric span { font-family: var(--mtr-font-mono); font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--mtr-mist-dim); }

.mtr-footer__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }

.mtr-footer__col h4 {
	font-family: var(--mtr-font-mono);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--mtr-cyan);
	margin: 0 0 16px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--mtr-line);
}

.mtr-footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }

.mtr-footer__col a {
	font-size: 13px;
	color: var(--mtr-mist);
	transition: color .2s, padding-left .2s;
	display: inline-block;
}

.mtr-footer__col a:hover { color: var(--mtr-cyan); padding-left: 6px; }

.mtr-footer__cta { margin-top: 20px; }

.mtr-footer__bar { border-top: 1px solid var(--mtr-cyan); padding: 20px 0 24px; }

.mtr-footer__barinner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: wrap;
	font-family: var(--mtr-font-mono);
	font-size: 10.5px;
	letter-spacing: .08em;
	color: var(--mtr-mist-dim);
}

.mtr-footer__disclaimer { max-width: 560px; }

/* ==========================================================================
   13. Inner page scaffolding — content + right data sidebar (spec E)
   ========================================================================== */
.mtr-pagehead {
	background:
		radial-gradient(600px 300px at 90% -20%, rgba(6, 182, 212, .14), transparent 60%),
		var(--mtr-navy);
	color: var(--mtr-fog);
	border-bottom: 1px solid var(--mtr-line);
	padding: 52px 0 46px;
}

.mtr-pagehead h1 { color: var(--mtr-white); font-size: clamp(28px, 3.6vw, 44px); text-transform: uppercase; margin: 8px 0 10px; }
.mtr-pagehead p { color: var(--mtr-mist); font-size: 14.5px; margin: 0; max-width: 640px; }
.mtr-pagehead .mtr-kicker { margin-bottom: 10px; }

.mtr-layout {
	display: grid;
	grid-template-columns: minmax(0, 65fr) minmax(0, 35fr);
	gap: 40px;
	padding: 56px 0 76px;
	align-items: start;
}

.mtr-layout--full { grid-template-columns: minmax(0, 1fr); }

.mtr-content { min-width: 0; }

/* Archive loop list */
.mtr-loop { display: grid; gap: 22px; }

.mtr-loopitem {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: 24px;
	background: var(--mtr-white);
	border: 1px solid var(--mtr-line);
	padding: 20px;
	position: relative;
	transition: transform .22s, box-shadow .22s, border-color .22s;
}

.mtr-loopitem:hover { transform: translateY(-3px); border-color: rgba(6, 182, 212, .5); box-shadow: 0 12px 30px rgba(15, 23, 42, .1); }

.mtr-loopitem__thumb { position: relative; overflow: hidden; aspect-ratio: 16 / 10; background: var(--mtr-navy); }
.mtr-loopitem__thumb img, .mtr-loopitem__thumb .mtr-thumb-fallback { width: 100%; height: 100%; object-fit: cover; display: block; }
.mtr-loopitem__thumb .mtr-thumb-fallback svg { width: 100%; height: 100%; }
.mtr-thumb-fallback__svg { width: 100%; height: 100%; }
.mtr-thumb-fallback__svg svg { display: block; width: 100%; height: 100%; }

.mtr-loopitem__body { display: flex; flex-direction: column; min-width: 0; }
.mtr-loopitem__head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.mtr-loopitem__title { font-size: 21px; margin: 0 0 8px; }
.mtr-loopitem__title a:hover { color: var(--mtr-cyan); }
.mtr-loopitem__excerpt { font-size: 13.5px; color: var(--mtr-ink-soft); margin: 0 0 14px; }
.mtr-loopitem__meta { display: flex; align-items: center; gap: 10px; font-family: var(--mtr-font-mono); font-size: 10.5px; color: var(--mtr-mist-dim); margin-top: auto; }
.mtr-loopitem__meta .mtr-card__link { margin-left: auto; }

/* Pagination */
.mtr-pagination { margin-top: 44px; display: flex; justify-content: center; }

.mtr-pagination .page-numbers {
	list-style: none;
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	justify-content: center;
	margin: 0;
	padding: 0;
}

.mtr-pagination .page-numbers li { display: flex; }

.mtr-pagination .page-numbers li .page-numbers,
.mtr-pagination a.page-numbers,
.mtr-pagination span.page-numbers {
	min-width: 40px; height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 12px;
	border: 1px solid var(--mtr-line);
	background: var(--mtr-white);
	font-family: var(--mtr-font-mono);
	font-size: 12.5px;
	color: var(--mtr-ink-soft);
	transition: all .2s;
}

.mtr-pagination .page-numbers:hover { border-color: var(--mtr-cyan); color: var(--mtr-cyan); }
.mtr-pagination .page-numbers.current { background: var(--mtr-cyan); border-color: var(--mtr-cyan); color: var(--mtr-navy); font-weight: 700; }

/* Data sidebar (spec E) */
.mtr-side { display: grid; gap: 24px; position: sticky; top: 84px; }

.mtr-sidewidget {
	background: var(--mtr-white);
	border: 1px solid var(--mtr-line);
	position: relative;
}

.mtr-sidewidget--dark { background: var(--mtr-navy); border-color: rgba(6, 182, 212, .3); color: var(--mtr-fog); }

.mtr-sidewidget__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 14px 18px;
	border-bottom: 1px solid var(--mtr-line);
	font-family: var(--mtr-font-mono);
	font-size: 10px;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--mtr-cyan);
}

.mtr-sidewidget--dark .mtr-sidewidget__head { border-bottom-color: rgba(6, 182, 212, .25); }

.mtr-sidewidget__head .mtr-status__dot { width: 6px; height: 6px; }

.mtr-sidewidget__body { padding: 18px; }

.mtr-datarow {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px dashed rgba(6, 182, 212, .2);
	font-size: 13px;
}

.mtr-datarow:last-child { border-bottom: 0; }
.mtr-datarow__k { font-family: var(--mtr-font-mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--mtr-mist-dim); }
.mtr-sidewidget--dark .mtr-datarow__k { color: var(--mtr-mist); }
.mtr-datarow__v { font-family: var(--mtr-font-mono); font-size: 12.5px; color: var(--mtr-ink); text-align: right; }
.mtr-sidewidget--dark .mtr-datarow__v { color: var(--mtr-white); }
.mtr-datarow__v a:hover { color: var(--mtr-cyan); }

.mtr-sidechart { display: block; height: 52px; margin: 4px 0 10px; }
.mtr-sidechart svg { width: 100%; height: 52px; display: block; }

.mtr-poplist { list-style: none; margin: 0; padding: 0; counter-reset: mtrpop; display: grid; gap: 14px; }

.mtr-poplist li { counter-increment: mtrpop; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; align-items: start; }

.mtr-poplist li::before {
	content: counter(mtrpop, decimal-leading-zero);
	font-family: var(--mtr-font-mono);
	font-size: 12px;
	color: var(--mtr-cyan);
	border: 1px solid var(--mtr-line);
	display: grid;
	place-items: center;
	height: 30px;
	background: rgba(6, 182, 212, .05);
}

.mtr-poplist a { font-family: var(--mtr-font-display); font-size: 14px; font-weight: 700; line-height: 1.35; display: block; }
.mtr-poplist a:hover { color: var(--mtr-cyan); }
.mtr-poplist span { display: block; font-family: var(--mtr-font-mono); font-size: 10px; color: var(--mtr-mist-dim); margin-top: 4px; letter-spacing: .06em; }

.mtr-authorbox { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 14px; align-items: start; }

.mtr-avatar {
	width: 52px; height: 52px;
	display: grid;
	place-items: center;
	background: linear-gradient(135deg, var(--mtr-cyan), var(--mtr-cyan-deep));
	color: var(--mtr-navy);
	font-family: var(--mtr-font-display);
	font-size: 18px;
	font-weight: 700;
	clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}

.mtr-authorbox__name { font-family: var(--mtr-font-display); font-size: 15px; font-weight: 700; margin: 0 0 4px; }
.mtr-authorbox__bio { font-size: 12.5px; color: var(--mtr-ink-soft); margin: 0; }
.mtr-sidewidget--dark .mtr-authorbox__bio { color: var(--mtr-mist); }

.mtr-sidecta { text-align: left; }
.mtr-sidecta h4 { color: var(--mtr-white); font-size: 16px; text-transform: uppercase; margin: 0 0 8px; }
.mtr-sidecta p { font-size: 12.5px; color: var(--mtr-mist); margin: 0 0 16px; font-family: var(--mtr-font-mono); }

.mtr-tagcloud { display: flex; flex-wrap: wrap; gap: 8px; }
.mtr-tagcloud a { transition: all .2s; }
.mtr-tagcloud a:hover { background: var(--mtr-cyan); color: var(--mtr-navy); border-color: var(--mtr-cyan); }

/* ==========================================================================
   14. Single post
   ========================================================================== */
.mtr-single__meta {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	font-family: var(--mtr-font-mono);
	font-size: 11px;
	letter-spacing: .08em;
	color: var(--mtr-mist);
	margin-bottom: 22px;
}

.mtr-single__meta .mtr-avatar { width: 34px; height: 34px; font-size: 13px; }

.mtr-single__thumb { margin: 0 0 30px; border: 1px solid var(--mtr-line); overflow: hidden; background: var(--mtr-navy); }
.mtr-single__thumb img, .mtr-single__thumb .mtr-thumb-fallback { display: block; width: 100%; }
.mtr-single__thumb .mtr-thumb-fallback svg { width: 100%; display: block; }

.mtr-entry { font-size: 16.5px; line-height: 1.85; color: #1E293B; }
.mtr-entry h2 { font-size: 26px; margin: 1.6em 0 .6em; text-transform: uppercase; }
.mtr-entry h3 { font-size: 20px; margin: 1.4em 0 .5em; }
.mtr-entry a { color: var(--mtr-cyan-deep); border-bottom: 1px solid var(--mtr-line); }
.mtr-entry a:hover { color: var(--mtr-cyan); border-color: var(--mtr-cyan); }
.mtr-entry blockquote {
	margin: 1.6em 0;
	padding: 18px 22px;
	border-left: 3px solid var(--mtr-cyan);
	background: rgba(6, 182, 212, .06);
	font-family: var(--mtr-font-display);
	font-size: 17px;
	color: var(--mtr-navy);
}
.mtr-entry blockquote p:last-child { margin: 0; }
.mtr-entry code, .mtr-entry pre {
	font-family: var(--mtr-font-mono);
	font-size: .86em;
	background: var(--mtr-navy);
	color: #7DD3FC;
}
.mtr-entry code { padding: 2px 6px; }
.mtr-entry pre { padding: 18px; overflow-x: auto; border: 1px solid var(--mtr-line); }
.mtr-entry pre code { background: transparent; padding: 0; }
.mtr-entry table { width: 100%; border-collapse: collapse; margin: 1.5em 0; font-size: 14px; }
.mtr-entry th, .mtr-entry td { border: 1px solid var(--mtr-line); padding: 10px 14px; text-align: left; }
.mtr-entry th { background: var(--mtr-navy); color: var(--mtr-white); font-family: var(--mtr-font-display); letter-spacing: .04em; }
.mtr-entry img { border: 1px solid var(--mtr-line); }
.mtr-entry ul, .mtr-entry ol { padding-left: 1.4em; }
.mtr-entry li { margin-bottom: .4em; }

.mtr-postfooter { margin-top: 36px; padding-top: 22px; border-top: 1px solid var(--mtr-line); display: grid; gap: 18px; }

.mtr-postnav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 30px; }

.mtr-postnav a {
	display: block;
	padding: 18px 20px;
	border: 1px solid var(--mtr-line);
	background: var(--mtr-white);
	transition: border-color .2s, transform .2s;
}

.mtr-postnav a:hover { border-color: var(--mtr-cyan); transform: translateY(-2px); }
.mtr-postnav span { display: block; font-family: var(--mtr-font-mono); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--mtr-cyan); margin-bottom: 6px; }
.mtr-postnav strong { font-family: var(--mtr-font-display); font-size: 14.5px; line-height: 1.35; display: block; }
.mtr-postnav--next { text-align: right; }

.mtr-endcta {
	margin-top: 34px;
	padding: 30px 28px;
	background: var(--mtr-navy);
	border: 1px solid rgba(6, 182, 212, .35);
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 22px;
	align-items: center;
	position: relative;
	overflow: hidden;
}

.mtr-endcta::after {
	content: "";
	position: absolute;
	right: 0; top: 0; bottom: 0;
	width: 30%;
	background: repeating-linear-gradient(-45deg, transparent 0 8px, rgba(6, 182, 212, .08) 8px 9px);
	pointer-events: none;
}

.mtr-endcta h3 { color: var(--mtr-white); font-size: 20px; text-transform: uppercase; margin: 0 0 6px; }
.mtr-endcta p { color: var(--mtr-mist); font-size: 13px; margin: 0; }

.mtr-comments { margin-top: 44px; }
.mtr-comments h3 { font-size: 20px; text-transform: uppercase; }
.mtr-comments .comment-list { list-style: none; margin: 0 0 26px; padding: 0; display: grid; gap: 16px; }
.mtr-comments .comment { border: 1px solid var(--mtr-line); background: var(--mtr-white); padding: 18px 20px; }
.mtr-comments .comment .children { list-style: none; margin: 14px 0 0; padding-left: 24px; border-left: 1px dashed var(--mtr-line); }
.mtr-comments .comment-author { font-family: var(--mtr-font-display); font-size: 14px; }
.mtr-comments .comment-metadata { font-family: var(--mtr-font-mono); font-size: 10.5px; color: var(--mtr-mist-dim); margin-bottom: 8px; }
.mtr-comments .comment-metadata a { color: var(--mtr-mist-dim); }
.mtr-comments .reply { font-family: var(--mtr-font-mono); font-size: 11px; }
.mtr-comments .reply a { color: var(--mtr-cyan-deep); }
.mtr-comments .comment-respond { border: 1px solid var(--mtr-line); background: var(--mtr-white); padding: 22px; }
.mtr-comments .comment-form-comment, .mtr-comments .comment-form-author, .mtr-comments .comment-form-email, .mtr-comments .comment-form-url { display: grid; gap: 6px; margin-bottom: 14px; }
.mtr-comments input[type="text"], .mtr-comments input[type="email"], .mtr-comments input[type="url"], .mtr-comments textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid var(--mtr-line);
	background: var(--mtr-fog);
	font-family: var(--mtr-font-mono);
	font-size: 13px;
	color: var(--mtr-ink);
}
.mtr-comments input:focus, .mtr-comments textarea:focus { outline: 2px solid var(--mtr-cyan); outline-offset: -1px; }
.mtr-comments .form-submit .submit {
	background: var(--mtr-cyan);
	color: var(--mtr-navy);
	border: 0;
	padding: 11px 26px;
	font-family: var(--mtr-font-display);
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	cursor: pointer;
}
.mtr-comments p.comment-notes, .mtr-comments p.logged-in-as { font-family: var(--mtr-font-mono); font-size: 11px; color: var(--mtr-mist-dim); }
.mtr-nocomments { font-family: var(--mtr-font-mono); font-size: 12.5px; color: var(--mtr-mist-dim); border: 1px dashed var(--mtr-line); padding: 18px; }

/* ==========================================================================
   15. Page template, search, 404
   ========================================================================== */
.mtr-pagebody { background: var(--mtr-white); border: 1px solid var(--mtr-line); padding: 34px 36px; }
.mtr-pagebody .mtr-entry { font-size: 16px; }
.mtr-pageupdated { font-family: var(--mtr-font-mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--mtr-mist-dim); margin-top: 26px; padding-top: 16px; border-top: 1px solid var(--mtr-line); }

.mtr-searchform { display: flex; gap: 0; max-width: 640px; }

.mtr-searchform label { flex: 1 1 auto; display: flex; }

.mtr-searchform input[type="search"] {
	width: 100%;
	padding: 13px 16px;
	border: 1px solid var(--mtr-line);
	border-right: 0;
	background: var(--mtr-white);
	font-family: var(--mtr-font-mono);
	font-size: 13px;
	color: var(--mtr-ink);
}

.mtr-searchform input[type="search"]:focus { outline: 2px solid var(--mtr-cyan); outline-offset: -2px; }

.mtr-searchform button {
	flex: 0 0 auto;
	padding: 13px 26px;
	background: var(--mtr-cyan);
	border: 1px solid var(--mtr-cyan);
	color: var(--mtr-navy);
	font-family: var(--mtr-font-display);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .12em;
	text-transform: uppercase;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	transition: background .2s;
}

.mtr-searchform button:hover { background: #22D3EE; }
.mtr-searchform button svg { width: 15px; height: 15px; }

.mtr-searchhead { margin-bottom: 34px; }
.mtr-searchhead .mtr-searchform { margin: 0; }
.mtr-404__search { margin: 0 auto 30px; max-width: 560px; }
.mtr-404__search .mtr-searchform { max-width: none; }

.mtr-empty {
	border: 1px dashed var(--mtr-line);
	background: rgba(6, 182, 212, .04);
	padding: 60px 30px;
	text-align: center;
	font-family: var(--mtr-font-mono);
	font-size: 13px;
	color: var(--mtr-mist-dim);
	letter-spacing: .06em;
}

.mtr-404 { text-align: center; padding: 90px 0 110px; }

.mtr-404__code {
	font-family: var(--mtr-font-display);
	font-size: clamp(100px, 18vw, 220px);
	font-weight: 700;
	line-height: .9;
	color: var(--mtr-navy);
	position: relative;
	display: inline-block;
}

.mtr-404__code::after {
	content: "";
	position: absolute;
	left: -8%; right: -8%;
	top: 52%;
	height: 3px;
	background: var(--mtr-cyan);
	transform: rotate(-4deg);
}

.mtr-404__tag { display: block; font-family: var(--mtr-font-mono); font-size: 12px; letter-spacing: .4em; text-transform: uppercase; color: var(--mtr-cyan); margin: 18px 0 10px; }
.mtr-404 h1 { font-size: clamp(24px, 3vw, 34px); text-transform: uppercase; margin-bottom: 12px; }
.mtr-404 p { color: var(--mtr-ink-soft); font-size: 14.5px; max-width: 520px; margin: 0 auto 30px; }
.mtr-404__spark { width: 280px; margin: 0 auto 34px; display: block; }
.mtr-404__spark svg { width: 100%; height: 44px; }

/* ==========================================================================
   16. Animations
   ========================================================================== */
.mtr-reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s ease; }
.mtr-reveal.mtr-inview { opacity: 1; transform: none; }

/* JS pointer-driven scanline glow on data panels */
.mtr-metric, .mtr-widget, .mtr-instr { --mtr-mx: 50%; --mtr-my: 50%; }

.mtr-metric.mtr-hover::before,
.mtr-widget.mtr-hover::before,
.mtr-instr.mtr-hover::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(220px 140px at var(--mtr-mx) var(--mtr-my), rgba(6, 182, 212, .14), transparent 70%);
	pointer-events: none;
	z-index: 0;
}

.mtr-widget.mtr-hover::before { z-index: 0; }
.mtr-metric.mtr-hover > *, .mtr-widget.mtr-hover > *, .mtr-instr.mtr-hover > * { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.mtr-reveal { opacity: 1; transform: none; transition: none; }
	.mtr-status__dot { animation: none; }
	*, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ==========================================================================
   17. Responsive
   ========================================================================== */
@media (max-width: 1180px) {
	.mtr-wrap { padding: 0 26px; }
	.mtr-topbar { padding: 12px 26px; }
	.mtr-layout { grid-template-columns: minmax(0, 1fr); }
	.mtr-side { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); display: grid; }
	.mtr-instruments { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 960px) {
	.mtr-panel {
		transform: translateX(-100%);
		transition: transform .3s ease;
		width: 270px;
		box-shadow: none;
	}
	body.mtr-panel-open .mtr-panel { transform: translateX(0); box-shadow: 24px 0 60px rgba(2, 8, 23, .5); }
	.mtr-panel__close { display: inline-flex; }
	.mtr-panel__scrim {
		display: block;
		position: fixed;
		inset: 0;
		z-index: 85;
		background: rgba(2, 8, 23, .6);
		opacity: 0;
		pointer-events: none;
		transition: opacity .3s;
	}
	body.mtr-panel-open .mtr-panel__scrim { opacity: 1; pointer-events: auto; }
	.mtr-main { margin-left: 0; }
	.mtr-burger { display: inline-flex; }
	.mtr-hero__intro { grid-template-columns: minmax(0, 1fr); align-items: start; }
	.mtr-metrics { grid-template-columns: repeat(2, 1fr); }
	.mtr-metric { border-right: 1px solid var(--mtr-line); }
	.mtr-metric:nth-child(3n) { border-right: 1px solid var(--mtr-line); }
	.mtr-metric:nth-child(2n) { border-right: 0; }
	.mtr-metric:nth-child(n+4) { border-bottom: 1px solid var(--mtr-line); }
	.mtr-metric:nth-child(n+5) { border-bottom: 0; }
	.mtr-herobanner { grid-template-columns: minmax(0, 1fr); }
	.mtr-widgets { grid-template-columns: minmax(0, 1fr); }
	.mtr-ctaband { grid-template-columns: minmax(0, 1fr); padding: 40px 30px; }
	.mtr-footer__main { grid-template-columns: minmax(0, 1fr); gap: 40px; }
	.mtr-insights { grid-template-columns: minmax(0, 1fr); }
	.mtr-stats__grid { grid-template-columns: repeat(2, 1fr); }
	.mtr-stat { border-right: 1px solid rgba(15, 23, 42, .25); border-bottom: 1px solid rgba(15, 23, 42, .25); }
	.mtr-stat:nth-child(3n) { border-right: 1px solid rgba(15, 23, 42, .25); }
	.mtr-stat:nth-child(2n) { border-right: 0; }
	.mtr-stat:nth-child(n+4) { border-bottom: 1px solid rgba(15, 23, 42, .25); }
	.mtr-stat:nth-child(n+5) { border-bottom: 0; }
}

@media (max-width: 680px) {
	.mtr-wrap { padding: 0 18px; }
	.mtr-topbar { padding: 10px 18px; }
	.mtr-section { padding: 54px 0; }
	.mtr-metrics { grid-template-columns: minmax(0, 1fr); }
	.mtr-metric { border-right: 0 !important; border-bottom: 1px solid var(--mtr-line) !important; }
	.mtr-metric:last-child { border-bottom: 0 !important; }
	.mtr-instruments { grid-template-columns: minmax(0, 1fr); }
	.mtr-side { grid-template-columns: minmax(0, 1fr); }
	.mtr-loopitem { grid-template-columns: minmax(0, 1fr); }
	.mtr-postnav { grid-template-columns: minmax(0, 1fr); }
	.mtr-postnav--next { text-align: left; }
	.mtr-endcta { grid-template-columns: minmax(0, 1fr); }
	.mtr-stats__grid { grid-template-columns: minmax(0, 1fr); }
	.mtr-stat { border-right: 0 !important; border-bottom: 1px solid rgba(15, 23, 42, .25) !important; }
	.mtr-stat:last-child { border-bottom: 0 !important; }
	.mtr-footer__links { grid-template-columns: minmax(0, 1fr); gap: 26px; }
	.mtr-footer__summary { flex-direction: column; }
	.mtr-footer__metric { border-right: 0; border-bottom: 1px solid var(--mtr-line); }
	.mtr-footer__metric:last-child { border-bottom: 0; }
	.mtr-card__head { padding-right: 0; flex-wrap: wrap; }
	.mtr-card__deco { opacity: .35; }
	.mtr-pagebody { padding: 24px 20px; }
	.mtr-topbar__crumb span { max-width: 46vw; }
}

/* WordPress core alignments */
.alignleft { float: left; margin: 6px 22px 12px 0; }
.alignright { float: right; margin: 6px 0 12px 22px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignwide { max-width: 1100px; margin-left: auto; margin-right: auto; }
.alignfull { margin-left: calc(-1 * min(36px, 4vw)); margin-right: calc(-1 * min(36px, 4vw)); max-width: none; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-family: var(--mtr-font-mono); font-size: 11px; color: var(--mtr-mist-dim); text-align: center; padding: 8px 0; }
.sticky { display: block; }
.bypostauthor { display: block; }
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* ==== breadcrumb (added by automation) ==== */
.mtr-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:.5em;font-size:.85rem;line-height:1.4;margin:0 0 1.1rem;opacity:.9}
.mtr-crumb a{color:inherit;text-decoration:none}
.mtr-crumb a:hover{text-decoration:underline}
.mtr-crumb .mtr-sep{opacity:.45}
.mtr-crumb .mtr-current{font-weight:600}
.mtr-crumb-bar{padding-top:16px}
