/**
 * Pure Haven IT — Ultra-sharp premium layer (v1.6.0)
 * Sharper typography, gradient borders, heading motion, section differentiation.
 * Brand colours and font families unchanged.
 */

/* --------------------------------------------------------------------------
   Global sharpness
   -------------------------------------------------------------------------- */
body.ph-body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

body.ph-body .ph-site-main,
body.ph-body .ph-page-shell {
	color: var(--ph-color-charcoal);
}

/* Highlighted inline text — brand teal (not black) */
.ph-text-highlight,
body.ph-body strong:not(.ph-btn *),
body.ph-body .ph-lead strong {
	color: var(--ph-color-accent) !important;
	font-weight: 600;
}

body.ph-body .ph-text-primary {
	color: var(--ph-color-primary) !important;
	font-weight: 600;
}

/* Animated section headings */
.ph-heading-anim {
	position: relative;
	display: inline-block;
}

.ph-heading-anim::after {
	content: "";
	display: block;
	width: 64px;
	height: 4px;
	margin-top: 14px;
	border-radius: 2px;
	background: linear-gradient(90deg, var(--ph-color-primary), var(--ph-color-accent));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.ph-heading-anim.is-visible::after,
.ph-section-header--center .ph-heading-anim::after {
	transform: scaleX(1);
}

.ph-section-header--center .ph-heading-anim::after {
	margin-inline: auto;
}

/* Eyebrow pulse on reveal */
.ph-eyebrow-anim {
	opacity: 0.92;
}

.ph-reveal.is-visible .ph-eyebrow-anim {
	animation: ph-eyebrow-glow 2.4s ease-in-out infinite alternate;
}

@keyframes ph-eyebrow-glow {
	from { opacity: 0.85; }
	to { opacity: 1; }
}

/* --------------------------------------------------------------------------
   Sharp cards — gradient border ring (replaces dull flat borders)
   -------------------------------------------------------------------------- */
.ph-sharp-card {
	position: relative;
	background: var(--ph-color-white);
	border-radius: var(--ph-radius-xl);
	padding: var(--ph-space-xl);
	box-shadow:
		0 1px 2px rgba(13, 27, 62, 0.06),
		0 8px 32px -8px rgba(13, 27, 62, 0.12);
	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s ease;
}

.ph-sharp-card::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(
		135deg,
		rgba(0, 102, 255, 0.45) 0%,
		rgba(0, 180, 166, 0.35) 50%,
		rgba(226, 232, 240, 0.8) 100%
	);
	-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;
}

.ph-sharp-card:hover {
	transform: translateY(-6px);
	box-shadow:
		0 4px 8px rgba(13, 27, 62, 0.08),
		0 20px 48px -12px rgba(0, 102, 255, 0.15);
}

.ph-sharp-card--teal-top::after {
	content: "";
	position: absolute;
	top: 0;
	left: var(--ph-space-xl);
	right: var(--ph-space-xl);
	height: 3px;
	border-radius: 0 0 2px 2px;
	background: linear-gradient(90deg, var(--ph-color-accent), var(--ph-color-primary));
}

.ph-sharp-card--navy {
	background: linear-gradient(145deg, var(--ph-color-navy) 0%, var(--ph-color-navy-light) 100%);
	color: var(--ph-color-text-inverse);
}

.ph-sharp-card--navy .ph-h2,
.ph-sharp-card--navy .ph-h3 {
	color: var(--ph-color-text-inverse) !important;
}

.ph-sharp-card--navy p {
	color: rgba(255, 255, 255, 0.88) !important;
}

/* Apply sharp treatment to existing surface cards site-wide */
.ph-surface-card:not(.ph-sharp-card),
.ph-trust-card,
.ph-feature-card,
.ph-preview-tile,
.ph-showcase-card {
	border: none;
	box-shadow:
		0 1px 2px rgba(13, 27, 62, 0.06),
		0 8px 28px -10px rgba(13, 27, 62, 0.1);
}

.ph-surface-card:not(.ph-sharp-card)::before,
.ph-trust-card::before,
.ph-feature-card::before,
.ph-preview-tile::before,
.ph-showcase-card::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(145deg, rgba(0, 102, 255, 0.28), rgba(0, 180, 166, 0.22), rgba(226, 232, 240, 0.9));
	-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;
}

.ph-surface-card,
.ph-trust-card,
.ph-feature-card,
.ph-preview-tile,
.ph-showcase-card {
	position: relative;
}

/* --------------------------------------------------------------------------
   Section differentiation — unique band treatments
   -------------------------------------------------------------------------- */
.ph-band--sharp-white {
	background:
		radial-gradient(circle at 0% 0%, rgba(0, 102, 255, 0.05) 0%, transparent 40%),
		var(--ph-color-white);
}

.ph-band--sharp-surface {
	background:
		linear-gradient(180deg, var(--ph-color-surface) 0%, #eef2f7 100%);
}

.ph-band--sharp-navy-edge {
	background: var(--ph-color-white);
	border-top: 3px solid transparent;
	border-image: linear-gradient(90deg, var(--ph-color-primary), var(--ph-color-accent)) 1;
}

.ph-band--mesh-blue {
	background-color: var(--ph-color-surface);
	background-image:
		radial-gradient(circle at 85% 15%, rgba(0, 102, 255, 0.07) 0%, transparent 42%),
		radial-gradient(circle at 10% 80%, rgba(0, 180, 166, 0.06) 0%, transparent 38%);
}

/* Section side accent */
.ph-section-accent {
	position: relative;
	padding-left: var(--ph-space-lg);
}

.ph-section-accent::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 4px;
	border-radius: 2px;
	background: linear-gradient(180deg, var(--ph-color-primary), var(--ph-color-accent));
}

/* --------------------------------------------------------------------------
   Abstract tech visual blocks (3D-style CSS graphics)
   -------------------------------------------------------------------------- */
.ph-visual-3d {
	position: relative;
	min-height: 320px;
	border-radius: var(--ph-radius-xl);
	overflow: hidden;
	background:
		linear-gradient(rgba(0, 102, 255, 0.1) 1px, transparent 1px),
		linear-gradient(90deg, rgba(0, 102, 255, 0.1) 1px, transparent 1px),
		linear-gradient(160deg, #0d1b3e 0%, #1a2f5c 55%, #081428 100%);
	background-size: 32px 32px, 32px 32px, auto;
	box-shadow:
		0 24px 48px -16px rgba(13, 27, 62, 0.35),
		inset 0 1px 0 rgba(255, 255, 255, 0.08);
	transform: perspective(800px) rotateY(-3deg);
	transition: transform 0.5s ease;
}

.ph-visual-3d:hover {
	transform: perspective(800px) rotateY(0deg);
}

.ph-visual-3d__panel {
	position: absolute;
	border: 1px solid rgba(0, 180, 166, 0.4);
	background: rgba(255, 255, 255, 0.06);
	backdrop-filter: blur(8px);
	border-radius: var(--ph-radius-md);
	animation: ph-float 10s ease-in-out infinite;
}

.ph-visual-3d__panel--1 {
	width: 42%;
	height: 28%;
	top: 16%;
	left: 10%;
}

.ph-visual-3d__panel--2 {
	width: 50%;
	height: 32%;
	bottom: 18%;
	right: 8%;
	animation-delay: -3s;
}

.ph-visual-3d__panel--3 {
	width: 30%;
	height: 20%;
	top: 42%;
	left: 48%;
	animation-delay: -6s;
}

.ph-visual-3d__glow {
	position: absolute;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	filter: blur(50px);
	opacity: 0.5;
}

.ph-visual-3d__glow--blue {
	background: var(--ph-color-primary);
	top: 20%;
	right: 15%;
}

.ph-visual-3d__glow--teal {
	background: var(--ph-color-accent);
	bottom: 20%;
	left: 20%;
}

/* Page hero premium */
.ph-page-hero--premium {
	padding: clamp(3rem, 6vw, 5rem) 0 clamp(2.5rem, 5vw, 4rem);
}

.ph-page-hero--premium .ph-page-hero__inner {
	position: relative;
}

.ph-page-hero--premium .ph-page-hero__title {
	letter-spacing: -0.03em;
}

/* Insights / CTA lead cards */
.ph-insight-lead {
	padding: var(--ph-space-2xl);
	border-radius: var(--ph-radius-xl);
	background: linear-gradient(135deg, var(--ph-color-navy) 0%, var(--ph-color-navy-light) 100%);
	box-shadow: 0 20px 60px -20px rgba(0, 102, 255, 0.35);
}

.ph-insight-lead .ph-section-accent {
	margin-bottom: var(--ph-space-xl);
}

/* Icon badge sharp */
.ph-icon-badge {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: var(--ph-radius-md);
	font-family: var(--ph-font-heading);
	font-weight: 700;
	font-size: 14px;
	color: var(--ph-color-primary);
	background: linear-gradient(145deg, var(--ph-color-electric-blue-light), #fff);
	box-shadow: 0 4px 12px rgba(0, 102, 255, 0.12);
	margin-bottom: var(--ph-space-md);
}

/* List sharp */
.ph-check-list li::marker {
	color: var(--ph-color-accent);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	.ph-heading-anim::after {
		transform: scaleX(1);
		transition: none;
	}

	.ph-eyebrow-anim,
	.ph-visual-3d__panel {
		animation: none !important;
	}
}