/**
 * Pure Haven IT — Final brand enforcement (v1.8.0)
 * Wins over all prior layers. Electric blue eyebrows, gradient ring cards, no flat grey borders.
 */

/* ==========================================================================
   NUCLEAR: kill flat grey card borders site-wide
   ========================================================================== */
body.ph-body .ph-site-main .ph-surface-card,
body.ph-body .ph-site-main .ph-sharp-card,
body.ph-body .ph-site-main .ph-trust-card,
body.ph-body .ph-site-main .ph-feature-card,
body.ph-body .ph-site-main .ph-preview-tile,
body.ph-body .ph-site-main .ph-tile,
body.ph-body .ph-site-main .ph-showcase-card,
body.ph-body .ph-site-main .ph-card,
body.ph-body .ph-site-main .ph-highlight-panel {
	border: none !important;
	border-color: transparent !important;
}

/* Gradient ring on all content cards */
body.ph-body .ph-site-main .ph-surface-card,
body.ph-body .ph-site-main .ph-sharp-card,
body.ph-body .ph-site-main .ph-trust-card,
body.ph-body .ph-site-main .ph-feature-card,
body.ph-body .ph-site-main .ph-preview-tile,
body.ph-body .ph-site-main .ph-showcase-card {
	position: relative !important;
	background: var(--ph-color-white) !important;
	box-shadow:
		0 2px 4px rgba(13, 27, 62, 0.04),
		0 12px 36px -14px rgba(0, 102, 255, 0.14) !important;
}

body.ph-body .ph-site-main .ph-surface-card::before,
body.ph-body .ph-site-main .ph-sharp-card::before,
body.ph-body .ph-site-main .ph-trust-card::before,
body.ph-body .ph-site-main .ph-feature-card::before,
body.ph-body .ph-site-main .ph-preview-tile::before,
body.ph-body .ph-site-main .ph-showcase-card::before {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	border-radius: inherit !important;
	padding: 1.5px !important;
	background: linear-gradient(
		135deg,
		#0066FF 0%,
		rgba(0, 102, 255, 0.45) 30%,
		rgba(0, 180, 166, 0.35) 70%,
		rgba(226, 232, 240, 0.9) 100%
	) !important;
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
	-webkit-mask-composite: xor !important;
	mask-composite: exclude !important;
	pointer-events: none !important;
	z-index: 1 !important;
}

/* ==========================================================================
   Eyebrows / highlights — electric blue #0066FF everywhere
   ========================================================================== */
body.ph-body .ph-eyebrow,
body.ph-body .ph-section-header__eyebrow,
body.ph-body .ph-eyebrow-anim,
body.ph-body .ph-glass-panel__label,
body.ph-body .ph-services-visual__label {
	color: #0066FF !important;
	font-family: var(--ph-font-body) !important;
	font-weight: 700 !important;
}

body.ph-body .ph-text-highlight,
body.ph-body .ph-highlight-blue,
body.ph-body strong.ph-text-highlight,
body.ph-body .ph-text-primary {
	color: #0066FF !important;
}

/* Hero eyebrow on dark — lighter blue for contrast */
body.ph-body .ph-hero .ph-eyebrow,
body.ph-body .ph-hero .ph-eyebrow-anim {
	color: #66a3ff !important;
}

/* ==========================================================================
   Typography hierarchy — no black
   ========================================================================== */
body.ph-body .ph-site-main p,
body.ph-body .ph-site-main li,
body.ph-body .ph-site-main .ph-lead,
body.ph-body .ph-site-main .ph-body-text {
	color: #1E293B !important;
	font-family: 'Inter', sans-serif !important;
}

body.ph-body .ph-site-main .ph-section-header__text,
body.ph-body .ph-site-main .ph-note,
body.ph-body .ph-site-main .ph-quote-meta,
body.ph-body .ph-site-main .ph-trust-strip__label,
body.ph-body .ph-site-main .ph-feature-card p,
body.ph-body .ph-site-main .ph-card--service p,
body.ph-body .ph-site-main .ph-preview-tile p,
body.ph-body .ph-site-main .ph-showcase-card__meta {
	color: #000000 !important;
}

body.ph-body .ph-site-main h1,
body.ph-body .ph-site-main h2,
body.ph-body .ph-site-main h3,
body.ph-body .ph-site-main .ph-h2,
body.ph-body .ph-site-main .ph-h3 {
	color: #0D1B3E !important;
	font-family: 'Montserrat', sans-serif !important;
	font-weight: 700 !important;
	letter-spacing: -0.02em !important;
}

/* ==========================================================================
   Animated blue underline — ALL section headings in main
   ========================================================================== */
body.ph-body .ph-site-main .ph-section-header .ph-h2,
body.ph-body .ph-site-main .ph-h2.ph-heading-anim {
	display: inline-block;
	position: relative;
}

body.ph-body .ph-site-main .ph-section-header .ph-h2::after,
body.ph-body .ph-site-main .ph-h2.ph-heading-anim::after {
	content: "";
	display: block;
	width: 72px;
	height: 4px;
	margin-top: 14px;
	border-radius: 2px;
	background: linear-gradient(90deg, #0066FF 0%, #0066FF 60%, #00B4A6 100%);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.85s cubic-bezier(0.22, 1, 0.36, 1);
}

body.ph-body .ph-site-main .ph-section-header--center .ph-h2::after,
body.ph-body .ph-site-main .ph-section-header--center .ph-h2.ph-heading-anim::after {
	margin-inline: auto;
	transform-origin: center center;
}

body.ph-body .ph-site-main .ph-reveal.is-visible .ph-h2::after,
body.ph-body .ph-site-main .ph-h2.ph-heading-anim.is-visible::after,
body.ph-body .ph-site-main .ph-page-hero .ph-h2::after,
body.ph-body .ph-site-main .ph-page-hero .ph-heading-anim::after {
	transform: scaleX(1);
}

/* ==========================================================================
   Metrics — electric blue, animated glow
   ========================================================================== */
body.ph-body .ph-trust-strip__number,
body.ph-body .ph-counter__value {
	color: #0066FF !important;
	font-family: 'Montserrat', sans-serif !important;
	font-weight: 700 !important;
	font-size: 2.35rem !important;
	line-height: 1.1 !important;
	letter-spacing: -0.03em !important;
	text-shadow: 0 4px 20px rgba(0, 102, 255, 0.22) !important;
}

/* ==========================================================================
   Blue rhythm bands — stronger contrast
   ========================================================================== */
body.ph-body .ph-site-main .ph-band--rhythm-white {
	background: #FFFFFF !important;
}

body.ph-body .ph-site-main .ph-band--rhythm-grey {
	background:
		radial-gradient(circle at 100% 0%, rgba(0, 102, 255, 0.07) 0%, transparent 40%),
		linear-gradient(180deg, #F5F7FA 0%, #e8eef6 100%) !important;
}

body.ph-body .ph-site-main .ph-band--rhythm-blue {
	background:
		radial-gradient(circle at 0% 100%, rgba(0, 102, 255, 0.14) 0%, transparent 50%),
		linear-gradient(180deg, #E6F0FF 0%, #f4f8ff 50%, #FFFFFF 100%) !important;
	border-top: 2px solid rgba(0, 102, 255, 0.15) !important;
	border-bottom: 2px solid rgba(0, 102, 255, 0.1) !important;
}

/* ==========================================================================
   Employers blue glass panel
   ========================================================================== */
body.ph-body .ph-highlight-panel--blue {
	background:
		linear-gradient(145deg, rgba(0, 102, 255, 0.18) 0%, rgba(0, 102, 255, 0.06) 50%, rgba(255, 255, 255, 0.95) 100%) !important;
	border: none !important;
	box-shadow:
		0 8px 40px -12px rgba(0, 102, 255, 0.35),
		inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
	backdrop-filter: blur(14px) !important;
	-webkit-backdrop-filter: blur(14px) !important;
}

body.ph-body .ph-highlight-panel--blue::before {
	background: linear-gradient(135deg, #0066FF, rgba(0, 180, 166, 0.5)) !important;
	padding: 2px !important;
}

body.ph-body .ph-highlight-panel--blue .ph-glass-panel__list li {
	color: #0D1B3E !important;
	font-weight: 500 !important;
}

/* ==========================================================================
   Services blue lead card + tech strip
   ========================================================================== */
body.ph-body .ph-sharp-card--blue-lead {
	background: linear-gradient(165deg, rgba(0, 102, 255, 0.12) 0%, #FFFFFF 50%) !important;
}

body.ph-body .ph-sharp-card--blue-lead::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, #0066FF, #00B4A6);
	border-radius: var(--ph-radius-xl) var(--ph-radius-xl) 0 0;
	z-index: 2;
}

body.ph-body .ph-services-visual {
	border: none !important;
	box-shadow: 0 20px 56px -20px rgba(0, 102, 255, 0.4) !important;
}

body.ph-body .ph-services-visual::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 2px;
	background: linear-gradient(135deg, #0066FF, #00B4A6);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	pointer-events: none;
}

body.ph-body .ph-services-visual__label {
	background: #0066FF !important;
	color: #FFFFFF !important;
}

/* ==========================================================================
   Hover depth
   ========================================================================== */
body.ph-body .ph-site-main .ph-sharp-card:hover,
body.ph-body .ph-site-main .ph-surface-card:hover,
body.ph-body .ph-site-main .ph-trust-card:hover,
body.ph-body .ph-site-main .ph-preview-tile:hover {
	transform: translateY(-6px) !important;
	box-shadow:
		0 8px 16px rgba(13, 27, 62, 0.08),
		0 24px 48px -16px rgba(0, 102, 255, 0.22) !important;
}

/* Homepage jobs hard block */
body.home .job_listings,
body.home .wp-job-manager,
body.home .ph-split-cta,
body.home [href*="/jobs"]:not(.site-footer *) {
	display: none !important;
}

@media (prefers-reduced-motion: reduce) {
	body.ph-body .ph-site-main .ph-h2::after {
		transform: scaleX(1) !important;
		transition: none !important;
	}
}
