/**
 * DigiAdmyzer Main Stylesheet
 * 
 * NOTE: 90% of layout and design is handled by Elementor. 
 * This file contains the root Design System variables and global base styles.
 */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Montserrat:wght@400;500;600;700&family=Poppins:wght@300;400;500;600&display=swap');

:root {
	/* Colors */
	--green: #61CE70;
	--green-dark: #4ab558;
	--green-light: rgba(97, 206, 112, 0.12);
	--dark: #111827;
	--dark2: #1f2937;
	--dark3: #374151;
	--gray: #6b7280;
	--light: #f9fafb;
	--white: #ffffff;
	--border: rgba(255, 255, 255, 0.08);

	/* Typography - Fallbacks if Elementor fonts don't load immediately */
	--font-head: 'Oswald', sans-serif;
	--font-sub: 'Montserrat', sans-serif;
	--font-body: 'Poppins', sans-serif;

	/* Structural & Radius */
	--radius: 12px;
	--radius-sm: 8px;

	/* Shadows */
	--shadow: 0 4px 24px rgba(0, 0, 0, 0.18);
	--shadow-green: 0 4px 24px rgba(97, 206, 112, 0.25);
}

/* Base resets */
*, *::before, *::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	font-family: var(--font-body);
	background-color: var(--dark);
	color: #d1d5db; /* Text Secondary */
	margin: 0;
	padding: 0;
	overflow-x: hidden;
}

/* Global utility classes for custom widgets or hardcoded sections */
.btn-primary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--font-sub);
	font-weight: 700;
	font-size: 0.85rem;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding: 14px 32px;
	border-radius: 50px;
	border: none;
	cursor: pointer;
	transition: all 0.3s ease;
	background: var(--green);
	color: var(--dark);
	box-shadow: var(--shadow-green);
	text-decoration: none;
}

.btn-primary:hover {
	background: var(--green-dark);
	transform: translateY(-2px);
	box-shadow: 0 8px 32px rgba(97, 206, 112, 0.4);
	color: var(--dark);
}

/* Animations */
.fade-up {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-up.visible {
	opacity: 1;
	transform: translateY(0);
}

/* Force visibility of animated elements inside the Elementor editor */
.elementor-editor-active .fade-up,
.elementor-editor-active .animate-on-scroll {
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
}

/* Screen reader text for accessibility */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* ─── HEADER & MENU FIXES (Elementor Free) ─── */
.da-global-header {
	background: rgba(17,24,39,0.95) !important;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-bottom: 1px solid var(--border);
}

.da-mobile-menu-open .hfe-nav-menu__layout-hamburger .hfe-dropdown {
	background: rgba(17,24,39,0.98) !important;
	border-top: 1px solid var(--border);
}

/* ─── WHATSAPP FLOAT ─── */
.whatsapp-float {
	position: fixed !important;
	bottom: 24px !important;
	right: 24px !important;
	z-index: 1000 !important;
	width: 60px !important;
	height: 60px !important;
	border-radius: 50% !important;
	background-color: #25D366 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-shadow: 0 4px 20px rgba(37,211,102,0.5) !important;
	animation: pulse 2s infinite !important;
	padding: 0 !important;
	margin: 0 !important;
	min-width: 0 !important;
}

.whatsapp-float .elementor-widget-container,
.whatsapp-float .elementor-icon-wrapper,
.whatsapp-float .elementor-icon {
	width: 100% !important;
	height: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: transparent !important;
	border-radius: 50% !important;
	padding: 0 !important;
	margin: 0 !important;
}

.whatsapp-float i {
	color: white !important;
	font-size: 32px !important;
}

.whatsapp-float:hover {
	transform: scale(1.05);
}

@keyframes pulse {
	0%,100% { box-shadow: 0 4px 20px rgba(37,211,102,0.5); }
	50% { box-shadow: 0 4px 36px rgba(37,211,102,0.8); }
}