/* Header trust strip — "Your Trusted Peptide Source." overlay positioned
 * at the top of #masthead. Spans past-the-logo → right-edge on desktop,
 * narrower right-of-center on mobile (where the tagline is hidden so the
 * strip floats over the menu/hamburger area only).
 *
 * Section: inc/sections/header-trust-strip-v2.php
 * Gate:    pp_header_trust_strip_v2 (default '1')
 */

/* Anchor — #masthead must be position:relative so the absolute strip
 * lays out against the header, not the document. Scoped to the body
 * gate so this anchor only activates when the strip is enabled.
 */
body.pp-header-trust-strip-v2 .site-header,
body.pp-header-trust-strip-v2 #masthead {
	position: relative;
}

/* Body-prefixed + #masthead for cascade-precedence over GP's late
 * wp_head:999 design-theme.css rules and over the (0,2,2)-specificity
 * "body.pp-header-aurora-v2 header.site-header > *" rule from
 * overrides-base.css. Bumping specificity per CLAUDE.md rather than
 * reaching for !important. */
body.pp-header-trust-strip-v2 #masthead > .pp-header-trust-strip {
	position: absolute;
	/* Positioned in the upper portion of the logo's vertical zone so
	 * the gold text sits comfortably above the menu items (which are
	 * vertically centered to the logo row, around y≈54 from masthead
	 * top with a 102px logo + 2px breath). Strip is horizontally
	 * centered + logo is left-anchored, so they share vertical space
	 * without overlapping.
	 *
	 * 14px font × 1.2 line-height ≈ 17px tall; placed at top:16 puts
	 * the strip at y=16-33 with ~14px of breathing room above the
	 * menu text (which begins around y=47-49). */
	top: 16px;
	left: 0;
	right: 0;
	width: auto;
	z-index: 5;
	pointer-events: none; /* never block clicks on tagline / menu underneath */

	text-align: center;
	font-family: "Poppins", sans-serif;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	color: #d4af37; /* brand gold accent */
	line-height: 1.2;
	white-space: nowrap;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
}

/* Header compaction — paired with the trust strip enablement.
 *
 * Geometry budget (desktop, total header height ≈106px — was 116px
 * originally, then 90 / 86 across two refinement passes; owner
 * requested a bigger logo on the third pass, so total grew back up).
 *   - 2px top padding on .inside-header → no empty band above the
 *     logo; the trust strip is absolute-positioned over the logo's
 *     right side, not above it.
 *   - 102px logo (capped via max-height: 102px on the image — owner
 *     wanted +25% over the previous 82px to restore brand prominence).
 *   - 2px bottom padding
 *
 * Visual result: bigger logo hugs the top edge, gold trust strip
 * floats at y≈16-33 well above the menu row's text (around y=47-59,
 * centered in the 102px logo height). Menu row sits comfortably below
 * the strip with ~14px breathing room.
 *
 * Selector specificity (1,2,2) outranks GP's `.site-logo img` and
 * `.header-image` rules. .is-logo-image is set by GP on the
 * customizer-uploaded logo image. */
body.pp-header-trust-strip-v2 #masthead .inside-header {
	/* overrides-base.css has `.inside-header { padding: 1px 40px !important }`,
	 * so specificity alone can't win — must match the !important. */
	padding-top: 2px !important;
	padding-bottom: 2px !important;
}
body.pp-header-trust-strip-v2 #masthead .header-image.is-logo-image,
body.pp-header-trust-strip-v2 #masthead img.custom-logo {
	max-height: 102px;
	height: auto;
	width: auto;
}

/* Mobile (≤1024px) — pp-header-tagline is display:none here, so the
 * strip floats over the hamburger / menu area. Still full-width-
 * centered so the line sits in the visual middle of the header.
 */
@media (max-width: 1024px) {
	body.pp-header-trust-strip-v2 #masthead > .pp-header-trust-strip {
		left: 0;
		right: 0;
		/* Same strategy as desktop — strip floats in upper portion of
		 * the logo zone with breathing room above the menu/hamburger
		 * row. 12px font × 1.2 ≈ 14px tall; placed at top:10 with the
		 * bigger 75px mobile logo, gap to menu row is ~14-18px. */
		top: 10px;
		width: auto;
		max-width: none;
		font-size: 12px;
		letter-spacing: 0.08em;
		text-align: center;
	}

	/* Mobile compaction — zero top padding (logo hugs top), logo
	 * proportional to desktop's +25% bump (60→75). Total mobile
	 * header ≈79px. */
	body.pp-header-trust-strip-v2 #masthead .inside-header {
		padding-top: 2px !important;
		padding-bottom: 2px !important;
	}
	body.pp-header-trust-strip-v2 #masthead .header-image.is-logo-image,
	body.pp-header-trust-strip-v2 #masthead img.custom-logo {
		max-height: 75px;
	}
}

/* Phone (≤600px) — keep it visible but tighter so it doesn't crowd the
 * compact mobile header (pp-mobile-header-compact-v2 has its own
 * spacing constraints).
 */
@media (max-width: 600px) {
	body.pp-header-trust-strip-v2 #masthead > .pp-header-trust-strip {
		font-size: 10px;
		letter-spacing: 0.06em;
	}
}