/*
Theme Name: 盒子君 · 建设中
Theme URI: https://hezijun.com/
Author: 盒子君
Description: 年轻化的整站占位页。暖白底 + 品牌橙 + 「盒子」方块符号，只输出建设中提示，无导航、无文章循环、不查数据库。文案集中在 index.php 顶部。
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hezijun-hold
Tags: one-column
*/

:root {
	--bg: #FFF9F5;
	--ink: #12151A;
	--muted: #6E7076;
	--accent: #FF5A1F;
	--soft: #FFDDC9;
	--line: rgba(18, 21, 26, .12);
	--card: #FFFFFF;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { height: 100%; }

body {
	margin: 0;
	min-height: 100%;
	background: var(--bg);
	color: var(--ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
	font-size: 16px;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

.hold {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: clamp(40px, 7vh, 80px);
	min-height: 100vh;
	min-height: 100svh;
	max-width: 1120px;
	margin: 0 auto;
	padding: clamp(22px, 4vw, 44px);
}

.hold-top {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 16px;
}

.hold-brand {
	margin: 0;
	font-size: 19px;
	font-weight: 700;
	letter-spacing: -.01em;
}

.hold-brand i {
	font-style: normal;
	color: var(--accent);
}

.hold-slogan {
	margin: 0;
	font-size: 13px;
	color: var(--muted);
}

.hold-hero {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: clamp(32px, 6vw, 72px);
	padding: clamp(16px, 5vh, 56px) 0;
}

.hold-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 26px;
	padding: 7px 16px 7px 13px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--card);
	font-size: 13px;
	color: var(--muted);
}

.hold-pulse {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--accent);
	animation: hj-pulse 1.9s ease-in-out infinite;
}

@keyframes hj-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: .35; transform: scale(.7); }
}

.hold-title {
	margin: 0;
	font-size: clamp(40px, 7.4vw, 74px);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -.03em;
}

.hold-title em {
	display: block;
	margin-top: .55em;
	font-size: .27em;
	font-style: normal;
	font-weight: 500;
	letter-spacing: .14em;
	color: var(--accent);
}

.hold-text {
	max-width: 40ch;
	margin: 28px 0 0;
	font-size: clamp(15px, 1.5vw, 17px);
	color: var(--muted);
}

.hold-mail {
	display: inline-block;
	margin-top: 26px;
	padding-bottom: 3px;
	color: var(--ink);
	font-size: 15px;
	text-decoration: none;
	border-bottom: 2px solid var(--accent);
}

.hold-mail:hover { color: var(--accent); }

.hold-art {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: clamp(10px, 1.6vw, 16px);
	width: clamp(120px, 20vw, 176px);
}

.hold-cell {
	position: relative;
	aspect-ratio: 1;
	border-radius: 24px;
	background: var(--soft);
}

.hold-cell.is-fill { background: var(--accent); }

.hold-cell.is-live {
	background: var(--card);
	border: 2px solid var(--ink);
	border-radius: 24px;
	overflow: hidden;
}

.hold-cell.is-live::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: var(--accent);
	animation: hj-pack 2.6s cubic-bezier(.45, 0, .25, 1) infinite;
}

@keyframes hj-pack {
	0%, 100% { transform: scale(.28); opacity: 1; }
	55% { transform: scale(1); opacity: .3; }
}

.hold-cell.is-tilt { transform: rotate(-6deg); }

.hold-foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 24px;
	padding-top: 20px;
	border-top: 1px solid var(--line);
	font-size: 13px;
	color: var(--muted);
}

.hold-foot a {
	color: var(--muted);
	text-decoration: none;
	border-bottom: 1px solid var(--line);
}

.hold-foot a:hover {
	color: var(--accent);
	border-color: var(--accent);
}

@media (max-width: 820px) {
	.hold-hero {
		grid-template-columns: minmax(0, 1fr);
		justify-items: start;
		gap: 40px;
	}
	.hold-art { order: -1; width: clamp(112px, 30vw, 148px); }
}

@media (max-width: 560px) {
	.hold-foot { flex-direction: column; align-items: flex-start; }
	.hold-cell { border-radius: 18px; }
}

@media (prefers-reduced-motion: reduce) {
	.hold-pulse,
	.hold-cell.is-live::after { animation: none; }
	.hold-cell.is-live::after { transform: scale(.55); opacity: .5; }
}