/* Research page styles are scoped to avoid affecting the rest of the site. */
.research-page {
	--research-accent: #40a8bf;
	--research-accent-soft: #8bccda;
	--research-ink: #17191c;
	--research-muted: #66707a;
	--research-line: #dfe5e8;
	--research-soft: #f5f8f9;
	color: var(--research-ink);
	font-size: 16px;
	letter-spacing: normal;
	padding-bottom: 80px;
}

.research-page * {
	box-sizing: border-box;
}

.research-page a {
	color: inherit;
}

.research-page .research-intro {
	padding: 0 0 42px;
	border-bottom: 1px solid var(--research-line);
}

.research-page .eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	color: var(--research-accent);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.research-page .eyebrow::before {
	content: "";
	width: 28px;
	height: 2px;
	background: var(--research-accent);
}

.research-page h1 {
	max-width: 900px;
	margin: 13px 0 14px;
	font-size: clamp(40px, 5.8vw, 82px);
	font-weight: 800;
	line-height: .98;
	letter-spacing: -.045em;
}

.research-page .intro-copy {
	max-width: 850px;
	margin: 0;
	color: var(--research-muted);
	font-size: clamp(17px, 1.7vw, 22px);
	line-height: 1.65;
}

.research-page .topic-index {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
	margin-top: 32px;
}

.research-page .topic-index a {
	display: flex;
	min-height: 78px;
	flex-direction: column;
	justify-content: space-between;
	padding: 16px 17px;
	border: 1px solid var(--research-line);
	background: #fff;
	text-decoration: none;
	transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.research-page .topic-index a:hover {
	transform: translateY(-2px);
	border-color: var(--research-accent-soft);
	box-shadow: 0 8px 26px rgba(30, 70, 82, .08);
}

.research-page .topic-index .num {
	color: var(--research-accent);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .12em;
}

.research-page .topic-index .topic-label {
	font-size: 15px;
	font-weight: 700;
}

.research-page .research-section {
	padding: 76px 0;
	border-bottom: 1px solid var(--research-line);
	scroll-margin-top: 84px;
}

.research-page .section-heading-row {
	display: grid;
	grid-template-columns: 100px 1fr auto;
	align-items: start;
	gap: 16px;
	margin-bottom: 34px;
}

.research-page .section-number {
	color: var(--research-accent);
	font-size: 16px;
	font-weight: 800;
	letter-spacing: .12em;
}

.research-page .section-title h2 {
	margin: 0;
	font-size: clamp(30px, 3vw, 48px);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -.035em;
}

.research-page .section-title p {
	margin: 9px 0 0;
	color: var(--research-muted);
	font-size: 17px;
}

.research-page .status-badge {
	display: inline-flex;
	align-items: center;
	min-height: 30px;
	padding: 6px 11px;
	border: 1px solid #b9dfe7;
	border-radius: 999px;
	background: #edf9fb;
	color: #267f94;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	white-space: nowrap;
}

.research-page .oe-compact,
.research-page .placeholder-grid {
	display: grid;
	grid-template-columns: .88fr 1.12fr;
	min-height: 340px;
	border: 1px solid var(--research-line);
	background: #fff;
}

.research-page .oe-compact-copy,
.research-page .placeholder-copy {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding: 26px 35px;
}

.research-page .oe-compact-copy h3,
.research-page .placeholder-copy h3 {
	margin: 0 0 12px;
	font-size: clamp(23px, 2.3vw, 30px);
	font-weight: 800;
	line-height: 1.18;
	letter-spacing: -.025em;
}

.research-page .oe-compact-copy p,
.research-page .placeholder-copy p {
	max-width: 520px;
	margin: 0;
	color: var(--research-muted);
	font-size: 16px;
	line-height: 1.65;
}

.research-page .oe-highlights {
	display: grid;
	gap: 6px;
	margin: 14px 0 16px;
	padding-left: 18px;
	color: #424e58;
	font-size: 14px;
	line-height: 1.45;
}

.research-page .oe-highlights li::marker {
	color: var(--research-accent);
}

.research-page .oe-explorer-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 13px;
	min-height: 44px;
	padding: 10px 14px;
	border: 1px solid #298ba1;
	background: #298ba1;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

.research-page .oe-explorer-link:hover,
.research-page .oe-explorer-link:focus {
	background: #217a8d;
	color: #fff;
	text-decoration: none;
}

.research-page .oe-explorer-link:focus-visible,
.research-page .oe-compact-figure a:focus-visible {
	outline: 3px solid #267f94;
	outline-offset: 4px;
}

.research-page .oe-compact-figure {
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: 0;
	padding: 16px;
	border-left: 1px solid var(--research-line);
	background: var(--research-soft);
}

.research-page .oe-compact-figure a {
	display: block;
}

.research-page .oe-compact-figure img,
.research-page .oe-compact-figure video {
	display: block;
	width: auto;
	max-width: 100%;
	max-height: 340px;
	height: auto;
	margin: 0 auto;
	background: #fff;
}

.research-page .oe-compact-figure video {
	width: 100%;
	background: var(--research-soft);
}

.research-page .fill-figure {
	position: relative;
	min-height: 340px;
	padding: 0;
}

.research-page .fill-figure video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-height: none;
	object-fit: cover;
}

.research-page .oe-compact-figure figcaption {
	margin-top: 10px;
	color: #596771;
	font-size: 12px;
	line-height: 1.5;
}

.research-page .placeholder-copy {
	padding: 35px;
}

.research-page .placeholder-copy h3 {
	font-size: clamp(26px, 2.7vw, 39px);
	letter-spacing: -.035em;
}

.research-page .research-theme-list {
	display: grid;
	gap: 7px;
	margin: 18px 0 0;
	padding-left: 18px;
	color: #424e58;
	font-size: 14px;
	line-height: 1.5;
}

.research-page .research-theme-list li::marker {
	color: var(--research-accent);
}

.research-page .placeholder-note {
	display: inline-flex;
	align-self: flex-start;
	margin-top: 19px;
	padding: 6px 9px;
	border: 1px dashed #b6c3c9;
	color: #7d8a92;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.research-page .placeholder-visual {
	position: relative;
	overflow: hidden;
	min-height: 340px;
	background: linear-gradient(145deg, #eff7f9 0%, #d8eef3 100%);
	isolation: isolate;
}

.research-page .placeholder-visual::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(64, 168, 191, .08) 1px, transparent 1px),
		linear-gradient(90deg, rgba(64, 168, 191, .08) 1px, transparent 1px);
	background-size: 34px 34px;
	z-index: -1;
}

.research-page .visual-label {
	position: absolute;
	top: 24px;
	left: 24px;
	color: #35798a;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.research-page .point-field span {
	position: absolute;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--research-accent);
	box-shadow: 0 0 0 5px rgba(64, 168, 191, .08);
}

.research-page .point-field span:nth-of-type(1) { left: 18%; top: 28%; }
.research-page .point-field span:nth-of-type(2) { left: 31%; top: 55%; }
.research-page .point-field span:nth-of-type(3) { left: 43%; top: 35%; }
.research-page .point-field span:nth-of-type(4) { left: 52%; top: 67%; }
.research-page .point-field span:nth-of-type(5) { left: 65%; top: 42%; }
.research-page .point-field span:nth-of-type(6) { left: 76%; top: 59%; }
.research-page .point-field span:nth-of-type(7) { left: 82%; top: 27%; }
.research-page .point-field span:nth-of-type(8) { left: 58%; top: 22%; }
.research-page .point-field span:nth-of-type(9) { left: 36%; top: 22%; }
.research-page .point-field span:nth-of-type(10) { left: 70%; top: 75%; }

.research-page .point-field .wire {
	position: absolute;
	top: 24%;
	left: 20%;
	width: 58%;
	height: 50%;
	border: 2px solid rgba(53, 121, 138, .35);
	transform: skewY(-9deg) rotate(-3deg);
}

.research-page .point-field .tag {
	position: absolute;
	right: 12%;
	bottom: 17%;
	padding: 9px 11px;
	border: 1px solid #aad3dd;
	background: #fff;
	color: #2c7889;
	font-size: 12px;
	font-weight: 800;
}

.research-page .gaussian-field .g {
	position: absolute;
	border: 1px solid rgba(64, 168, 191, .52);
	border-radius: 50%;
	background: rgba(64, 168, 191, .25);
	transform: rotate(-18deg);
}

.research-page .gaussian-field .g:nth-of-type(2) { width: 120px; height: 54px; left: 14%; top: 30%; }
.research-page .gaussian-field .g:nth-of-type(3) { width: 95px; height: 46px; left: 38%; top: 48%; }
.research-page .gaussian-field .g:nth-of-type(4) { width: 140px; height: 64px; left: 60%; top: 27%; }
.research-page .gaussian-field .g:nth-of-type(5) { width: 82px; height: 40px; left: 66%; top: 65%; }
.research-page .gaussian-field .g:nth-of-type(6) { width: 74px; height: 32px; left: 28%; top: 70%; }

.research-page .gaussian-field .arrow {
	position: absolute;
	top: 40%;
	left: 42%;
	width: 29%;
	height: 2px;
	background: #2e8295;
	transform: rotate(-16deg);
}

.research-page .gaussian-field .arrow::after {
	content: "";
	position: absolute;
	top: -4px;
	right: -1px;
	width: 10px;
	height: 10px;
	border-top: 2px solid #2e8295;
	border-right: 2px solid #2e8295;
	transform: rotate(45deg);
}

.research-page .embodied-field .viewfinder {
	position: absolute;
	top: 22%;
	right: 14%;
	bottom: 18%;
	left: 14%;
	border: 2px solid rgba(53, 121, 138, .42);
	background: rgba(255, 255, 255, .32);
}

.research-page .embodied-field .tool {
	position: absolute;
	top: 54%;
	left: 29%;
	width: 43%;
	height: 7px;
	border-radius: 999px;
	background: #307f91;
	transform: rotate(-22deg);
	transform-origin: left center;
}

.research-page .embodied-field .tool::before {
	content: "";
	position: absolute;
	top: -9px;
	left: -23px;
	width: 26px;
	height: 26px;
	border: 3px solid #307f91;
	border-radius: 50%;
}

.research-page .embodied-field .track {
	position: absolute;
	top: 37%;
	left: 47%;
	width: 18%;
	height: 29%;
	border: 2px dashed #e47e67;
	transform: rotate(-10deg);
}

.research-page .embodied-field .dot {
	position: absolute;
	top: 35%;
	left: 63%;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #e47e67;
	box-shadow: 0 0 0 6px rgba(228, 126, 103, .12);
}

/* More details panels ----------------------------------------------------- */
.research-page button.details-toggle {
	font-family: inherit;
	cursor: pointer;
}

.research-page .details-arrow {
	display: inline-block;
	transition: transform .25s ease;
}

.research-page .details-toggle[aria-expanded="true"] .details-arrow {
	transform: rotate(180deg);
}

.research-page .research-details {
	padding: 26px 30px 22px;
	border: 1px solid var(--research-line);
	border-top: 0;
	scroll-margin-top: 84px;
	animation: research-details-in .3s ease;
}

.research-page .research-details[hidden] {
	display: none;
}

.research-page .research-details iframe {
	display: block;
	width: 100%;
	height: 480px;
	border: 0;
	background: transparent;
}

.research-page #\33 d-recognition-details {
	padding: 12px 30px;
}

.research-page button.se-explorer-link {
	font-family: inherit;
	cursor: pointer;
}

@keyframes research-details-in {
	from { opacity: 0; transform: translateY(-6px); }
	to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	.research-page .research-details { animation: none; }
	.research-page .details-arrow { transition: none; }
}

@media (max-width: 680px) {
	.research-page .research-details { padding: 18px 14px; }
	.research-page #\33 d-recognition-details { padding: 10px 14px; }
}

/* Surgical and embodied vision ------------------------------------------- */
.research-page .se-explorer-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 13px;
	min-height: 44px;
	margin-top: 20px;
	padding: 10px 14px;
	border: 1px solid #298ba1;
	background: #298ba1;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

.research-page .se-explorer-link:hover,
.research-page .se-explorer-link:focus {
	background: #217a8d;
	color: #fff;
	text-decoration: none;
}

.research-page .se-explorer-link:focus-visible {
	outline: 3px solid #267f94;
	outline-offset: 4px;
}

@media (max-width: 991px) {
	.research-page .topic-index {
		grid-template-columns: repeat(2, 1fr);
	}

	.research-page .section-heading-row {
		grid-template-columns: 70px 1fr;
	}

	.research-page .section-heading-row .status-badge {
		grid-column: 2;
		justify-self: start;
	}

	.research-page .oe-compact,
	.research-page .placeholder-grid {
		grid-template-columns: 1fr;
	}

	.research-page .oe-compact-figure {
		border-top: 1px solid var(--research-line);
		border-left: 0;
	}

	.research-page .placeholder-visual {
		min-height: 280px;
	}

}

@media (max-width: 680px) {
	.research-page .research-section {
		padding: 56px 0;
	}

	.research-page .section-heading-row {
		grid-template-columns: 1fr;
		gap: 7px;
	}

	.research-page .section-heading-row .status-badge {
		grid-column: 1;
	}

	.research-page .oe-compact-copy,
	.research-page .placeholder-copy {
		padding: 22px;
	}

	.research-page .oe-compact-figure {
		padding: 12px;
	}

}

@media (max-width: 480px) {
	.research-page .topic-index {
		grid-template-columns: 1fr;
	}

}
