/* ============================================================
   tongliang-longwu.css —— 铜梁龙舞 · 夜火金龙主题（深色）
   设计意象：夜空铁水金花、火龙翻飞
   ============================================================ */

:root {
	--paper: #17191d;
	--ink: #e8e4da;
	--muted: #9a958a;
	--accent: #e0a640;
	--accent-2: #d4552e;
	--nav-bg: #101216;
	--nav-ink: #d9d4c8;
	--card-bg: #1f2228;
	--card-border: #33363d;
	--chip-bg: rgba(224, 166, 64, .12);
	--chip-ink: #eec26e;
	--btn-bg: #e0a640;
	--btn-ink: #201a10;
	--field-bg: #26292f;
	--field-border: #3c4047;
	--footer-bg: #101216;
	--footer-ink: #8d887c;
}

body {
	background:
		radial-gradient(900px 480px at 85% -140px, rgba(212, 85, 46, .16), transparent 60%),
		radial-gradient(700px 420px at -10% 30%, rgba(224, 166, 64, .07), transparent 60%),
		var(--paper);
}

.sec-head h2 { color: var(--ink); }
.sec-head .sub { color: var(--muted); }

/* ---------- 头部：夜空金花 ---------- */
.fire-hero {
	position: relative;
	overflow: hidden;
	text-align: center;
	padding: 96px 22px 88px;
	color: #f5edd8;
	background:
		radial-gradient(1100px 500px at 50% 115%, rgba(212, 85, 46, .38), transparent 62%),
		linear-gradient(180deg, #0c0d10 0%, #17191d 70%);
}

.fire-hero::before,
.fire-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(2.5px 2.5px at 9% 22%, #ffd98a, transparent 60%),
		radial-gradient(2px 2px at 22% 58%, #ff9d5c, transparent 60%),
		radial-gradient(3px 3px at 38% 30%, #ffe4a8, transparent 60%),
		radial-gradient(2px 2px at 55% 66%, #ffb066, transparent 60%),
		radial-gradient(2.5px 2.5px at 71% 24%, #ffd98a, transparent 60%),
		radial-gradient(2px 2px at 84% 52%, #ffe4a8, transparent 60%),
		radial-gradient(2px 2px at 93% 36%, #ff9d5c, transparent 60%);
	opacity: .8;
	animation: sparks 5.5s ease-in-out infinite alternate;
	pointer-events: none;
}

.fire-hero::after { animation-delay: 2.4s; opacity: .5; }

@keyframes sparks {
	0% { transform: translateY(0); opacity: .55; }
	100% { transform: translateY(-26px); opacity: .95; }
}

.fire-hero .hero-kicker { font-size: 13px; letter-spacing: 9px; color: #d98b52; margin-bottom: 14px; }

.fire-hero h1 {
	font-size: clamp(38px, 7vw, 66px);
	letter-spacing: 16px;
	text-indent: 16px;
	color: #f3d489;
	text-shadow: 0 0 34px rgba(224, 166, 64, .45), 0 6px 24px rgba(0, 0, 0, .6);
}

.fire-hero .hero-slogan { margin-top: 14px; font-size: 16px; letter-spacing: 5px; color: #cdb894; }

.fire-hero .hero-chips {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 26px;
	position: relative;
	z-index: 1;
}

.fire-hero .chip {
	padding: 6px 16px;
	border: 1px solid rgba(238, 194, 110, .45);
	border-radius: 999px;
	font-size: 13px;
	letter-spacing: 2px;
	color: #eec26e;
	background: rgba(224, 166, 64, .08);
}

/* ---------- 龙种：大编号纵列 ---------- */
.dragon-ledger { display: grid; gap: 14px; }

.dragon-ledger article {
	display: grid;
	grid-template-columns: 120px 1fr;
	background: var(--card-bg);
	border: 1px solid var(--card-border);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 10px 26px rgba(0, 0, 0, .35);
	transition: border-color .25s, transform .25s;
}

.dragon-ledger article:hover { border-color: rgba(224, 166, 64, .5); transform: translateX(4px); }

.dragon-ledger .no {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: linear-gradient(160deg, rgba(224, 166, 64, .16), rgba(212, 85, 46, .12));
	border-right: 1px solid var(--card-border);
	gap: 4px;
	padding: 18px 8px;
}

.dragon-ledger .no b {
	font-family: Georgia, serif;
	font-size: 34px;
	font-style: italic;
	color: var(--accent);
	line-height: 1;
}

.dragon-ledger .no span { font-size: 11px; letter-spacing: 3px; color: var(--muted); }

.dragon-ledger .desc { padding: 18px 22px; }

.dragon-ledger h3 { font-size: 18px; letter-spacing: 3px; color: #f3d489; margin-bottom: 6px; }
.dragon-ledger p { font-size: 14px; color: #b5b0a4; }

/* ---------- 特色三段：灯笼横排 ---------- */
.tri-craft {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}

.tri-craft article {
	background: var(--card-bg);
	border: 1px solid var(--card-border);
	border-radius: 14px;
	padding: 24px 20px;
	box-shadow: 0 10px 26px rgba(0, 0, 0, .3);
	position: relative;
}

.tri-craft article::before {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--accent-2);
	box-shadow: 0 0 12px rgba(212, 85, 46, .8);
	margin-bottom: 12px;
}

.tri-craft h3 { font-size: 17px; letter-spacing: 2px; color: var(--accent); margin-bottom: 8px; }
.tri-craft p { font-size: 14px; color: #b5b0a4; }

/* ---------- 图廊：暗框片墙 ---------- */
.night-gallery {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}

.night-gallery figure {
	margin: 0;
	border: 1px solid var(--card-border);
	border-radius: 12px;
	overflow: hidden;
	background: var(--card-bg);
}

.night-gallery img { height: 160px; width: 100%; object-fit: cover; transition: transform .4s, opacity .3s; opacity: .92; }
.night-gallery figure:hover img { transform: scale(1.06); opacity: 1; }

.night-gallery figcaption {
	padding: 10px 12px;
	font-size: 13px;
	color: var(--muted);
	text-align: center;
}

.duo-video {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: 20px;
	margin-top: 20px;
	align-items: start;
}

.video-container { box-shadow: 0 14px 36px rgba(0, 0, 0, .5); }

/* ---------- 传承：金线履历 ---------- */
.gold-track { position: relative; padding-left: 26px; border-left: 2px solid rgba(224, 166, 64, .4); }

.gold-track article { position: relative; margin-bottom: 22px; }

.gold-track article::before {
	content: "";
	position: absolute;
	left: -33px;
	top: 6px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--accent);
	box-shadow: 0 0 0 4px rgba(224, 166, 64, .18), 0 0 14px rgba(224, 166, 64, .6);
}

.gold-track h3 { font-size: 16.5px; letter-spacing: 1px; color: #f3d489; margin-bottom: 4px; }
.gold-track p { font-size: 14px; color: #b5b0a4; }

/* ---------- 响应式 ---------- */
@media (max-width: 900px) {
	.dragon-ledger article { grid-template-columns: 84px 1fr; }
	.tri-craft { grid-template-columns: 1fr; }
	.night-gallery { grid-template-columns: repeat(2, 1fr); }
	.duo-video { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.night-gallery { grid-template-columns: 1fr; }
	.dragon-ledger article { grid-template-columns: 1fr; }
	.dragon-ledger .no {
		flex-direction: row;
		border-right: none;
		border-bottom: 1px solid var(--card-border);
		padding: 10px 16px;
		gap: 10px;
	}
	.fire-hero h1 { letter-spacing: 8px; text-indent: 8px; }
}