/* ==========================================================================
   Site header: trust bar, branding, actions, sticky behaviour, search overlay
   ========================================================================== */

.hp-trustbar {
	background-color: var(--hp-color-primary-dark);
	color: var(--hp-color-text-invert);
	font-size: var(--hp-text-2xs);
}
.hp-trustbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--hp-space-sm);
	min-height: 34px;
	padding-block: 0.35rem;
}
.hp-trustbar__message { display: flex; align-items: center; gap: 0.4rem; margin: 0; }
.hp-trustbar__message svg { flex: 0 0 auto; color: var(--hp-color-signal); }
.hp-trustbar__links { display: none; gap: var(--hp-space-sm); }
.hp-trustbar a { color: inherit; text-decoration: none; }
.hp-trustbar a:hover { text-decoration: underline; }
@media (min-width: 768px) { .hp-trustbar__links { display: flex; } }

.hp-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background-color: var(--hp-color-surface);
	border-bottom: var(--hp-rule);
}
.hp-header.is-pinned { box-shadow: var(--hp-shadow-sm); }
.hp-admin-bar-offset .hp-header { top: 32px; }

.hp-header__bar {
	display: flex;
	align-items: center;
	gap: var(--hp-space-sm);
	min-height: var(--hp-header-height);
}

/* Branding: typographic lockup when no logo is set */
.hp-brand { display: inline-flex; align-items: center; gap: 0.55rem; text-decoration: none; flex: 0 0 auto; }
.hp-brand img { max-height: 40px; width: auto; }
.hp-brand__mark {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: var(--hp-radius-sm);
	background-color: var(--hp-color-primary-dark);
	color: #fff;
	font-family: var(--hp-font-display);
	font-size: 1.05rem;
	line-height: 1;
	padding-top: 2px;
}
.hp-brand__name {
	font-family: var(--hp-font-display);
	font-size: 1.3rem;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--hp-color-text);
	line-height: 1.05;
}
.hp-brand__tagline { display: block; font-family: var(--hp-font-body); font-size: var(--hp-text-3xs); color: var(--hp-color-text-muted); letter-spacing: 0.02em; }

.hp-header__actions { display: flex; align-items: center; gap: var(--hp-space-3xs); margin-left: auto; }
.hp-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	min-width: 44px;
	min-height: 44px;
	padding: 0 0.5rem;
	border-radius: var(--hp-radius-md);
	color: var(--hp-color-text);
	font-size: var(--hp-text-xs);
	font-weight: 650;
}
.hp-icon-btn:hover { background-color: var(--hp-color-surface-alt); }
.hp-icon-btn__text { display: none; }
@media (min-width: 1024px) { .hp-icon-btn__text { display: inline; } }

.hp-header__cta { display: none; }
@media (min-width: 768px) { .hp-header__cta { display: inline-flex; } }

/* Search overlay */
.hp-search-panel {
	display: none;
	border-top: var(--hp-rule);
	background-color: var(--hp-color-surface);
	padding-block: var(--hp-space-md);
}
.hp-search-panel.is-open { display: block; }
.hp-search-panel__form { position: relative; display: flex; gap: var(--hp-space-2xs); }
.hp-search-panel__form .hp-input { min-height: 52px; font-size: var(--hp-text-md); }
.hp-suggest {
	position: absolute;
	inset: calc(100% + 6px) 0 auto 0;
	z-index: 5;
	max-height: 60vh;
	overflow-y: auto;
	background-color: var(--hp-color-surface);
	border: var(--hp-rule);
	border-radius: var(--hp-radius-md);
	box-shadow: var(--hp-shadow-md);
}
.hp-suggest:empty { display: none; }
.hp-suggest__item { display: block; padding: 0.65rem var(--hp-space-sm); text-decoration: none; border-bottom: var(--hp-rule); }
.hp-suggest__item:last-child { border-bottom: 0; }
.hp-suggest__item:hover,
.hp-suggest__item.is-active { background-color: var(--hp-color-canvas); }
.hp-suggest__type { display: block; font-size: var(--hp-text-3xs); letter-spacing: 0.06em; text-transform: uppercase; color: var(--hp-color-text-muted); }
.hp-suggest__title { font-size: var(--hp-text-sm); font-weight: 650; color: var(--hp-color-text); }
.hp-search-quick { margin-top: var(--hp-space-sm); font-size: var(--hp-text-xs); color: var(--hp-color-text-muted); }
.hp-search-quick a { margin-right: var(--hp-space-sm); }

/* Reading progress */
.hp-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	width: 100%;
	z-index: 60;
	background: transparent;
	pointer-events: none;
}
.hp-progress__bar { height: 100%; width: 0; background-color: var(--hp-color-accent); transition: width 80ms linear; }
@media (prefers-reduced-motion: reduce) { .hp-progress { display: none; } }
