/**
 * Pure Haven IT — Homepage refinement (Elementor Custom CSS)
 * Paste into Elementor → Site Settings → Custom CSS if using Elementor homepage.
 */

/* Section spacing */
.ph-refine-section { padding: 96px 0; }
.ph-refine-section--compact { padding: 40px 0; }
.ph-refine-section--grey { background: #F5F7FA; }

/* Eyebrow */
.ph-refine-eyebrow {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #00B4A6;
	margin-bottom: 12px;
	display: block;
}

/* Typography */
.ph-refine-h1 {
	font-family: Montserrat, sans-serif;
	font-weight: 700;
	font-size: clamp(2.5rem, 5vw, 3.75rem);
	line-height: 1.1;
	letter-spacing: -0.03em;
	color: #FFFFFF;
}

.ph-refine-h2 {
	font-family: Montserrat, sans-serif;
	font-weight: 700;
	font-size: clamp(1.75rem, 3vw, 2.25rem);
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: #0D1B3E;
}

.ph-refine-body {
	font-family: Inter, sans-serif;
	font-size: 17px;
	line-height: 1.6;
	color: #1E293B;
}

.ph-refine-muted {
	color: #64748B;
	font-size: 16px;
	line-height: 1.6;
}

/* Buttons */
.ph-refine-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 28px;
	border-radius: 9999px;
	font-family: Inter, sans-serif;
	font-weight: 600;
	font-size: 15px;
	text-decoration: none;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ph-refine-btn:hover { transform: translateY(-2px); }

.ph-refine-btn--orange {
	background: #FF6B00;
	color: #FFFFFF;
	box-shadow: 0 8px 24px rgba(255, 107, 0, 0.22);
}

.ph-refine-btn--blue {
	background: #0066FF;
	color: #FFFFFF;
}

.ph-refine-btn--ghost {
	background: transparent;
	color: #0066FF;
	border: 2px solid #0066FF;
}

/* Cards */
.ph-refine-card {
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 16px;
	padding: 32px;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.ph-refine-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 48px rgba(13, 27, 62, 0.10);
	border-color: rgba(0, 180, 166, 0.35);
}

/* Preview tiles */
.ph-refine-tile {
	background: rgba(255, 255, 255, 0.92);
	border: 1px solid #E2E8F0;
	border-radius: 16px;
	padding: 24px;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.ph-refine-tile:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 24px rgba(13, 27, 62, 0.08);
}

/* Hero gradient helper class for container */
.ph-refine-hero-bg {
	background: linear-gradient(135deg, #081428 0%, #0D1B3E 45%, #1A2F5C 100%);
	position: relative;
	overflow: hidden;
}

.ph-refine-hero-bg::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 20% 50%, rgba(0, 102, 255, 0.25) 0%, transparent 50%),
		radial-gradient(circle at 80% 20%, rgba(0, 180, 166, 0.2) 0%, transparent 40%);
	pointer-events: none;
}

@media (max-width: 768px) {
	.ph-refine-section { padding: 64px 0; }
	.ph-refine-btn { width: 100%; justify-content: center; }
}