/**
 * WherePDF Custom Styles
 * SaaS-inspired design system
 */

/* ============================================
   GLOBAL STYLES
   ============================================ */

:root {
	--wherepdf-primary: #627ae6;
	--wherepdf-primary-dark: #4a5fd1;
	--wherepdf-text-dark: #111827;
	--wherepdf-text-heading: #1f2933;
	--wherepdf-text-body: #4a5568;
	--wherepdf-text-muted: #6b7280;
	--wherepdf-text-light: #9ca3af;
	--wherepdf-bg-white: #ffffff;
	--wherepdf-bg-light: #f5f6fb;
	--wherepdf-bg-lighter: #e0e7ff;
	--wherepdf-border: #e5e7eb;
	--wherepdf-shadow-sm: 0 4px 20px rgba(0, 0, 0, 0.08);
	--wherepdf-shadow-md: 0 10px 40px rgba(0, 0, 0, 0.1);
	--wherepdf-shadow-primary: 0 10px 40px rgba(98, 122, 230, 0.15);
	--wherepdf-radius: 8px;
	--wherepdf-radius-lg: 12px;
	--wherepdf-radius-xl: 16px;
}

body {
	font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	color: var(--wherepdf-text-body);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	color: var(--wherepdf-text-heading);
	font-weight: 700;
	line-height: 1.2;
}

p {
	line-height: 1.7;
}

/* ============================================
   BUTTONS
   ============================================ */

.wp-block-button__link {
	border-radius: var(--wherepdf-radius);
	font-weight: 600;
	transition: all 0.2s ease;
	padding: 1rem 2rem;
}

.wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: var(--wherepdf-shadow-md);
}

/* Primary Button */
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background-color: var(--wherepdf-primary);
	color: white;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
	background-color: var(--wherepdf-primary-dark);
}

/* Outline Button */
.wp-block-button.is-style-outline .wp-block-button__link {
	border: 2px solid var(--wherepdf-primary);
	color: var(--wherepdf-primary);
	background: transparent;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: var(--wherepdf-primary);
	color: white;
}

/* ============================================
   CARDS & GROUPS
   ============================================ */

.wp-block-group {
	transition: all 0.3s ease;
}

/* Card hover effects */
.pricing-card,
.wp-block-group[style*="background-color:#ffffff"] {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.pricing-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--wherepdf-shadow-md) !important;
}

.pricing-card-featured {
	position: relative;
}

.pricing-card-featured::before {
	content: '';
	position: absolute;
	top: -2px;
	left: -2px;
	right: -2px;
	bottom: -2px;
	background: linear-gradient(135deg, var(--wherepdf-primary) 0%, #6366f1 100%);
	border-radius: var(--wherepdf-radius-xl);
	z-index: -1;
}

/* ============================================
   LISTS
   ============================================ */

.wp-block-list li {
	margin-bottom: 0.75rem;
	padding-left: 0.5rem;
}

.wp-block-list li::marker {
	color: var(--wherepdf-primary);
}

/* ============================================
   SEPARATORS
   ============================================ */

.wp-block-separator {
	border-color: var(--wherepdf-border);
	opacity: 1;
}

/* ============================================
   HEADER & NAVIGATION
   ============================================ */

.site-header {
	background-color: white;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.main-header-menu a {
	color: var(--wherepdf-text-body);
	font-weight: 500;
	transition: color 0.2s ease;
}

.main-header-menu a:hover {
	color: var(--wherepdf-primary);
}

.site-title a,
.site-description {
	color: var(--wherepdf-text-heading);
}

.site-title a {
	font-weight: 800;
	font-size: 1.5rem;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */

@media (max-width: 768px) {
	.wp-block-columns {
		flex-direction: column;
	}

	.wp-block-column {
		flex-basis: 100% !important;
	}

	h1 {
		font-size: 2rem !important;
	}

	h2 {
		font-size: 1.75rem !important;
	}

	.wp-block-group[style*="padding"] {
		padding-left: 1rem !important;
		padding-right: 1rem !important;
	}
}

/* ============================================
   SMOOTH SCROLLING
   ============================================ */

html {
	scroll-behavior: smooth;
}

/* Anchor offset for smooth scroll to sections */
[id] {
	scroll-margin-top: 100px;
}

/* ============================================
   ANIMATIONS
   ============================================ */

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.wp-block-group {
	animation: fadeInUp 0.6s ease-out;
}

/* ============================================
   UTILITY CLASSES
   ============================================ */

.has-text-align-center {
	text-align: center;
}

.alignwide {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

.alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* ============================================
   CUSTOM GRADIENT BACKGROUNDS
   ============================================ */

.wp-block-group[style*="gradient"] {
	background-size: cover;
	background-position: center;
}

/* ============================================
   HIDE HOME PAGE TITLE
   ============================================ */

.home .entry-header,
.page-id-5 .entry-header {
	display: none;
}

/* ============================================
   HOME PAGE SECTIONS - Simple flat backgrounds
   ============================================ */

/* Remove gradient overrides - let sections use their natural backgrounds */

/* ============================================
   ENHANCED CARD STYLES
   ============================================ */

/* Feature, use case, and pricing cards */
.wherepdf-feature-card,
.pricing-card,
.wp-block-group[style*="background-color:#ffffff"]:not(.alignfull) {
	border-radius: 16px !important;
	box-shadow: 0 18px 40px rgba(15, 23, 42, 0.10) !important;
	transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
	border: 1px solid rgba(229, 231, 235, 0.8) !important;
}

.wherepdf-feature-card:hover,
.pricing-card:hover,
.wp-block-group[style*="background-color:#ffffff"]:not(.alignfull):hover {
	transform: translateY(-4px) !important;
	box-shadow: 0 24px 50px rgba(15, 23, 42, 0.15) !important;
	border-color: #627ae6 !important;
}

/* ============================================
   FINAL CTA GRADIENT
   ============================================ */

/* Strong gradient for final CTA section */
.wp-block-group[style*="background-color:#627ae6"],
.wp-block-group[style*="background-color: #627ae6"] {
	background: linear-gradient(135deg, #4f46e5 0%, #6366f1 40%, #0ea5e9 100%) !important;
	box-shadow: 0 20px 60px rgba(79, 70, 229, 0.25);
}

/* Enhanced white button in CTA section */
.wp-block-group[style*="background-color:#627ae6"] .wp-block-button__link,
.wp-block-group[style*="background: linear-gradient"] .wp-block-button__link {
	box-shadow: 0 10px 30px rgba(255, 255, 255, 0.3);
}

.wp-block-group[style*="background-color:#627ae6"] .wp-block-button__link:hover,
.wp-block-group[style*="background: linear-gradient"] .wp-block-button__link:hover {
	box-shadow: 0 15px 40px rgba(255, 255, 255, 0.4);
}

/* ============================================
   FEATURE ICON STYLE (Skip the Skimming section)
   ============================================ */

.wherepdf-feature-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 52px !important;
	height: 52px !important;
	border-radius: 999px !important;
	border: 1.5px solid rgba(98, 122, 230, 0.6) !important;
	background: radial-gradient(circle at top, rgba(255, 255, 255, 0.2), rgba(99, 102, 241, 0.15)) !important;
	color: #4f46e5 !important;
	font-size: 1.5rem !important;
	margin-bottom: 1rem !important;
	padding: 0 !important;
}

/* Remove old blue block style for icons */
.wherepdf-feature-icon.has-background {
	background: radial-gradient(circle at top, rgba(255, 255, 255, 0.2), rgba(99, 102, 241, 0.15)) !important;
}