/*
Theme Name: EalSuite
Theme URI: https://ealsuite.com
Description: Lightweight block theme for ealsuite.com — replaces Divi. Everything is editable in Appearance → Editor.
Version: 1.0.0
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: ealsuite
*/

/* ---------- Header ---------- */
.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	transition: box-shadow 0.2s ease;
}
.admin-bar .site-header { top: 32px; }
.site-header.is-scrolled { box-shadow: 0 2px 18px rgba(0, 0, 0, 0.08); }

.site-header .wp-block-navigation .wp-block-navigation-item__content { color: var(--wp--preset--color--black); }
.site-header .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--teal); text-decoration: none; }

/* Solutions mega menu: two groups side by side. */
.site-header .wp-block-navigation .mega-menu > .wp-block-navigation__submenu-container {
	flex-direction: row;
	gap: 10px;
	padding: 20px;
	min-width: 480px;
	border: 0;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.site-header .wp-block-navigation .mega-menu > .wp-block-navigation__submenu-container {
	align-items: flex-start;
}
.site-header .wp-block-navigation .mega-menu > .wp-block-navigation__submenu-container > .wp-block-navigation-item {
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
}
.site-header .wp-block-navigation .mega-menu > .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	font-weight: 700;
	color: var(--wp--preset--color--teal);
	pointer-events: none;
}
.site-header .wp-block-navigation .mega-menu > .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation__submenu-icon { display: none; }
.site-header .wp-block-navigation .mega-menu .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container {
	position: static;
	left: auto;
	top: auto;
	margin: 0;
	visibility: visible;
	opacity: 1;
	width: auto;
	height: auto;
	min-width: 200px;
	border: 0;
	box-shadow: none;
	padding: 0;
}
.site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-weight: 500;
	padding: 6px 10px;
}
.site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--teal);
}
@media (max-width: 600px) {
	.site-header .wp-block-navigation .mega-menu > .wp-block-navigation__submenu-container { flex-direction: column; min-width: 0; padding: 0 0 0 10px; box-shadow: none; }
}

/* ---------- Cover "Blend" style: photo blended over its gradient (Divi's background-blend-mode: overlay) ---------- */
.wp-block-cover.is-style-blend { isolation: isolate; }
.wp-block-cover.is-style-blend .wp-block-cover__background { mix-blend-mode: hard-light; opacity: 1; }

/* ---------- Buttons ---------- */
.wp-block-button__link { transition: opacity 0.2s ease, transform 0.2s ease; }
.wp-block-button__link:hover { opacity: 0.85; text-decoration: none; }

/* ---------- Logo carousel (pure CSS marquee) ---------- */
.logo-carousel {
	overflow: hidden;
	flex-wrap: nowrap !important;
	width: 100%;
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.logo-carousel .wp-block-image { flex: 0 0 auto; margin: 0; }
.logo-carousel img { width: auto !important; object-fit: contain; }
/* functions.php wraps the logos in .logo-track and duplicates them once. */
.logo-carousel .logo-track {
	display: flex;
	gap: 60px;
	padding-right: 60px;
	flex: 0 0 auto;
	align-items: center;
	animation: ealsuite-marquee 45s linear infinite;
}
.logo-carousel:hover .logo-track { animation-play-state: paused; }
@keyframes ealsuite-marquee {
	from { transform: translateX(0); }
	to { transform: translateX(-100%); }
}
@media (prefers-reduced-motion: reduce) {
	.logo-carousel { flex-wrap: wrap !important; justify-content: center; mask-image: none; }
	.logo-carousel .logo-track { animation: none; flex-wrap: wrap; justify-content: center; }
	.logo-carousel .logo-track[aria-hidden] { display: none; }
}

/* ---------- Stats ---------- */
.stat .stat-number { margin: 0; line-height: 1.2; }
.stat .wp-block-heading { margin-top: 8px; }

/* ---------- Team & testimonials ---------- */
.team-member .wp-block-image img { aspect-ratio: 1; object-fit: cover; }
.team-member .team-member-role { margin-top: 0; font-size: 14px; color: var(--wp--preset--color--teal); }
.testimonial .testimonial-title { margin-top: 0; font-size: 14px; }
.testimonial .wp-block-image img { width: 60px; height: 60px; border-radius: 50%; object-fit: cover; }

/* ---------- FAQ (details) ---------- */
.wp-block-details.is-style-faq {
	border: 1px solid #d9d9d9;
	border-radius: 5px;
	padding: 20px;
	margin-top: 0;
	margin-bottom: 20px;
	background: #fff;
}
.wp-block-details.is-style-faq summary {
	font-family: var(--wp--preset--font-family--raleway);
	font-weight: 600;
	font-size: 16px;
	color: var(--wp--preset--color--black);
	cursor: pointer;
	list-style: none;
	position: relative;
	padding-right: 30px;
}
.wp-block-details.is-style-faq summary::-webkit-details-marker { display: none; }
.wp-block-details.is-style-faq summary::after {
	content: "+";
	position: absolute;
	right: 0;
	top: -2px;
	font-size: 22px;
	font-weight: 400;
	color: var(--wp--preset--color--body);
}
.wp-block-details.is-style-faq[open] summary::after { content: "–"; }
.wp-block-details.is-style-faq[open] summary { margin-bottom: 14px; }

/* ---------- Footer ---------- */
.site-footer a { color: inherit; }
.site-footer a:hover { color: var(--wp--preset--color--teal); text-decoration: none; }
.site-footer .footer-links { list-style: none; padding-left: 0; line-height: 2.2; }

/* WhatsApp floating button */
.whatsapp-float {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: #25d366;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
	transition: transform 0.2s ease;
}
.whatsapp-float:hover { transform: scale(1.06); }
.whatsapp-float svg { width: 26px; height: 26px; fill: #fff; }

/* ---------- Layout helpers ---------- */
.wp-site-blocks > * + * { margin-block-start: 0; }
.site-main .wp-block-post-content > .divi-section { margin-block: 0; }
.wp-block-cover.divi-section .wp-block-cover__inner-container { width: 100%; }
@media (max-width: 781px) {
	.divi-section { padding-top: 40px !important; padding-bottom: 40px !important; }
	h1, .wp-block-heading.has-custom-font-size[style*="44px"] { font-size: 32px !important; }
	h2 { font-size: 28px !important; }
}