/* OTCN Blog — main.css (generated from assets/css/src; edit the sources). */
/* ==========================================================================
   OTCN Blog — base: fonts, tokens, reset, layout shell, shared components.
   Values are lifted 1:1 from the Claude Design source (OTCN Blog.dc.html).
   ========================================================================== */

/* Sora (OFL), self-hosted. Variable weight 400–800. */
@font-face {
	font-family: 'Sora';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url(../fonts/sora-latin-ext.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Sora';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url(../fonts/sora-latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Satoshi (ITF Free Font License), self-hosted — otcn.com header/footer typeface. */
@font-face {
	font-family: 'Satoshi';
	font-style: normal;
	font-weight: 300 900;
	font-display: swap;
	src: url(../fonts/satoshi-variable.woff2) format('woff2');
}

:root {
	--ot-orange: #F54A14;
	--ot-orange-hover: #FF5A24;
	--ot-green: #27E9A6;
	--ot-red: #FF4D6D;
	--ot-teal: #84E9E8;
	--ot-white: #FFFFFF;
	--ot-text: #F4F7F8;
	--ot-muted: #C5C9CC;
	--ot-dim: #5E666A;
	--ot-faint: #3A4043;
	--ot-bg: #0A0B0C;
	--ot-surface: #0E0F10;
	--ot-raised: #191D1E;
	--ot-line: rgba(255, 255, 255, .12);
	--ot-line-strong: rgba(255, 255, 255, .1);
	--ot-line-mid: rgba(255, 255, 255, .08);
	--ot-line-soft: rgba(255, 255, 255, .06);
	--ot-font: 'Sora', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--ot-font-ui: 'Satoshi', 'Sora', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--ot-max: 1296px;
	--ot-gutter: clamp(16px, 5vw, 72px);
}

/* Reset (design helmet styles) ------------------------------------------ */
html { background: var(--ot-bg); }
body {
	margin: 0;
	background: var(--ot-bg);
	color: var(--ot-text);
	font-family: var(--ot-font);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
*, *::before, *::after { box-sizing: border-box; }
a { color: var(--ot-text); text-decoration: none; }
a:hover { color: var(--ot-white); }
input, button, select, textarea { font-family: inherit; }
input::placeholder { color: var(--ot-dim); }
::selection { background: var(--ot-orange); color: var(--ot-white); }
img { max-width: 100%; height: auto; }
ul.ot-list-reset, ol.ot-list-reset { list-style: none; margin: 0; padding: 0; }
button { cursor: pointer; }

/* Accessibility --------------------------------------------------------- */
.ot-sr-only,
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.ot-skip-link:focus {
	position: fixed !important;
	top: 8px;
	left: 8px;
	z-index: 100000;
	width: auto;
	height: auto;
	margin: 0;
	padding: 10px 16px;
	clip: auto;
	border-radius: 10px;
	background: var(--ot-orange);
	color: var(--ot-white);
	font-size: 13px;
	font-weight: 700;
	white-space: normal;
}
/* Keyboard focus only; mouse users see the design unchanged. */
:focus-visible {
	outline: 2px solid var(--ot-orange);
	outline-offset: 2px;
	border-radius: 4px;
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Shell ----------------------------------------------------------------- */
.ot-site {
	position: relative;
	min-height: 100vh;
	background: linear-gradient(180deg, #0E0F10 0%, #0A0B0C 100%);
	color: var(--ot-text);
	font-family: var(--ot-font);
	overflow: clip;
}
.ot-site__glow {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(760px 520px at 92% -6%, rgba(245, 74, 20, .28) 0%, rgba(245, 74, 20, 0) 62%),
		radial-gradient(620px 520px at -10% 48%, rgba(132, 233, 232, .12) 0%, rgba(132, 233, 232, 0) 62%),
		radial-gradient(560px 460px at 60% 108%, rgba(245, 74, 20, .12) 0%, rgba(245, 74, 20, 0) 62%);
}
.ot-site__inner { position: relative; }

.ot-container {
	max-width: var(--ot-max);
	margin: 0 auto;
	padding-left: var(--ot-gutter);
	padding-right: var(--ot-gutter);
}
.ot-main {
	max-width: var(--ot-max);
	margin: 0 auto;
	padding: 40px var(--ot-gutter) 96px;
}

/* Shared text styles ---------------------------------------------------- */
.ot-eyebrow {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--ot-orange);
}
.ot-eyebrow--dim { color: var(--ot-dim); }

/* "Open →", "Economic Calendar →", "All Research →" */
.ot-link-accent {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: -0.24px;
	color: var(--ot-orange);
	white-space: nowrap;
}
.ot-link-accent:hover { color: var(--ot-orange); }

/* Buttons --------------------------------------------------------------- */
.ot-btn {
	height: 38px;
	display: inline-flex;
	align-items: center;
	padding: 0 16px;
	border: 0;
	border-radius: 12px;
	background: var(--ot-orange);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: -0.24px;
	color: var(--ot-text);
	white-space: nowrap;
}
.ot-btn:hover { background: var(--ot-orange-hover); color: var(--ot-text); }
/* Header + tool CTAs also brighten the label on hover (design style-hover). */
.ot-btn--bright:hover { color: var(--ot-white); }

/* Chips: section filters, tool tabs ------------------------------------- */
.ot-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 20px;
	max-width: 100%;
}
.ot-chip {
	appearance: none;
	border: 0;
	height: 34px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	background: transparent;
	color: var(--ot-dim);
	box-shadow: none;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: -0.24px;
	white-space: nowrap;
	cursor: pointer;
	transition: color .15s;
}
.ot-chip:hover { color: var(--ot-dim); }
.ot-chip.is-active,
.ot-chip[aria-pressed="true"],
.ot-chip[aria-current] {
	color: var(--ot-text);
	box-shadow: inset 0 -2px 0 0 var(--ot-orange);
}
.ot-chip--clear,
.ot-chip--clear:hover {
	color: var(--ot-orange);
	font-weight: 700;
}

/* Cover image frame (design <image-slot>) -------------------------------- */
.ot-cover {
	position: relative;
	display: block;
	border-radius: 10px;
	overflow: hidden;
	background: var(--ot-surface);
}
.ot-cover--16x9 { aspect-ratio: 1200 / 630; }
.ot-cover--16x10 { aspect-ratio: 1200 / 630; }
.ot-cover__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
/* Empty slot: same tint as the design's image-slot frame, without editing chrome. */
.ot-cover__empty {
	position: absolute;
	inset: 0;
	background: rgba(127, 127, 127, .08);
}

/* Page hero: eyebrow + h1 + blurb (+ image | chips) ---------------------- */
.ot-page-hero {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px 40px;
	padding-bottom: 28px;
}
.ot-page-hero__text {
	flex: 1 1 380px;
	min-width: 0;
}
.ot-page-hero__title {
	margin: 10px 0 0;
	font-size: clamp(26px, 2.6vw, 36px);
	line-height: 1.12;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--ot-white);
	text-wrap: balance;
}
.ot-page-hero__blurb {
	margin: 14px 0 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ot-muted);
	max-width: 580px;
	text-wrap: pretty;
}
.ot-page-hero__blurb p { margin: 0; }
.ot-page-hero__blurb p + p { margin-top: 8px; }
.ot-page-hero__meta {
	margin-top: 14px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 10px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-dim);
}
.ot-page-hero__cta { margin-top: 20px; }
.ot-page-hero__media {
	flex: 0 1 380px;
	min-width: 220px;
	position: relative;
	margin: -24px 0 -16px;
}
.ot-page-hero__media img {
	display: block;
	width: 100%;
	height: auto;
	filter: drop-shadow(0 30px 50px rgba(0, 0, 0, .6));
}

/* Breadcrumbs from Yoast / Rank Math (only printed when the plugin is on). */
.ot-breadcrumbs {
	margin: 0 0 12px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-dim);
}
.ot-breadcrumbs a { color: var(--ot-muted); }
.ot-breadcrumbs a:hover { color: var(--ot-text); }

/* Section heading row ("Latest" … "All · 11 articles") ------------------ */
.ot-section-head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	padding-bottom: 20px;
}
.ot-section-head__title {
	margin: 0;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.28px;
	color: var(--ot-text);
}
.ot-section-head__meta {
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-dim);
}

/* Bottom "See all Analysis" / pagination row ---------------------------- */
.ot-see-all {
	display: block;
	text-align: center;
	margin-top: 40px;
	padding: 16px 0;
	border-top: 1px solid var(--ot-line-mid);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: -0.24px;
	color: var(--ot-orange);
}
.ot-see-all:hover { color: var(--ot-orange); }

/* Empty state ("Nothing here matches that filter.") --------------------- */
.ot-empty {
	border-top: 1px solid var(--ot-line);
	padding: 36px 0;
	color: var(--ot-muted);
	font-size: 13px;
	display: flex;
	gap: 14px;
	align-items: baseline;
	flex-wrap: wrap;
}
.ot-empty p { margin: 0; }
.ot-empty__action {
	color: var(--ot-orange);
	font-size: 12px;
	font-weight: 700;
}
.ot-empty__action:hover { color: var(--ot-orange); }

/* Related list rows (tool pages "From Research", single "More from") ----- */
.ot-related {
	margin-top: 44px;
	border-top: 1px solid var(--ot-line);
}
.ot-related__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	padding: 12px 0;
	border-bottom: 1px solid var(--ot-line-mid);
}
.ot-related__label {
	margin: 0;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .2px;
	color: var(--ot-dim);
}
.ot-related__list { list-style: none; margin: 0; padding: 0; }
.ot-related__row {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 20px;
	align-items: center;
	padding: 18px 0;
	border-bottom: 1px solid var(--ot-line-soft);
	color: var(--ot-text);
	transition: color .15s;
}
.ot-related__row:hover { color: var(--ot-white); }
.ot-related__meta {
	flex: 0 0 132px;
	display: flex;
	flex-direction: column;
	gap: 3px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-dim);
}
.ot-related__date { color: var(--ot-muted); }
.ot-related__title {
	flex: 1 1 300px;
	min-width: 0;
	margin: 0;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -0.3px;
	text-wrap: pretty;
}
.ot-related__title a { color: inherit; }
/* Whole row is clickable; the title link carries the semantics. */
.ot-related__title a::after {
	content: '';
	position: absolute;
	inset: 0;
}
.ot-related__read {
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-dim);
	white-space: nowrap;
}

/* ==========================================================================
   Header: price ticker, otcn.com site header (menu bar + dropdowns, language
   popover, mobile menu dialog, bottom tab bar), search form, Research tabs +
   mega menu, Insights tool strip.
   ========================================================================== */

/* Price ticker ------------------------------------------------------------ */
.ot-ticker { border-bottom: 1px solid var(--ot-line-soft); }
.ot-ticker__inner {
	max-width: var(--ot-max);
	margin: 0 auto;
	padding: 0 var(--ot-gutter);
	height: 36px;
	display: flex;
	align-items: center;
	gap: 16px;
}
.ot-ticker__list {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	align-items: center;
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
	-webkit-mask-image: linear-gradient(to right, #000 90%, transparent);
	mask-image: linear-gradient(to right, #000 90%, transparent);
}
.ot-ticker__item {
	display: flex;
	align-items: baseline;
	gap: 8px;
	padding-right: 20px;
	margin-right: 20px;
	border-right: 1px solid var(--ot-line-mid);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: -0.24px;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}
.ot-ticker__sym { color: var(--ot-muted); }
.ot-ticker__px { color: var(--ot-text); }
.ot-ticker__chg { color: var(--ot-red); font-weight: 700; }
.ot-ticker__chg--up { color: var(--ot-green); }
.ot-ticker__note {
	flex: none;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .4px;
	color: var(--ot-dim);
	white-space: nowrap;
}

/* Site header (otcn.com) ------------------------------------------------------
   Values from otcn.com's computed styles. Breakpoints as otcn.com:
   64rem = 1024px (lg), 80rem = 1280px (xl: desktop menu), 90rem = 1440px,
   96rem = 1536px. Header, mobile menu and tab bar use Satoshi without forced
   font smoothing, as on otcn.com. */
.ot-hdr,
.ot-mm,
.ot-tabbar {
	color: var(--ot-text);
	font-family: var(--ot-font-ui);
	font-size: 16px;
	line-height: 24px;
	-webkit-font-smoothing: auto;
	-moz-osx-font-smoothing: auto;
}
/* Icons from otcn_blog_icon(): size and colour come from the context. */
.ot-icon {
	flex: none;
	display: block;
}
.ot-hdr {
	position: sticky;
	top: 0;
	z-index: 50;
	width: 100%;
	border-bottom: 1px solid transparent;
	background: var(--ot-surface);
}
.admin-bar .ot-hdr { top: var(--wp-admin--admin-bar--height, 0px); }
/* The admin bar scrolls away on small screens. */
@media (max-width: 600px) {
	.admin-bar .ot-hdr { top: 0; }
}
.ot-hdr.is-scrolled {
	border-bottom-color: rgba(58, 64, 67, .4);
	background: rgba(14, 15, 16, .92);
	box-shadow: 0 12px 32px rgba(0, 0, 0, .22);
	-webkit-backdrop-filter: blur(24px);
	backdrop-filter: blur(24px);
}
.ot-hdr__inner {
	max-width: 1656px;
	height: 60px;
	margin: 0 auto;
	padding: 0 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

/* Logo + badge. */
.ot-hdr__brand {
	flex: none;
	display: flex;
	align-items: flex-start;
}
.ot-hdr__home,
.ot-hdr__brand .custom-logo-link { display: block; }
.ot-hdr__logo,
.ot-hdr__brand .custom-logo {
	display: block;
	width: auto;
	height: 24px;
	transform: translateY(2px);
}
.ot-hdr__badge {
	display: inline-flex;
	margin-left: 6px;
	font-family: var(--ot-font);
	font-size: 7px;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ot-orange);
}

/* Menu bar (from 1280px). */
.ot-hdr__nav {
	display: none;
	flex: 1 1 0%;
	padding-left: 16px;
}
.ot-hdr__list {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ot-hdr__item { position: relative; }
.ot-hdr__link {
	position: relative;
	display: flex;
	align-items: center;
	gap: 4px;
	height: 32px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -.01em;
	color: var(--ot-text);
	white-space: nowrap;
	transition: color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-hdr__link::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
	height: 2px;
	background: var(--ot-orange);
}
.ot-hdr__link:hover { color: var(--ot-white); }
.ot-hdr__item.is-active > .ot-hdr__link { color: var(--ot-orange); }
.ot-hdr__item.is-active > .ot-hdr__link::after { width: 100%; }
.ot-hdr__chevron {
	width: 14px;
	height: 14px;
	transition: transform .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-hdr__link[aria-expanded="true"] .ot-hdr__chevron { transform: rotate(180deg); }

/* Pill link (menu item class ot-pill: Futures). */
.ot-hdr__pill,
.ot-hdr__pill:hover {
	display: flex;
	align-items: center;
	gap: 6px;
	height: 28px;
	padding: 2px 6px 2px 9px;
	border: 1px solid var(--ot-orange);
	border-radius: 9999px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -.01em;
	color: var(--ot-text);
	white-space: nowrap;
	transition: background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-hdr__pill:hover,
.ot-hdr__item.is-active > .ot-hdr__pill { background: var(--ot-orange); }
.ot-hdr__pill .ot-icon {
	width: 14px;
	height: 14px;
	stroke-width: 2.2;
}
.ot-hdr__pill-badge {
	display: inline-flex;
	flex: none;
	align-items: center;
	padding: 2px 6px;
	border-radius: 9999px;
	background: var(--ot-orange);
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	color: var(--ot-text);
	transition: background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-hdr__pill:hover .ot-hdr__pill-badge,
.ot-hdr__item.is-active > .ot-hdr__pill .ot-hdr__pill-badge {
	background: var(--ot-text);
	color: var(--ot-orange);
}

/* Login / Register, language, menu button. */
.ot-hdr__actions {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 8px;
}
.ot-hdr__btn {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 32px;
	padding: 0 12px;
	border-radius: 12px;
	font-size: 12px;
	line-height: 18px;
	white-space: nowrap;
	transition: background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-hdr__btn--login,
.ot-hdr__btn--login:hover {
	min-width: 64px;
	border: 1px solid rgba(255, 255, 255, .9);
	font-weight: 600;
	color: var(--ot-white);
}
.ot-hdr__btn--login:hover { background: rgba(255, 255, 255, .1); }
.ot-hdr__btn--register,
.ot-hdr__btn--register:hover {
	min-width: 72px;
	background: var(--ot-orange);
	font-weight: 700;
	color: var(--ot-text);
}
.ot-hdr__btn--register:hover { background: #E63510; }
.ot-hdr__burger {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--ot-white);
}
.ot-hdr__burger .ot-icon {
	width: 24px;
	height: 24px;
}

@media (min-width: 64rem) {
	.ot-hdr__inner { padding: 0 24px; }
	.ot-hdr__logo,
	.ot-hdr__brand .custom-logo { transform: none; }
}
@media (min-width: 80rem) {
	.ot-hdr__logo,
	.ot-hdr__brand .custom-logo { height: 28px; }
	.ot-hdr__badge { margin-left: 8px; }
	.ot-hdr__nav { display: block; }
	.ot-hdr__actions {
		margin-left: 0;
		gap: 10px;
	}
	.ot-hdr__burger { display: none; }
}
@media (min-width: 90rem) {
	.ot-hdr__logo,
	.ot-hdr__brand .custom-logo { height: 32px; }
	.ot-hdr__nav { padding-left: 24px; }
	.ot-hdr__list { gap: 16px; }
}
@media (min-width: 96rem) {
	.ot-hdr__list { gap: 24px; }
}

/* Dropdown panels. The wrapper's top padding bridges the gap under the trigger. */
.ot-dd {
	position: absolute;
	top: 100%;
	left: -6px;
	z-index: 50;
	padding-top: 8px;
}
.ot-dd__panel {
	display: flex;
	flex-direction: column;
	gap: 2px;
	width: max-content;
	min-width: 288px;
	max-width: 384px;
	max-height: calc(100vh - 7rem);
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: #C4C9D4 transparent;
	margin: 0;
	padding: 6px;
	list-style: none;
	border: 1px solid var(--ot-faint);
	border-radius: 14px;
	background: var(--ot-surface);
	filter: drop-shadow(0 8px 24px rgba(0, 0, 0, .35));
}
.ot-dd__cell { display: flex; }
.ot-dd__item {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 10px;
	border-radius: 10px;
	transition: background-color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-dd__item--sub {
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
}
.ot-dd__icon {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ot-text);
	transition: color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-dd__icon .ot-icon {
	width: 16px;
	height: 16px;
	stroke-width: 1.8;
}
.ot-dd__text {
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
}
.ot-dd__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}
.ot-dd__title {
	display: block;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
	color: var(--ot-text);
	transition: color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-dd__desc {
	display: block;
	font-size: 11px;
	line-height: 15px;
	color: var(--ot-muted);
}
.ot-dd__more {
	flex: none;
	display: flex;
	align-items: center;
	margin-left: auto;
}
.ot-dd__more .ot-icon {
	width: 14px;
	height: 14px;
	color: var(--ot-muted);
}
a.ot-dd__item:hover { background: rgba(255, 255, 255, .06); }
a.ot-dd__item:hover .ot-dd__title,
a.ot-dd__item:hover .ot-dd__icon,
.ot-dd__row.is-active .ot-dd__title,
.ot-dd__row.is-active .ot-dd__icon { color: var(--ot-orange); }
.ot-dd__row.is-active > .ot-dd__item { background: rgba(58, 64, 67, .5); }
.ot-dd__item.is-soon {
	opacity: .6;
	cursor: not-allowed;
}
.ot-dd__item.is-soon .ot-dd__title,
.ot-dd__item.is-soon .ot-dd__icon { color: var(--ot-muted); }

/* Two-column panel (Research): rows on the left, the active row's links on the right. */
.ot-dd__panel--split {
	display: grid;
	grid-template-columns: max-content 1px 208px;
	/* The extra 1fr row takes any height a long right-hand list adds. */
	grid-template-rows: repeat(var(--ot-dd-rows, 1), auto) 1fr;
	align-items: start;
	gap: 0 6px;
	max-width: none;
}
.ot-dd__row { grid-column: 1; }
.ot-dd__row:not(:first-child) { margin-top: 2px; }
.ot-dd__panel--split .ot-dd__desc { white-space: nowrap; }
.ot-dd__divider {
	grid-column: 2;
	grid-row: 1 / -1;
	align-self: stretch;
	background: var(--ot-faint);
}
.ot-dd__sub {
	grid-column: 3;
	grid-row: 1 / -1;
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ot-dd__sub[hidden] { display: none; }

/* "Coming Soon" and other badges next to a dropdown / mobile menu title. */
.ot-soon-badge {
	flex: none;
	display: inline-flex;
	align-items: center;
	padding: 1px 6px;
	border: 1px solid rgba(245, 74, 20, .4);
	border-radius: 9999px;
	background: rgba(245, 74, 20, .1);
	font-size: 9px;
	font-weight: 600;
	line-height: 13px;
	color: var(--ot-orange);
	white-space: nowrap;
}

/* Language popover (from 1280px). */
.ot-lang {
	position: relative;
	display: none;
}
.ot-lang__btn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 9999px;
	background: rgba(255, 255, 255, .04);
	color: var(--ot-white);
	transition: background-color .15s cubic-bezier(.4, 0, .2, 1), border-color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-lang__btn:hover,
.ot-lang__btn[aria-expanded="true"] {
	border-color: rgba(255, 255, 255, .25);
	background: rgba(255, 255, 255, .1);
}
.ot-lang__btn .ot-icon {
	width: 16px;
	height: 16px;
}
.ot-lang__list {
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 1000;
	width: 176px;
	margin: 8px 0 0;
	padding: 6px;
	list-style: none;
	border: 1px solid var(--ot-faint);
	border-radius: 14px;
	background: var(--ot-surface);
	filter: drop-shadow(0 8px 24px rgba(0, 0, 0, .35));
	transform-origin: top right;
	transition: opacity .3s cubic-bezier(.4, 0, .2, 1), transform .3s cubic-bezier(.4, 0, .2, 1);
}
@starting-style {
	.ot-lang__list {
		opacity: 0;
		transform: translateY(-8px) scale(.95);
	}
}
.ot-lang__list li + li { margin-top: 2px; }
.ot-lang__item,
.ot-lang__item:hover {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
	padding: 10px;
	border-radius: 10px;
	color: var(--ot-orange);
	transition: background-color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-lang__item:hover { background: rgba(255, 255, 255, .06); }
.ot-lang__item.is-current { background: rgba(58, 64, 67, .5); }
.ot-lang__label {
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
	color: var(--ot-text);
	transition: color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-lang__item:hover .ot-lang__label,
.ot-lang__item.is-current .ot-lang__label { color: var(--ot-orange); }
.ot-lang__item .ot-icon {
	flex: none;
	width: 16px;
	height: 16px;
}
@media (min-width: 80rem) {
	.ot-lang { display: block; }
}

/* OTCN mobile drawer — source layout, previous full-screen menu rules removed. */
/* OTCN side drawer — replaces legacy full-screen mobile menu */
/* OTCN mobile drawer — aligned to the supplied original guest drawer. */
.ot-mm-backdrop{position:fixed;inset:0;z-index:999;background:rgba(0,0,0,.58);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.ot-mm-backdrop[hidden],.ot-mm[hidden]{display:none!important}
.ot-mm{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:auto!important;width:80%!important;max-width:384px!important;height:100dvh!important;z-index:1000!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;background:rgba(14,15,16,.72)!important;-webkit-backdrop-filter:blur(40px)!important;backdrop-filter:blur(40px)!important;border-left:1px solid #303636!important;box-shadow:0 12px 35px #0006;color:#f4f7f8;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);border-radius:0!important;animation:ot-drawer-enter .24s ease-out both}
@keyframes ot-drawer-enter{from{transform:translateX(100%)}to{transform:translateX(0)}}
.ot-menu-open,.ot-menu-open body{overflow:hidden}
.ot-mm__top{display:flex;align-items:center;gap:12px;padding:0 16px;min-height:66px;flex:0 0 66px;border-bottom:1px solid #303636;background:transparent}
.ot-mm__home,.ot-mm__profile{display:flex;align-items:center;gap:12px;flex:1;min-width:0;text-decoration:none;color:inherit}
.ot-mm__logo{display:block;width:auto;max-width:128px;height:auto;max-height:42px}
.ot-mm__avatar{width:44px;height:44px;flex:none;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#f44820;color:#fff;font-weight:700;font-size:16px}
.ot-mm__profile-text{min-width:0;display:flex;flex-direction:column;gap:2px}.ot-mm__profile-text strong{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ot-mm__profile-text small{font-size:13px;color:#aab0b2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ot-mm__close{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:0;border-radius:12px;background:#232729;color:#fff;flex:none;cursor:pointer}.ot-mm__close svg{width:16px;height:16px}
.ot-mm__verify{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #303636;font-size:13px;color:#aab0b2}.ot-mm__verify a{background:#f44820;color:#fff;text-decoration:none;border-radius:8px;padding:8px 13px;font-size:12px;font-weight:700}
.ot-mm__card{flex:1;min-height:0;display:flex;flex-direction:column;border:0!important;border-radius:0!important;background:transparent!important;margin:0!important;overflow:hidden}
.ot-mm__scroll{overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0;padding:0!important;scrollbar-width:thin}
.ot-mm__list,.ot-mm__langs{list-style:none;margin:0!important;padding:0!important}
.ot-mm__entry,.ot-mm__lang-entry,.ot-mm__account-dropdown{border-bottom:1px solid #303636;margin:0!important}
.ot-mm__row,.ot-mm__row:hover{width:100%;min-height:53px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;text-align:left;color:#f4f7f8!important;text-decoration:none;cursor:pointer}
.ot-mm__row[aria-expanded=true]{background:#141919!important}.ot-mm__label{font-weight:700;font-size:16px;line-height:24px}
.ot-mm__chevron{width:16px;height:16px;flex:none;color:#b5b9ba;transform:none!important;transition:transform .2s}.ot-mm__row[aria-expanded=true] .ot-mm__chevron{transform:rotate(90deg)!important}
.ot-mm__panel,.ot-mm__langs{padding:4px 16px 12px;background:#111615}.ot-mm__panel[hidden],.ot-mm__langs[hidden]{display:none!important}
.ot-mm__link,.ot-mm__lang{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;font-size:14px;line-height:20px;color:#c3c9c8;text-decoration:none}.ot-mm__link--small{padding-left:24px;font-size:13px}.ot-mm__group,.ot-mm__sub{margin:0;border:0}.ot-mm__sub{padding-left:10px}
.ot-mm__lang-right{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:500;color:#c3c9c8}
.ot-mm__actions{flex:none;margin-top:auto;padding:16px;border-top:1px solid #303636;display:flex!important;flex-direction:row!important;gap:12px;background:transparent}
.ot-mm__btn{min-height:40px;flex:1;display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border-radius:16px;font-size:14px;font-weight:700;padding:8px 12px}.ot-mm__btn--ghost{border:1px solid #f4f7f8;color:#fff;background:transparent}.ot-mm__btn--primary{background:#f44820;color:#fff;border:1px solid #f44820}.ot-mm__btn--logout{border:1px solid #b73d3d;color:#ee6666;background:transparent}
@media(min-width:80rem){.ot-mm,.ot-mm-backdrop{display:none!important}}

/* Bottom tab bar (below 1024px) ------------------------------------------- */
.ot-tabbar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 40;
	padding-bottom: env(safe-area-inset-bottom);
	border-top: 1px solid var(--ot-faint);
	background: var(--ot-surface);
}
.ot-tabbar__list {
	display: grid;
	grid-auto-columns: minmax(0, 1fr);
	grid-auto-flow: column;
	max-width: 512px;
	height: 64px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}
.ot-tabbar__item { display: flex; }
.ot-tabbar__link,
.ot-tabbar__link:hover {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	font-size: 11px;
	font-weight: 500;
	line-height: 1.5;
	color: var(--ot-muted);
	transition: color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-tabbar__link:hover { color: var(--ot-text); }
.ot-tabbar__link[aria-current] { color: var(--ot-orange); }
.ot-tabbar__link .ot-icon {
	width: 20px;
	height: 20px;
	stroke-width: 1.6;
}
.ot-tabbar__item--center {
	align-items: flex-start;
	justify-content: center;
}
.ot-tabbar__center,
.ot-tabbar__center:hover {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin-top: -20px;
	border: 4px solid #000;
	border-radius: 9999px;
	background: var(--ot-orange);
	box-shadow: 0 2px 8px .3px rgba(58, 64, 67, .2);
	color: var(--ot-text);
	transition: background-color .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-tabbar__center:hover { background: #E63510; }
.ot-tabbar__center .ot-icon {
	width: 24px;
	height: 24px;
}
@media (max-width: 63.99rem) {
	.ot-has-tabbar { padding-bottom: calc(65px + env(safe-area-inset-bottom)); }
}
@media (min-width: 64rem) {
	.ot-tabbar { display: none; }
}

/* Search form (searchform.php: 404 page) --------------------------------- */
.ot-search { margin: 0; }
.ot-search__box {
	display: flex;
	align-items: center;
	gap: 10px;
	height: 38px;
	padding: 0 8px 0 0;
	border-radius: 10px;
	background: var(--ot-raised);
	width: min(300px, 68vw);
}
/* The label covers the design's clickable area (left padding, icon, field). */
.ot-search__label {
	flex: 1 1 auto;
	min-width: 0;
	align-self: stretch;
	display: flex;
	align-items: center;
	gap: 10px;
	padding-left: 12px;
	cursor: text;
}
.ot-search__icon {
	flex: none;
	color: var(--ot-muted);
}
.ot-search__input {
	flex: 1;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	outline: 0;
	background: transparent;
	color: var(--ot-text);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: -0.24px;
	-webkit-appearance: none;
	appearance: none;
}
/* The bare input keeps the design's outline: 0; focus is drawn on the box (WCAG 2.4.7). */
.ot-search__box:has(.ot-search__input:focus-visible) {
	outline: 2px solid var(--ot-orange);
	outline-offset: 2px;
}
.ot-search__input::-webkit-search-decoration,
.ot-search__input::-webkit-search-cancel-button {
	display: none;
	-webkit-appearance: none;
	appearance: none;
}
.ot-search__clear {
	appearance: none;
	margin: 0;
	padding: 3px 7px;
	border: 0;
	border-radius: 6px;
	background: var(--ot-surface);
	font-family: inherit;
	font-size: 10px;
	font-weight: 700;
	color: var(--ot-muted);
	cursor: pointer;
}
.ot-search [hidden] { display: none; }

/* Section nav wrapper (Research tabs or Insights tool strip) --------------- */
.ot-subnav {
	position: relative;
	z-index: 20;
	border-bottom: 1px solid var(--ot-line-mid);
}

/* Research tabs. */
.ot-secnav__list {
	max-width: var(--ot-max);
	margin: 0 auto;
	padding: 0 var(--ot-gutter);
	display: flex;
	gap: clamp(22px, 3.2vw, 44px);
	flex-wrap: nowrap;
	overflow-x: auto;
	scrollbar-width: none;
	list-style: none;
}
.ot-secnav__list::-webkit-scrollbar { display: none; }
/* No position here: the mega panel is placed against .ot-subnav, outside the scroller. */
.ot-secnav__item {
	flex: none;
	display: flex;
	align-items: center;
	gap: 8px;
	height: 76px;
}
.ot-secnav__item.is-active { box-shadow: inset 0 -2px 0 0 var(--ot-orange); }
.ot-secnav__link,
.ot-secnav__link:hover {
	align-self: stretch;
	display: flex;
	align-items: center;
	font-size: clamp(16px, 1.4vw, 19px);
	font-weight: 600;
	letter-spacing: -0.38px;
	color: var(--ot-muted);
	white-space: nowrap;
	transition: color .15s;
}
.ot-secnav__item:hover > .ot-secnav__link,
.ot-secnav__item.is-active > .ot-secnav__link,
.ot-secnav__item.is-open > .ot-secnav__link { color: var(--ot-text); }
/* 24px hit area around the 12px chevron without moving it (negative margin). */
.ot-secnav__toggle {
	flex: none;
	display: flex;
	margin: -6px;
	padding: 6px;
	border: 0;
	background: transparent;
	color: var(--ot-dim);
}
.ot-secnav__chevron {
	display: block;
	transition: transform .18s;
}
.ot-secnav__item.is-open .ot-secnav__chevron { transform: rotate(180deg); }

/* Mega menu panel. */
.ot-mega {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	background: var(--ot-bg);
	border-bottom: 1px solid var(--ot-line-strong);
	box-shadow: 0 32px 64px rgba(0, 0, 0, .6);
}
.ot-mega[hidden] { display: none; }
.ot-mega__inner {
	max-width: var(--ot-max);
	margin: 0 auto;
	padding: 28px var(--ot-gutter) 32px;
	display: flex;
	flex-wrap: wrap;
	gap: 24px 40px;
}
.ot-mega__intro {
	flex: 1 1 240px;
	min-width: 0;
}
.ot-mega__title {
	margin-top: 8px;
	font-size: 22px;
	font-weight: 700;
	letter-spacing: -0.44px;
	color: var(--ot-white);
}
.ot-mega__blurb {
	margin: 8px 0 0;
	font-size: 12px;
	line-height: 1.55;
	color: var(--ot-muted);
	max-width: 340px;
	text-wrap: pretty;
}
.ot-mega__all,
.ot-mega__all:hover {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 18px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: -0.24px;
	color: var(--ot-orange);
}
.ot-mega__grid {
	flex: 2 1 400px;
	min-width: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr));
	gap: 0 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ot-mega__link {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 12px 0;
	border-top: 1px solid var(--ot-line-soft);
}
.ot-mega__label {
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.24px;
	color: var(--ot-text);
}
.ot-mega__desc {
	font-size: 11px;
	line-height: 1.45;
	color: var(--ot-muted);
}
.ot-mega__meta {
	margin-top: 2px;
	font-size: 10px;
	font-weight: 600;
	color: var(--ot-dim);
}

/* Insights tool strip ------------------------------------------------------ */
.ot-toolnav {
	max-width: var(--ot-max);
	margin: 0 auto;
	padding: 0 var(--ot-gutter);
	overflow-x: auto;
	scrollbar-width: none;
}
.ot-toolnav::-webkit-scrollbar { display: none; }
.ot-toolnav__list {
	display: flex;
	min-width: 784px;
	margin: 0;
	padding: 0;
	list-style: none;
}
/* The tab box (border, background, underline) is the flex item, as in the design,
   so the 1px separators take part in the width distribution the same way. */
.ot-toolnav__item {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	border-left: 1px solid var(--ot-line-soft);
	background: transparent;
	transition: background .15s;
}
.ot-toolnav__item:first-child { border-left: 0; }
.ot-toolnav__item:hover { background: var(--ot-surface); }
.ot-toolnav__item.is-active {
	background: var(--ot-surface);
	box-shadow: inset 0 -2px 0 0 var(--ot-orange);
}
.ot-toolnav__tab {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 18px 16px 16px;
}
.ot-toolnav__glyph {
	height: 30px;
	display: flex;
	align-items: center;
}
/* Grid template, gap and alignment come from the tab's glyph (inline style). */
.ot-glyph { display: grid; }
.ot-glyph__cell {
	display: block;
	transition: background .2s;
}
.ot-glyph__cell--1 { background: var(--ot-dim); }
.ot-glyph__cell--2 { background: rgba(255, 255, 255, .2); }
.ot-glyph__cell--3 { background: rgba(255, 255, 255, .08); }
.ot-toolnav__item.is-active .ot-glyph__cell--1 { background: var(--ot-orange); }
.ot-toolnav__item.is-active .ot-glyph__cell--2 { background: rgba(245, 74, 20, .5); }
.ot-toolnav__item.is-active .ot-glyph__cell--3 { background: rgba(245, 74, 20, .2); }
.ot-toolnav__text {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}
.ot-toolnav__label {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.28px;
	line-height: 1.2;
	color: var(--ot-muted);
}
.ot-toolnav__item.is-active .ot-toolnav__label { color: var(--ot-white); }
.ot-toolnav__cap {
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-dim);
}

/* ==========================================================================
   Research views: desk strip, featured article, card grid, pagination,
   search results, single, 404, comments.
   Values lifted 1:1 from the Claude Design main area; shared pieces
   (hero, chips, section head, see-all, empty state, related) live in base.css.
   ========================================================================== */

/* Desk strip (Today · Desk note · Next release) -------------------------- */
.ot-desk {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
	gap: 20px 40px;
	border-top: 1px solid var(--ot-line);
	border-bottom: 1px solid var(--ot-line);
	padding: 20px 0;
	margin-bottom: 44px;
}
.ot-desk__text {
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.24px;
	color: var(--ot-text);
}
.ot-desk__label + .ot-desk__text,
.ot-desk__row { margin-top: 8px; }
.ot-desk__head {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	align-items: baseline;
}
.ot-desk__impact {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .4px;
	text-transform: uppercase;
	color: var(--ot-orange);
	white-space: nowrap;
}
.ot-desk__row {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	align-items: baseline;
}

/* Featured (lead) article ------------------------------------------------ */
.ot-featured {
	display: flex;
	flex-wrap: wrap;
	gap: 24px 40px;
	align-items: center;
	padding-bottom: 40px;
	border-bottom: 1px solid var(--ot-line);
}
.ot-featured__media {
	flex: 7 1 440px;
	min-width: 0;
}
.ot-featured__body {
	flex: 5 1 320px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.ot-featured__title {
	margin: 0;
	font-size: clamp(20px, 2vw, 26px);
	line-height: 1.22;
	font-weight: 700;
	letter-spacing: -0.015em;
	color: var(--ot-white);
	text-wrap: balance;
}
.ot-featured__title a { color: inherit; }
.ot-featured__dek {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ot-muted);
	text-wrap: pretty;
}

/* Actions row: CTA, "Open in {tool} ↗", tag filters ---------------------- */
.ot-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 16px;
	align-items: center;
	padding-top: 6px;
}
.ot-actions__tool {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: -0.24px;
	color: var(--ot-muted);
	white-space: nowrap;
}
.ot-actions__tool:hover { color: var(--ot-text); }
.ot-actions__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-left: auto;
}
.ot-tag {
	height: 24px;
	display: inline-flex;
	align-items: center;
	padding: 0;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: -0.24px;
	color: var(--ot-dim);
	transition: color .15s;
}
.ot-tag:hover,
.ot-tag.is-active { color: var(--ot-orange); }

/* Feed: "Latest" grid of cards ------------------------------------------- */
.ot-feed__latest { padding-top: 28px; }
.ot-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
	gap: 36px 24px;
}
.ot-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: 0;
	color: var(--ot-text);
}
.ot-card:hover { color: var(--ot-white); }
.ot-card__meta {
	display: flex;
	gap: 10px;
	align-items: baseline;
	min-width: 0;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	color: var(--ot-dim);
}
.ot-card__sub {
	color: var(--ot-orange);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.ot-card__date {
	margin-left: auto;
	white-space: nowrap;
}
.ot-card__title {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -0.32px;
	text-wrap: pretty;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.ot-card__title a,
.ot-card__title a:hover { color: inherit; }
/* Whole card is clickable; the title link carries the semantics. */
.ot-card__title a::after {
	content: '';
	position: absolute;
	inset: 0;
}
/* Keyboard focus: the clamped title (overflow: hidden) clips the link's ring,
   so the card draws it around the same area as the stretched link. */
@supports selector(:has(a)) {
	.ot-card__title a:focus-visible { outline: 0; }
	.ot-card:has(.ot-card__title a:focus-visible) {
		outline: 2px solid var(--ot-orange);
		outline-offset: 2px;
		border-radius: 4px;
	}
}
.ot-card__dek {
	margin: 0;
	font-size: 13px;
	line-height: 1.55;
	color: var(--ot-muted);
	text-wrap: pretty;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Pagination (same row as "See all …") ----------------------------------- */
.ot-pagination {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: baseline;
	gap: 16px;
	margin-top: 40px;
	padding: 16px 0;
	border-top: 1px solid var(--ot-line-mid);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: -0.24px;
}
.ot-pagination a,
.ot-pagination a:hover {
	color: var(--ot-orange);
	white-space: nowrap;
}
.ot-pagination__prev { grid-column: 1; justify-self: start; }
.ot-pagination__status {
	grid-column: 2;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0;
	color: var(--ot-dim);
}
.ot-pagination__next { grid-column: 3; justify-self: end; }

/* Search results --------------------------------------------------------- */
.ot-results { border-top: 1px solid var(--ot-line); }
.ot-results__list { list-style: none; margin: 0; padding: 0; }
.ot-result {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 20px;
	align-items: baseline;
	padding: 18px 0;
	border-bottom: 1px solid var(--ot-line-soft);
	color: var(--ot-text);
	transition: color .15s;
}
.ot-result:hover { color: var(--ot-white); }
.ot-result__where {
	flex: 0 0 200px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-dim);
}
.ot-result__body {
	flex: 1 1 300px;
	min-width: 0;
}
.ot-result__title {
	margin: 0;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -0.3px;
	line-height: 1.35;
	text-wrap: pretty;
}
.ot-result__title a,
.ot-result__title a:hover { color: inherit; }
.ot-result__title a::after {
	content: '';
	position: absolute;
	inset: 0;
}
.ot-result__meta {
	margin: 4px 0 0;
	font-size: 12px;
	line-height: 1.5;
	color: var(--ot-muted);
	text-wrap: pretty;
}
.ot-results__empty {
	margin: 0;
	padding: 32px 0;
	color: var(--ot-muted);
	font-size: 13px;
}

/* Single post / page ----------------------------------------------------- */
.ot-actions--single {
	max-width: 720px;
	padding-top: 0;
	margin-bottom: 28px;
}
.ot-entry-cover { margin-bottom: 40px; }
.ot-front-content { margin-top: 44px; }
.ot-page-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	align-items: baseline;
	max-width: 720px;
	margin-top: 28px;
	padding-top: 16px;
	border-top: 1px solid var(--ot-line-mid);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: -0.24px;
	color: var(--ot-dim);
}
.ot-page-links a,
.ot-page-links a:hover { color: var(--ot-orange); }

/* 404 -------------------------------------------------------------------- */
.ot-notfound {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	padding-top: 28px;
	border-top: 1px solid var(--ot-line);
}
.ot-notfound__links {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 24px;
}

/* Comments --------------------------------------------------------------- */
.ot-comments {
	max-width: 720px;
	margin-top: 44px;
	border-top: 1px solid var(--ot-line);
}
.ot-comments__title {
	margin: 0;
	padding: 12px 0;
	border-bottom: 1px solid var(--ot-line-mid);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .2px;
	color: var(--ot-dim);
}
.ot-comments__list,
.ot-comments__list .children {
	list-style: none;
	margin: 0;
	padding: 0;
}
.ot-comments__list .children { padding-left: 20px; }
.ot-comments .comment-body {
	padding: 18px 0;
	border-bottom: 1px solid var(--ot-line-soft);
}
.ot-comments .comment-author {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: -0.24px;
	color: var(--ot-text);
}
.ot-comments .comment-author .fn { font-weight: 600; }
.ot-comments .comment-author .avatar { border-radius: 50%; }
.ot-comments .says {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}
.ot-comments .bypostauthor > .comment-body .fn { color: var(--ot-orange); }
.ot-comments .comment-metadata {
	margin-top: 4px;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-dim);
}
.ot-comments .comment-metadata a { color: inherit; }
.ot-comments .comment-metadata a:hover { color: var(--ot-text); }
.ot-comments .comment-awaiting-moderation {
	display: block;
	margin-top: 6px;
	font-size: 11px;
	font-style: normal;
	color: var(--ot-dim);
}
.ot-comments .comment-content {
	margin-top: 10px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ot-muted);
	overflow-wrap: break-word;
}
.ot-comments .comment-content p { margin: 0 0 .75em; }
.ot-comments .comment-content > :last-child { margin-bottom: 0; }
.ot-comments .comment-content a { color: var(--ot-orange); }
.ot-comments .reply { margin-top: 10px; }
.ot-comments .comment-reply-link,
.ot-comments .comment-navigation a,
.ot-comments #cancel-comment-reply-link {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: -0.24px;
	color: var(--ot-orange);
}
.ot-comments .comment-navigation .nav-links {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 0;
}
.ot-comments__closed {
	margin: 0;
	padding: 18px 0;
	font-size: 13px;
	color: var(--ot-muted);
}
.ot-comments .comment-respond { padding-top: 28px; }
.ot-comments .comment-reply-title {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 14px;
	margin: 0 0 14px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.28px;
	color: var(--ot-text);
}
.ot-comments .comment-form p { margin: 0 0 14px; }
.ot-comments .comment-notes,
.ot-comments .logged-in-as {
	font-size: 12px;
	line-height: 1.55;
	color: var(--ot-muted);
}
.ot-comments .logged-in-as a,
.ot-comments .comment-notes a { color: var(--ot-orange); }
.ot-comments .comment-form label {
	display: block;
	margin-bottom: 6px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--ot-dim);
}
.ot-comments .comment-form input[type="text"],
.ot-comments .comment-form input[type="email"],
.ot-comments .comment-form input[type="url"],
.ot-comments .comment-form textarea {
	display: block;
	width: 100%;
	min-height: 38px;
	padding: 10px 12px;
	border: 0;
	border-radius: 10px;
	background: var(--ot-raised);
	color: var(--ot-text);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: -0.24px;
	line-height: 1.5;
}
.ot-comments .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}
.ot-comments .comment-form-cookies-consent label {
	margin: 0;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--ot-muted);
}
.ot-comments .comment-form-cookies-consent input { accent-color: var(--ot-orange); }
.ot-comments .form-submit { margin: 0; }
.ot-comments .form-submit .submit { cursor: pointer; }

/* ==========================================================================
   Article typography (.ot-entry): post, page and static front page content.
   Same values as the block editor stylesheet (assets/css/src/editor.css).
   ========================================================================== */

.ot-entry {
	font-size: 16px;
	line-height: 1.75;
	font-weight: 400;
	color: var(--ot-muted);
	overflow-wrap: break-word;
}
/* 720px reading column, left-aligned like the hero. Wide blocks fill the
   .ot-main content box, full-width blocks the viewport. Blocks without their
   own rule below (buttons, groups, columns, embeds) share the paragraph rhythm. */
.ot-entry > * {
	max-width: 720px;
	margin-top: 0;
	margin-bottom: 1.25em;
}
.ot-entry > .alignwide { max-width: none; }
.ot-entry > .alignfull {
	max-width: none;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}
.ot-entry::after {
	content: '';
	display: table;
	clear: both;
}
.ot-entry > :first-child { margin-top: 0; }
.ot-entry > :last-child { margin-bottom: 0; }

.ot-entry p { margin: 0 0 1.25em; }
.ot-entry strong,
.ot-entry b {
	font-weight: 600;
	color: var(--ot-text);
}

/* Headings ---------------------------------------------------------------- */
.ot-entry h2 {
	margin: 2em 0 .6em;
	font-size: 22px;
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--ot-white);
}
.ot-entry h3 {
	margin: 1.75em 0 .5em;
	font-size: 18px;
	line-height: 1.35;
	font-weight: 700;
	letter-spacing: -0.36px;
	color: var(--ot-white);
}
.ot-entry h4 {
	margin: 1.5em 0 .5em;
	font-size: 15px;
	line-height: 1.4;
	font-weight: 700;
	color: var(--ot-text);
}
.ot-entry h5,
.ot-entry h6 {
	margin: 1.5em 0 .5em;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	color: var(--ot-dim);
}

/* Links ------------------------------------------------------------------- */
.ot-entry a {
	color: var(--ot-orange);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}
.ot-entry a:hover { color: var(--ot-orange-hover); }

/* Lists ------------------------------------------------------------------- */
.ot-entry ul,
.ot-entry ol {
	margin: 0 0 1.25em;
	padding-left: 1.25em;
}
.ot-entry li { margin: .4em 0; }
.ot-entry li::marker { color: var(--ot-dim); }

/* Quotes ------------------------------------------------------------------ */
.ot-entry blockquote {
	margin: 1.75em 0;
	padding-left: 20px;
	border-left: 2px solid var(--ot-orange);
	font-size: 18px;
	line-height: 1.6;
	color: var(--ot-text);
}
.ot-entry blockquote > :last-child { margin-bottom: 0; }
.ot-entry blockquote cite {
	display: block;
	font-size: 11px;
	font-weight: 600;
	font-style: normal;
	color: var(--ot-dim);
}

/* Code -------------------------------------------------------------------- */
.ot-entry code {
	padding: .15em .4em;
	border-radius: 6px;
	background: var(--ot-raised);
	font-size: .875em;
	color: var(--ot-text);
}
.ot-entry pre {
	margin: 0 0 1.25em;
	padding: 16px 20px;
	border: 1px solid var(--ot-line-mid);
	border-radius: 10px;
	background: var(--ot-surface);
	font-size: 13px;
	line-height: 1.6;
	overflow: auto;
}
.ot-entry pre code {
	padding: 0;
	border-radius: 0;
	background: none;
	font-size: inherit;
}

/* Tables ------------------------------------------------------------------ */
.ot-entry table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}
.ot-entry .wp-block-table thead,
.ot-entry .wp-block-table tfoot { border: 0; }
.ot-entry table th {
	padding: 10px 12px 10px 0;
	border: 0;
	border-bottom: 1px solid var(--ot-line);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	text-align: left;
	color: var(--ot-dim);
}
.ot-entry table td {
	padding: 11px 12px 11px 0;
	border: 0;
	border-bottom: 1px solid var(--ot-line-soft);
	color: var(--ot-text);
	font-variant-numeric: tabular-nums;
}

/* Media ------------------------------------------------------------------- */
.ot-entry figure { margin: 1.75em 0; }
.ot-entry img { border-radius: 10px; }
.ot-entry figcaption,
.ot-entry .wp-element-caption,
.ot-entry .wp-caption-text,
.ot-entry .gallery-caption {
	margin: 8px 0 0;
	font-size: 11px;
	line-height: 1.5;
	color: var(--ot-dim);
}
.ot-entry .wp-caption { max-width: 100%; }
.ot-entry .alignleft {
	float: left;
	margin: .4em 1.5em 1em 0;
}
.ot-entry .alignright {
	float: right;
	margin: .4em 0 1em 1.5em;
}
.ot-entry .aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Separators (the second selector outranks core's 100px default separator) -- */
.ot-entry hr,
.ot-entry hr.wp-block-separator:not(.is-style-dots) {
	width: auto;
	margin: 2.5em 0;
	border: 0;
	border-top: 1px solid var(--ot-line);
}

/* Buttons block ----------------------------------------------------------- */
.ot-entry .wp-block-button__link {
	padding: 11px 16px;
	border-radius: 12px;
	background: var(--ot-orange);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: -0.24px;
	color: var(--ot-text);
	text-decoration: none;
}
.ot-entry .wp-block-button__link:hover {
	background: var(--ot-orange-hover);
	color: var(--ot-text);
}
.ot-entry .wp-block-button.is-style-outline > .wp-block-button__link,
.ot-entry .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	border: 0;
	background: transparent;
	box-shadow: inset 0 0 0 1px var(--ot-line);
}

/* ==========================================================================
   Trading Glossary: letter index, letter groups, single term.
   Values 1:1 from the design's glossary block.
   ========================================================================== */

/* Letter index: "All  A B C … Z" + count ---------------------------------- */
.ot-glossary__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
	padding: 0 0 24px;
}
.ot-glossary__all,
.ot-glossary__letter {
	height: 30px;
	display: inline-flex;
	align-items: center;
	padding: 0;
	font-size: 12px;
	font-weight: 600;
}
.ot-glossary__all {
	margin-right: 10px;
	letter-spacing: -0.24px;
}
.ot-glossary__letter {
	width: 26px;
	justify-content: center;
}

/* Colours (design has no hover change). The current view — "All" on
   /glossary/, the letter on a letter page — is orange (aria-current). */
.ot-glossary__all,
.ot-glossary__all:hover,
.ot-glossary__letter,
.ot-glossary__letter:hover {
	color: var(--ot-muted);
}
.ot-glossary__all[aria-current],
.ot-glossary__all[aria-current]:hover,
.ot-glossary__letter[aria-current],
.ot-glossary__letter[aria-current]:hover {
	color: var(--ot-orange);
}
.ot-glossary__letter--empty,
.ot-glossary__letter--empty:hover {
	color: var(--ot-faint);
	cursor: default;
}

.ot-glossary__count {
	margin-left: auto;
	font-size: 11px;
	font-weight: 600;
	color: var(--ot-dim);
}

/* Letter groups ----------------------------------------------------------- */
.ot-glossary__groups {
	display: flex;
	flex-direction: column;
}
.ot-glossary__group {
	display: grid;
	grid-template-columns: minmax(48px, 96px) minmax(0, 1fr);
	gap: 16px;
	border-top: 1px solid var(--ot-line);
	padding: 26px 0 30px;
}
.ot-glossary__heading {
	margin: 0;
	font-size: 44px;
	line-height: 1;
	font-weight: 800;
	letter-spacing: -0.04em;
	color: var(--ot-orange);
}
.ot-glossary__heading a,
.ot-glossary__heading a:hover { color: inherit; }

/* Full glossary: letter | first terms | arrow to the letter page. */
.ot-glossary__group--preview {
	grid-template-columns: minmax(48px, 96px) minmax(0, 1fr) auto;
	align-items: center;
}
.ot-glossary__group--preview .ot-glossary__heading { align-self: start; }
.ot-glossary__more {
	width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--ot-line);
	border-radius: 50%;
	color: var(--ot-text);
	transition: background-color .15s, border-color .15s, color .15s;
}
.ot-glossary__more:hover {
	background: var(--ot-orange);
	border-color: var(--ot-orange);
	color: var(--ot-white);
}
.ot-glossary__more-icon {
	width: 16px;
	height: 16px;
}
.ot-glossary__terms {
	margin: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
	gap: 18px 32px;
}
.ot-glossary__item { min-width: 0; }
.ot-glossary__term {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.28px;
	color: var(--ot-text);
}
/* The term name links to its page without looking like a link (design). */
.ot-glossary__term a,
.ot-glossary__term a:hover { color: inherit; }
.ot-glossary__def {
	margin: 4px 0 0;
	font-size: 12px;
	line-height: 1.55;
	color: var(--ot-muted);
	text-wrap: pretty;
}

/* Single term: "← All terms" -------------------------------------------- */
.ot-term__back {
	margin: 0;
	padding-top: 26px;
	border-top: 1px solid var(--ot-line);
}
.ot-entry + .ot-term__back { margin-top: 40px; }

/* ==========================================================================
   Site footer — otcn.com parity. Values are copied from otcn.com's computed
   styles; breakpoints are otcn.com's: sm 40rem, lg 64rem, xl 80rem, wide 90rem.
   ========================================================================== */

.ot-ftr {
	position: relative;
	width: 100%;
	overflow: hidden;
	padding: 40px 0 20px;
	background: var(--ot-surface);
	color: var(--ot-text);
	font-family: var(--ot-font-ui);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	/* otcn.com renders with the browser defaults (the theme body uses antialiased). */
	-webkit-font-smoothing: auto;
	text-rendering: auto;
}

/* Big OTCN wordmark behind the bottom-left corner (decorative). */
.ot-ftr__watermark {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 0;
	display: block;
	flex-shrink: 0;
	width: 560px;
	max-width: 100%;
	height: auto;
	color: #000;
	pointer-events: none;
}
.ot-ftr__watermark text {
	fill: currentColor;
	font-family: var(--ot-font-ui);
	font-size: 200px;
	font-weight: 900;
}

.ot-ftr__inner {
	position: relative;
	width: 100%;
	max-width: 1656px;
	margin: 0 auto;
}
.ot-ftr__body {
	position: relative;
	z-index: 10;
	display: flex;
	flex-direction: column;
	gap: 72px;
	width: 100%;
	padding: 0 16px;
}
.ot-ftr__main {
	display: flex;
	flex-direction: column;
	gap: 80px;
}

/* Link groups (footer menu): 2 columns, 4 from sm, 5 auto columns from xl. */
.ot-ftr__groups {
	display: grid;
	flex: 1 1 0%;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 32px;
	padding-top: 24px;
}
.ot-ftr__stack {
	display: flex;
	flex-direction: column;
	gap: 32px;
}
.ot-ftr__group {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.ot-ftr__heading {
	margin: 0;
	font-family: var(--ot-font);
	font-size: 16px;
	font-weight: 600;
	line-height: 24px;
	letter-spacing: -0.015em;
	color: var(--ot-text);
}
.ot-ftr__links {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ot-ftr__item { padding: 4px 0; }
.ot-ftr__link {
	display: flex;
	align-items: center;
	gap: 6px;
	min-height: 20px;
	font-family: var(--ot-font);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: -0.015em;
	white-space: nowrap;
	color: var(--ot-muted);
}
a.ot-ftr__link { transition: color .15s cubic-bezier(.4, 0, .2, 1); }
a.ot-ftr__link:hover { color: var(--ot-text); }
.ot-ftr__link--soon {
	cursor: not-allowed;
	opacity: .6;
}
.ot-ftr__badge {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	padding: 1px 6px;
	border: 1px solid rgba(245, 74, 20, .4);
	border-radius: 9999px;
	background: rgba(245, 74, 20, .1);
	font-size: 9px;
	font-weight: 600;
	line-height: 13px;
	white-space: nowrap;
	color: var(--ot-orange);
}

/* Company card. */
.ot-ftr__card {
	display: flex;
	flex-direction: column;
	gap: 32px;
	padding: 24px 25px;
	border-radius: 22px;
	background: #000;
}
.ot-ftr__contact {
	display: inline-flex;
	flex-shrink: 0;
	align-self: flex-start;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: 32px;
	padding: 0 12px;
	border-radius: 12px;
	background: var(--ot-text);
	font-size: 12px;
	font-weight: 700;
	line-height: 16px;
	white-space: nowrap;
	color: var(--ot-surface);
	outline: none;
	transition: all .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-ftr__contact:hover {
	background: #fff;
	color: var(--ot-surface);
	box-shadow: 0 1px 2px 1px rgba(21, 21, 20, .4);
}
.ot-ftr__contact:focus-visible {
	outline: none;
	border-radius: 12px;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, .3);
}
.ot-ftr__contact svg {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	pointer-events: none;
}
.ot-ftr__details {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.ot-ftr__field {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
}
.ot-ftr__label {
	font-family: var(--ot-font);
	font-size: 10px;
	font-weight: 600;
	line-height: 12px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(244, 247, 248, .5);
}
.ot-ftr__value {
	font-family: var(--ot-font);
	font-size: 12px;
	font-style: normal;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -0.01em;
	color: var(--ot-text);
}
a.ot-ftr__value:hover,
.ot-ftr__value a:hover {
	color: var(--ot-text);
	text-decoration: underline;
}
.ot-ftr__value a { color: inherit; }
.ot-ftr__socials {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ot-ftr__social {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	transition: opacity .15s cubic-bezier(.4, 0, .2, 1);
}
.ot-ftr__social:hover { opacity: .7; }
.ot-ftr__social img {
	display: block;
	width: 24px;
	height: 24px;
	border-radius: 9999px;
}

/* Optional disclaimer + copyright line. */
.ot-ftr__bottom {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.ot-ftr__disclaimer {
	max-width: 960px;
	font-family: var(--ot-font);
	font-size: 11px;
	line-height: 1.6;
	color: var(--ot-muted);
	text-wrap: pretty;
}
.ot-ftr__disclaimer p { margin: 0; }
.ot-ftr__disclaimer p + p { margin-top: .6em; }
.ot-ftr__disclaimer a,
.ot-ftr__disclaimer a:hover {
	color: inherit;
	text-decoration: underline;
}
.ot-ftr__copy {
	align-self: flex-end;
	margin: 0;
	font-family: var(--ot-font);
	font-size: 12px;
	font-weight: 400;
	letter-spacing: -0.01em;
	color: var(--ot-text);
}

@media (min-width: 40rem) {
	.ot-ftr__body { gap: 104px; }
	.ot-ftr__groups { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 64rem) {
	.ot-ftr__body { padding: 0 24px; }
}

@media (min-width: 80rem) {
	.ot-ftr { padding-top: 32px; }
	.ot-ftr__watermark { width: 480px; }
	.ot-ftr__body { gap: 48px; }
	.ot-ftr__main {
		flex-direction: row;
		gap: 32px;
	}
	.ot-ftr__groups {
		grid-template-columns: repeat(5, auto);
		justify-content: space-between;
		gap: 24px;
	}
	.ot-ftr__stack { gap: 20px; }
	.ot-ftr__group { gap: 8px; }
	.ot-ftr__heading {
		font-size: 14px;
		line-height: 20px;
	}
	.ot-ftr__link { font-size: 12px; }
	.ot-ftr__card {
		width: 320px;
		gap: 24px;
		padding: 20px;
	}

	/* Group placement (menu item CSS classes, see inc/footer.php). */
	.ot-ftr__groups > .ot-fcol-1 { grid-column-start: 1; }
	.ot-ftr__groups > .ot-fcol-2 { grid-column-start: 2; }
	.ot-ftr__groups > .ot-fcol-3 { grid-column-start: 3; }
	.ot-ftr__groups > .ot-fcol-4 { grid-column-start: 4; }
	.ot-ftr__groups > .ot-fcol-5 { grid-column-start: 5; }
	.ot-ftr__groups > .ot-frow-1 { grid-row-start: 1; }
	.ot-ftr__groups > .ot-frow-2 { grid-row-start: 2; }
	.ot-ftr__groups > .ot-fspan-2 { grid-row-end: span 2; }
}

@media (min-width: 90rem) {
	.ot-ftr { padding-top: 40px; }
	.ot-ftr__watermark { width: 560px; }
	.ot-ftr__main { gap: 48px; }
	.ot-ftr__groups { gap: 32px; }
	.ot-ftr__group { gap: 12px; }
	.ot-ftr__heading {
		font-size: 16px;
		line-height: 24px;
	}
	.ot-ftr__link { font-size: 13px; }
	.ot-ftr__card {
		width: 360px;
		gap: 32px;
		padding: 24px 25px;
	}
}


.ot-dd-sm .ot-dd__panel{min-width:220px;max-width:280px}.ot-dd-md .ot-dd__panel{min-width:288px;max-width:384px}.ot-dd-lg .ot-dd__panel{min-width:340px;max-width:460px}.ot-dd-xl .ot-dd__panel{min-width:420px;max-width:620px}.ot-dd-right.ot-dd{left:auto;right:-6px}.ot-dd-compact .ot-dd__item{padding:8px 10px}.ot-dd-compact .ot-dd__desc{font-size:10px;line-height:14px}.ot-dd-split-wide .ot-dd__panel--split{grid-template-columns:minmax(260px,max-content) 1px minmax(240px,300px)}.ot-dd-split-wide .ot-dd__panel--split .ot-dd__desc{white-space:normal;max-width:250px}


/* Source OTCN mobile accordion: curated, icon-led two-line rows. */
.ot-mm__panel.ot-mm__curated{padding:10px 14px 12px!important;background:rgba(25,30,30,.72)!important;border:0!important}
.ot-mm__curated-link{display:flex;gap:13px;align-items:flex-start;padding:12px 2px;color:#f4f7f8!important;text-decoration:none!important;background:transparent!important;border:0!important;border-radius:0!important}
.ot-mm__curated-icon{width:20px;height:20px;flex:none;color:#a3adb0;margin-top:3px}
.ot-mm__curated-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.ot-mm__curated-text strong{font-family:inherit;font-weight:700;font-size:14px;line-height:21px;color:#f4f7f8}
.ot-mm__curated-text small{font-family:inherit;font-weight:400;font-size:12px;line-height:18px;color:#abb2b4}
.ot-mm__curated-link:hover .ot-mm__curated-text strong{color:#fb4a22}
.ot-mm__lang-entry .ot-mm__row[aria-expanded=true]{background:rgba(25,30,30,.72)!important}
.ot-mm__langs{background:rgba(25,30,30,.72)!important;padding:0 16px 12px!important}
.ot-mm__lang{min-height:42px;padding:10px 0!important;color:#f4f7f8;font-size:14px}
.ot-mm__lang.is-current{color:#ff4b26!important;font-weight:700}
.ot-mm{background:rgba(14,15,16,.72)!important;-webkit-backdrop-filter:blur(40px)!important;backdrop-filter:blur(40px)!important}
.ot-mm__top,.ot-mm__actions{background:transparent!important}

/* OTCN mobile navigation: persist above site content, below source drawer */
@media(max-width:63.99rem){.ot-tabbar{display:block;z-index:90}}
