/* ============================================================
   header.css — 公告条 + 顶导
   主站页头是「细公告条 + 白底细导航 + 大写宽字距菜单」。
   ============================================================ */

/* --- 公告条：主站顶部那条窄的反色带 --- */
.jg-announcement {
	background: rgb(var(--jg-ink));
	color: rgb(var(--jg-paper));
	font-size: var(--jg-text-xs);
	letter-spacing: .12em;
	text-transform: uppercase;
	text-align: center;
	padding: .7em var(--jg-gutter);
}
.jg-announcement a {
	color: rgb(var(--jg-paper));
	text-decoration: underline;
	text-underline-offset: .25em;
}

/* --- 顶导整体 --- */
.ct-header [data-id="menu"] .menu > li > a,
.jg-nav a {
	font-size: var(--jg-text-base);
	font-weight: 400;
	letter-spacing: var(--jg-heading-tracking);
	text-transform: uppercase;
	color: rgb(var(--jg-ink));
}

/* 菜单 hover：主站是纯 opacity 变化。
   下划线动画的关闭在 blocksy-bridge.css 第 5 节用特异性处理，
   放那边是因为它属于「压父主题内联样式」，不是本文件的职责。 */
.ct-header [data-id="menu"] .menu > li > a:hover { opacity: .62; }

/* --- 站点标题（未上传 logo 时的文字 logo） --- */
.site-title,
.ct-logo-container .site-title a {
	font-size: 1.375rem;
	font-weight: 500;
	letter-spacing: .22em;   /* 品牌名比正文标题再宽一档，主站 logo 就是这个观感 */
	text-transform: uppercase;
}

/* --- 页头分隔线：主站是极细的浅灰，不是 Blocksy 默认的阴影 --- */
.ct-header {
	background: rgb(var(--jg-paper));
	border-bottom: 1px solid rgb(var(--jg-border-soft));
	box-shadow: none;
}

/* --- 「回商城」按钮：博客的核心导流入口，视觉上要比菜单项重 --- */
.jg-shop-link {
	display: inline-block;
	font-size: var(--jg-text-xs);
	font-weight: 500;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: .65em 1.4em;
	border: 1px solid rgb(var(--jg-ink));
	color: rgb(var(--jg-ink));
}
.jg-shop-link:hover {
	background: rgb(var(--jg-ink));
	color: rgb(var(--jg-paper));
	opacity: 1;
}
