
/* =========================================================
   首页 · 航模工作室工程笔记
   作用域限定 .uava-front，不影响内页。
   网格、标注线和几何块只做局部层级，不铺成通用航空仪表。
   ========================================================= */

.uava-front {
	--hx-paper:    #f2f4ef;
	--hx-ink:      #1b2d39;
	--hx-blue:     #2857ad;
	--hx-blue-deep:#163a70;
	--hx-blue-mid: #86aacd;
	--hx-cyan:     #137f94;
	--hx-rule:     rgba(27,45,57,.16);
	--hx-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
		"Liberation Mono", "Courier New", monospace;
}

/* 首页整体换纸底，覆盖 Astra 的白 */
.uava-front.ast-separate-container,
.uava-front .site-content,
.uava-front #primary {
	background: var(--hx-paper);
}

/* 首页隐藏 Astra 的页面标题与描述 */
.uava-front .ast-article-single > .entry-header,
.uava-front .ast-archive-description {
	display: none;
}

.uava-front .ast-article-single .entry-content {
	margin: 0;
}
.uava-front .ast-article-single > .post-thumb {
	display: none;
}

/* =========================================================
   横幅
   ========================================================= */
.uava-hx-hero {
	/* 兜底：即使 body 上没有 .uava-front（例如以后换了页面模板），
	   横幅和卡片也能拿到正确的变量值 */
	--hx-paper:    #f2f4ef;
	--hx-ink:      #1b2d39;
	--hx-blue:     #2857ad;
	--hx-blue-deep:#163a70;
	--hx-blue-mid: #86aacd;
	--hx-cyan:     #137f94;
	--hx-rule:     rgba(27,45,57,.16);

	position: relative;
	overflow: hidden;
	background: var(--hx-paper);
	border-bottom: 1px solid var(--hx-rule);
	min-height: 620px;
	display: flex;
	align-items: center;
	padding: 5rem 3rem 6rem;
}

/* 蓝图网格：向右渐隐 */
.uava-hx-grid {
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(var(--hx-rule) 1px, transparent 1px),
		linear-gradient(90deg, var(--hx-rule) 1px, transparent 1px);
	background-size: 32px 32px;
	mask-image: linear-gradient(105deg, rgba(0,0,0,.9) 0%, rgba(0,0,0,.25) 55%, transparent 85%);
	-webkit-mask-image: linear-gradient(105deg, rgba(0,0,0,.9) 0%, rgba(0,0,0,.25) 55%, transparent 85%);
	opacity: .28;
	pointer-events: none;
}

/* 大楔形：右上斜切 */
.uava-hx-wedge {
	position: absolute;
	top: 0;
	right: 0;
	/* 抽象结构面：弱化大色块，让标题和可编辑文案成为主视觉 */
	width: 38%;
	height: 72%;
	top: 12%;
	background: rgba(40,87,173,.1);
	clip-path: polygon(38% 0, 100% 0, 100% 100%, 0 100%);
	pointer-events: none;
}

/* 粗横条：压在楔形下沿，与斜面形成直角冲突 */
.uava-hx-rule {
	position: absolute;
	top: 58%;
	left: 0;
	width: 32%;
	height: 7px;
	background: var(--hx-cyan);
	pointer-events: none;
}

/* 同心圆弧：圆心在左上外侧，只露右下弧段 */
.uava-hx-arcs {
	position: absolute;
	top: 0;
	left: 0;
	width: 600px;
	height: 600px;
	pointer-events: none;
	transform: translate(-46%, -46%);
}
.uava-hx-arcs circle {
	fill: none;
	stroke: var(--hx-cyan);
	stroke-width: 1;
	stroke-dasharray: 6 10;
	opacity: .28;
}

/* HUD 角标 */
.uava-hx-corner {
	position: absolute;
	width: 26px;
	height: 26px;
	border: 1px solid var(--hx-cyan);
	pointer-events: none;
	opacity: .7;
}
.uava-hx-corner--tl { top: 28px; left: 28px; border-right: 0; border-bottom: 0; }
.uava-hx-corner--tr { top: 28px; right: 28px; border-left: 0; border-bottom: 0; }
.uava-hx-corner--bl { bottom: 64px; left: 28px; border-right: 0; border-top: 0; }
.uava-hx-corner--br { bottom: 64px; right: 28px; border-left: 0; border-top: 0; }

/* 竖排标签 */
.uava-hx-spine {
	position: absolute;
	left: 34px;
	top: 50%;
	transform: translateY(-50%) rotate(180deg);
	writing-mode: vertical-rl;
	font-family: var(--hx-mono);
	font-size: 10px;
	letter-spacing: .5em;
	color: var(--hx-cyan);
	opacity: .8;
	pointer-events: none;
}

/* 内容层 */
.uava-hx-content {
	position: relative;
	z-index: 3;
	max-width: 640px;
}

.uava-hx-eyebrow {
	font-family: var(--hx-mono);
	font-size: 11px;
	letter-spacing: .42em;
	text-transform: uppercase;
	color: var(--hx-cyan);
	margin: 0 0 1.2rem;
}

.uava-hx-title {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: .05em;
	color: var(--hx-blue-deep);
	font-size: clamp(3.2rem, 8.4vw, 6.4rem);
	line-height: .96;
	letter-spacing: -.02em;
	font-weight: 700;
}

.uava-hx-title__line {
	display: block;
	will-change: transform, opacity;
}

/* 标题下的短粗线 */
.uava-hx-bar {
	display: block;
	width: 30%;
	max-width: 160px;
	height: 6px;
	background: var(--hx-blue);
	margin: 1.4rem 0 1.1rem;
}

.uava-hx-sub {
	margin: 0 0 2rem;
	font-size: 1.05rem;
	color: var(--hx-ink);
	letter-spacing: .06em;
	opacity: .85;
}

/* CTA */
.uava-hx-cta {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .8rem;
}

.uava-hx-btn {
	display: inline-flex;
	align-items: center;
	padding: .72em 1.35em;
	font-size: .95rem;
	line-height: 1.2;
	letter-spacing: .04em;
	text-decoration: none;
	border: 1px solid var(--hx-blue);
	border-radius: 0;
	transition: background-color .16s ease, color .16s ease, border-color .16s ease;
}

.uava-hx-btn--solid {
	background: var(--hx-blue);
	color: #fff;
}
.uava-hx-btn--solid:hover {
	background: var(--hx-blue-deep);
	border-color: var(--hx-blue-deep);
	color: #fff;
}

.uava-hx-btn--ghost {
	background: transparent;
	color: var(--hx-blue);
}
.uava-hx-btn--ghost:hover {
	background: var(--hx-blue);
	color: #fff;
}

/* 遥测条 */
.uava-hx-telemetry {
	position: absolute;
	left: 3rem;
	right: 3rem;
	bottom: 2rem;
	display: flex;
	align-items: center;
	gap: 1rem;
	font-family: var(--hx-mono);
	font-size: 11px;
	letter-spacing: .16em;
	color: var(--hx-cyan);
	pointer-events: none;
}

.uava-hx-telemetry__line {
	flex: 1;
	height: 1px;
	background: var(--hx-cyan);
	opacity: .5;
	transform-origin: left center;
}

.uava-hx-telemetry__data {
	display: flex;
	gap: 1.6rem;
	white-space: nowrap;
}

.uava-hx-telemetry__mark {
	width: 12px;
	height: 12px;
	background: var(--hx-blue-mid);
	flex: 0 0 auto;
}

/* =========================================================
   精选贴文
   ========================================================= */
.uava-hx-section {
	--hx-paper:    #f2f4ef;
	--hx-ink:      #1b2d39;
	--hx-blue:     #2857ad;
	--hx-blue-deep:#163a70;
	--hx-blue-mid: #86aacd;
	--hx-cyan:     #137f94;
	--hx-rule:     rgba(27,45,57,.16);

	padding: 4rem 3rem;
	max-width: var(--uava-max);
	margin: 0 auto;
}

.uava-hx-section__head {
	display: flex;
	align-items: center;
	gap: .8rem;
	margin-bottom: 2rem;
}

.uava-hx-section__mark {
	width: 6px;
	height: 26px;
	background: var(--hx-blue-deep);
	flex: 0 0 auto;
}

.uava-hx-section__title {
	margin: 0;
	font-size: 1.4rem;
	color: var(--hx-ink);
	letter-spacing: .02em;
}

.uava-hx-section__index {
	margin-left: auto;
	font-family: var(--hx-mono);
	font-size: 11px;
	letter-spacing: .2em;
	color: var(--hx-cyan);
}

.uava-hx-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.uava-hx-card {
	--hx-paper:    #f2f4ef;
	--hx-ink:      #1b2d39;
	--hx-blue:     #2857ad;
	--hx-blue-deep:#163a70;
	--hx-blue-mid: #86aacd;
	--hx-cyan:     #137f94;
	--hx-rule:     rgba(27,45,57,.16);

	background: #fff;
	border: 1px solid var(--hx-rule);
	position: relative;
	overflow: hidden;
	transition: border-color .18s ease, transform .18s ease;
}

/* hover 时左边缘出现深蓝竖条 */
.uava-hx-card::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: var(--hx-blue-deep);
	transform: scaleY(0);
	transform-origin: top;
	transition: transform .2s ease;
	z-index: 2;
}

.uava-hx-card:hover {
	border-color: var(--hx-blue);
	transform: translateY(-2px);
}
.uava-hx-card:hover::before {
	transform: scaleY(1);
}

.uava-hx-card__media {
	display: block;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	background: var(--hx-paper);
}

.uava-hx-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .3s ease;
}
.uava-hx-card:hover .uava-hx-card__media img {
	transform: scale(1.03);
}

/* 无封面占位：网格 */
.uava-hx-card__placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background-image:
		linear-gradient(var(--hx-rule) 1px, transparent 1px),
		linear-gradient(90deg, var(--hx-rule) 1px, transparent 1px);
	background-size: 24px 24px;
}

.uava-hx-card__body {
	padding: 1.1rem 1.2rem 1.3rem;
}

.uava-hx-card__title {
	margin: 0 0 .5rem;
	font-size: 1.05rem;
	line-height: 1.45;
}

.uava-hx-card__title a {
	color: var(--hx-ink);
	text-decoration: none;
}
.uava-hx-card__title a:hover {
	color: var(--hx-blue);
}

.uava-hx-card__excerpt {
	margin: 0 0 .7rem;
	font-size: .9rem;
	line-height: 1.7;
	color: #4a5a6d;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.uava-hx-card__meta {
	margin: 0;
	font-family: var(--hx-mono);
	font-size: 11px;
	letter-spacing: .14em;
	color: var(--hx-cyan);
	opacity: .8;
}

.uava-hx-empty {
	color: #4a5a6d;
	font-size: .95rem;
}

/* =========================================================
   宣传语栏
   ========================================================= */
.uava-hx-slogan {
	--hx-paper:    #f2f4ef;
	--hx-ink:      #1b2d39;
	--hx-blue:     #2857ad;
	--hx-blue-deep:#163a70;
	--hx-blue-mid: #86aacd;
	--hx-cyan:     #137f94;
	--hx-rule:     rgba(27,45,57,.16);

	background: #e7eef0;
	border-top: 1px solid var(--hx-rule);
	border-bottom: 1px solid var(--hx-rule);
}

.uava-hx-slogan__inner {
	max-width: var(--uava-max);
	margin: 0 auto;
	padding: 4rem 3rem 3.5rem;
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: end;
	gap: 2rem;
}

.uava-hx-slogan__text {
	margin: 0;
	font-size: clamp(1.3rem, 2.6vw, 2rem);
	line-height: 1.65;
	color: var(--hx-blue-deep);
	letter-spacing: .01em;
	max-width: 22em;
}

/* 刻度：5 条递增短竖线 */
.uava-hx-scale {
	display: flex;
	align-items: flex-end;
	gap: 6px;
	height: 42px;
}
.uava-hx-scale span {
	display: block;
	width: 1px;
	background: var(--hx-cyan);
	opacity: .7;
}
.uava-hx-scale span:nth-child(1) { height: 14px; }
.uava-hx-scale span:nth-child(2) { height: 20px; }
.uava-hx-scale span:nth-child(3) { height: 26px; }
.uava-hx-scale span:nth-child(4) { height: 33px; }
.uava-hx-scale span:nth-child(5) { height: 42px; }

.uava-hx-slogan__sign {
	grid-column: 1 / -1;
	margin: .5rem 0 0;
	font-family: var(--hx-mono);
	font-size: 11px;
	letter-spacing: .2em;
	color: var(--hx-cyan);
	opacity: .8;
}

/* =========================================================
   入场动画（一次性，不循环）
   ========================================================= */
@keyframes uava-hx-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@keyframes uava-hx-wedge-in {
	from { opacity: 0; transform: translateX(40px); }
	to   { opacity: 1; transform: translateX(0); }
}

@keyframes uava-hx-rise {
	from { opacity: 0; transform: translateY(24px); }
	to   { opacity: 1; transform: translateY(0); }
}

@keyframes uava-hx-rise-sm {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}

@keyframes uava-hx-line-grow {
	from { transform: scaleX(0); }
	to   { transform: scaleX(1); }
}

.uava-hx-wedge {
	animation: uava-hx-wedge-in .7s cubic-bezier(.2,.8,.2,1) both;
}

.uava-hx-grid {
	animation: uava-hx-fade-in 1s ease-out .2s both;
}

.uava-hx-arcs circle {
	animation: uava-hx-fade-in 1.4s ease-out .4s both;
}

.uava-hx-eyebrow {
	animation: uava-hx-rise-sm .5s ease-out .25s both;
}

.uava-hx-title__line {
	animation: uava-hx-rise .6s cubic-bezier(.2,.8,.2,1) both;
	animation-delay: calc(.3s + var(--i, 0) * .15s);
}

.uava-hx-bar {
	animation: uava-hx-line-grow .5s ease-out .7s both;
	transform-origin: left center;
}

.uava-hx-sub,
.uava-hx-cta {
	animation: uava-hx-rise-sm .5s ease-out .75s both;
}

.uava-hx-telemetry__line {
	animation: uava-hx-line-grow .8s ease-out .9s both;
}

.uava-hx-telemetry__data,
.uava-hx-telemetry__mark {
	animation: uava-hx-fade-in .6s ease-out 1.1s both;
}

.uava-hx-corner {
	animation: uava-hx-fade-in .5s ease-out 1.15s both;
}

.uava-hx-spine {
	animation: uava-hx-fade-in .8s ease-out 1.2s both;
}

/* 减少动画偏好：直接显示终态 */
@media (prefers-reduced-motion: reduce) {
	.uava-hx-wedge,
	.uava-hx-grid,
	.uava-hx-arcs circle,
	.uava-hx-eyebrow,
	.uava-hx-title__line,
	.uava-hx-bar,
	.uava-hx-sub,
	.uava-hx-cta,
	.uava-hx-telemetry__line,
	.uava-hx-telemetry__data,
	.uava-hx-telemetry__mark,
	.uava-hx-corner,
	.uava-hx-spine {
		animation: none;
		opacity: 1;
		transform: none;
	}
}

/* =========================================================
   响应式
   ========================================================= */
@media (max-width: 1024px) {
	.uava-hx-cards {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 782px) {
	.uava-hx-hero {
		min-height: 520px;
		padding: 4rem 1.5rem 5rem;
	}

	.uava-hx-wedge {
		width: 38%;
		height: 46%;
		top: 0;
		clip-path: polygon(52% 0, 100% 0, 100% 100%, 0 100%);
	}

	.uava-hx-rule {
		width: 52%;
		height: 8px;
		top: 52%;
	}

	.uava-hx-arcs {
		width: 420px;
		height: 420px;
		transform: translate(-52%, -52%);
	}

	.uava-hx-spine {
		display: none;
	}

	.uava-hx-corner--tl { top: 16px; left: 16px; }
	.uava-hx-corner--tr { top: 16px; right: 16px; }
	.uava-hx-corner--bl { bottom: 56px; left: 16px; }
	.uava-hx-corner--br { bottom: 56px; right: 16px; }

	.uava-hx-title {
		font-size: clamp(2.4rem, 12vw, 3.6rem);
	}

	.uava-hx-telemetry {
		left: 1.5rem;
		right: 1.5rem;
		bottom: 1.2rem;
		font-size: 9px;
		gap: .5rem;
	}

	.uava-hx-telemetry__data {
		gap: .8rem;
	}

	.uava-hx-telemetry__data span:nth-child(2),
	.uava-hx-telemetry__data span:nth-child(3) {
		display: none;
	}

	.uava-hx-section {
		padding: 2.5rem 1.5rem;
	}

	.uava-hx-cards {
		grid-template-columns: 1fr;
	}

	.uava-hx-slogan__inner {
		grid-template-columns: 1fr;
		padding: 2.5rem 1.5rem 2rem;
	}

	.uava-hx-scale {
		display: none;
	}
}

@media (max-width: 480px) {
	.uava-hx-eyebrow {
		font-size: 9px;
		letter-spacing: .3em;
	}

	.uava-hx-sub {
		font-size: .95rem;
	}

	.uava-hx-cta {
		flex-direction: column;
		align-items: stretch;
	}

	.uava-hx-btn {
		justify-content: center;
	}
}
