/* =========================================================
   5G Hub — animations (scroll reveal, header 5G signal FX, micro-interactions)
   Developed by Ecomify Official
   ========================================================= */

:root { --gh-anim-dur: .75s; --gh-anim-ease: cubic-bezier(.2, .7, .2, 1); --gh-fx: #4fc3ff; }

/* ---------- Scroll reveal ---------- */
.gh-anim-on [data-gh-a] { transition: opacity var(--gh-anim-dur) var(--gh-anim-ease), transform var(--gh-anim-dur) var(--gh-anim-ease), filter var(--gh-anim-dur) var(--gh-anim-ease); transition-delay: var(--gh-d, 0s); will-change: opacity, transform; }
.gh-anim-on [data-gh-a]:not(.is-in) { opacity: 0; }
.gh-anim-on [data-gh-a="fade-up"]:not(.is-in) { transform: translate3d(0, 34px, 0); }
.gh-anim-on [data-gh-a="fade-down"]:not(.is-in) { transform: translate3d(0, -30px, 0); }
.gh-anim-on [data-gh-a="fade-left"]:not(.is-in) { transform: translate3d(40px, 0, 0); }
.gh-anim-on [data-gh-a="fade-right"]:not(.is-in) { transform: translate3d(-40px, 0, 0); }
.gh-anim-on [data-gh-a="zoom-in"]:not(.is-in) { transform: scale(.9); }
.gh-anim-on [data-gh-a="zoom-out"]:not(.is-in) { transform: scale(1.08); }
.gh-anim-on [data-gh-a="flip-up"]:not(.is-in) { transform: perspective(900px) rotateX(18deg) translate3d(0, 30px, 0); transform-origin: 50% 100%; }
.gh-anim-on [data-gh-a="blur-in"]:not(.is-in) { filter: blur(10px); transform: scale(.97); }
.gh-anim-on [data-gh-a].is-in { opacity: 1; transform: none; filter: none; }
/* Never hide content in the Elementor editor or for reduced motion */
.elementor-editor-active [data-gh-a], .elementor-editor-preview [data-gh-a] { opacity: 1 !important; transform: none !important; filter: none !important; }
@media (prefers-reduced-motion: reduce) {
	.gh-anim-on [data-gh-a] { opacity: 1 !important; transform: none !important; filter: none !important; transition: none !important; }
	.gh-fx-canvas, .gh-header__line::after { display: none !important; }
}

/* ---------- Hero: soft zoom on the active slide ---------- */
.gh-hero__slide { overflow: hidden; }
.gh-hero.gh-hero--kb .gh-slide.is-current .gh-hero__img { animation: gh-kenburns 7s ease-out both; }
@keyframes gh-kenburns { from { transform: scale(1.07); } to { transform: scale(1); } }
.gh-slider--hero .gh-slider__track { align-items: flex-start; transition: height .45s ease; }
.gh-pic { display: block; }
.gh-pic img { width: 100%; height: auto !important; }

/* ---------- Header 5G signal FX ---------- */
.gh-ann, .gh-header { isolation: isolate; }
.gh-fx-canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 3; mix-blend-mode: screen; }
.gh-header .gh-fx-canvas { mix-blend-mode: normal; z-index: 3; }
.gh-header__in { position: relative; z-index: 2; }
/* light sweep across the announcement bar */
.gh-fx-on .gh-ann::after {
	content: ""; position: absolute; top: 0; bottom: 0; left: -30%; width: 30%; z-index: 2; pointer-events: none;
	background: linear-gradient(100deg, transparent, rgba(120, 200, 255, .22), rgba(255, 255, 255, .28), rgba(120, 200, 255, .22), transparent);
	animation: gh-sweep 5.5s ease-in-out infinite;
}
@keyframes gh-sweep { 0% { left: -30%; } 55%, 100% { left: 110%; } }
.gh-fx-on .gh-ann__item .gh-icon { animation: gh-icon-flash 4s ease-in-out infinite; }
.gh-fx-on .gh-ann__item:nth-child(2n) .gh-icon { animation-delay: 1.3s; }
.gh-fx-on .gh-ann__item:nth-child(3n) .gh-icon { animation-delay: 2.4s; }
@keyframes gh-icon-flash { 0%, 86%, 100% { filter: none; color: inherit; } 90% { filter: drop-shadow(0 0 6px var(--gh-fx)); color: #bfe8ff; } 93% { filter: none; } 96% { filter: drop-shadow(0 0 8px var(--gh-fx)); color: #fff; } }

/* logo: 5G signal waves + electric glow */
.gh-fx-on .gh-header__brand { position: relative; }
.gh-fx-on .gh-header__brand .gh-logo { position: relative; animation: gh-logo-glow 4.8s ease-in-out infinite; }
@keyframes gh-logo-glow {
	0%, 80%, 100% { filter: none; }
	83% { filter: drop-shadow(0 0 6px rgba(79, 195, 255, .9)) brightness(1.15); }
	85% { filter: none; }
	88% { filter: drop-shadow(0 0 10px rgba(79, 195, 255, .95)) brightness(1.25); }
	92% { filter: drop-shadow(0 0 3px rgba(79, 195, 255, .5)); }
}
.gh-fx-on .gh-logo__arc path { stroke-dasharray: 30; animation: gh-wave 1.8s ease-in-out infinite; }
.gh-fx-on .gh-logo__arc path:nth-child(2) { animation-delay: .25s; }
@keyframes gh-wave { 0% { opacity: .25; } 40% { opacity: 1; } 100% { opacity: .25; } }
.gh-fx-on .gh-header__brand .gh-logo::after {
	content: ""; position: absolute; left: 4px; top: 50%; width: 40px; height: 40px; margin-top: -20px; border-radius: 50%;
	border: 2px solid rgba(79, 195, 255, .55); opacity: 0; pointer-events: none; animation: gh-ping 2.8s ease-out infinite;
}
@keyframes gh-ping { 0% { transform: scale(.4); opacity: .8; } 100% { transform: scale(2.4); opacity: 0; } }

/* signal line under the header */
.gh-header__line { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; overflow: hidden; pointer-events: none; z-index: 3; }
.gh-header__line::after { content: ""; position: absolute; top: 0; left: -25%; width: 25%; height: 100%; background: linear-gradient(90deg, transparent, var(--gh-accent), #7fd4ff, transparent); animation: gh-line 3.6s linear infinite; }
@keyframes gh-line { from { left: -25%; } to { left: 100%; } }

/* active menu pill shine + cart badge pulse */
.gh-fx-on .gh-menu > li.current-menu-item > a, .gh-fx-on .gh-menu > li.current_page_item > a { position: relative; overflow: hidden; }
.gh-fx-on .gh-menu > li.current-menu-item > a::before, .gh-fx-on .gh-menu > li.current_page_item > a::before {
	content: ""; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; transform: skewX(-20deg);
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .45), transparent); animation: gh-shine 4s ease-in-out infinite;
}
@keyframes gh-shine { 0%, 60% { left: -60%; } 100% { left: 130%; } }
.gh-count.gh-bump { animation: gh-bump .5s ease; }
@keyframes gh-bump { 0% { transform: scale(1); } 40% { transform: scale(1.45); } 100% { transform: scale(1); } }
.gh-cart-count:not([data-count="0"]) { box-shadow: 0 0 0 0 rgba(22, 82, 240, .5); animation: gh-pulse 2.4s infinite; }
@keyframes gh-pulse { 0% { box-shadow: 0 0 0 0 rgba(22, 82, 240, .55); } 70% { box-shadow: 0 0 0 8px rgba(22, 82, 240, 0); } 100% { box-shadow: 0 0 0 0 rgba(22, 82, 240, 0); } }

/* ---------- Micro-interactions ---------- */
.gh-btn { position: relative; overflow: hidden; }
.gh-btn::after { content: ""; position: absolute; top: 0; bottom: 0; left: -75%; width: 50%; transform: skewX(-20deg); background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent); transition: left .6s ease; pointer-events: none; }
.gh-btn:hover::after { left: 130%; }
.gh-btn .gh-icon-arrow-right { transition: transform .25s; }
.gh-btn:hover .gh-icon-arrow-right, .gh-head__link:hover .gh-icon-arrow-right { transform: translateX(4px); }
.gh-head__link .gh-icon { transition: transform .25s; }

.gh-badge::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .5) 50%, transparent 70%); background-size: 250% 100%; animation: gh-badge 3.5s ease-in-out infinite; pointer-events: none; }
.gh-badge { overflow: hidden; }
@keyframes gh-badge { 0%, 55% { background-position: 150% 0; } 100% { background-position: -100% 0; } }

.gh-feat__icon { transition: transform .35s var(--gh-anim-ease), color .25s; }
.gh-feat:hover .gh-feat__icon { transform: translateY(-4px) scale(1.08); color: var(--gh-accent); }
.gh-feats--cards .gh-feat { transition: box-shadow .25s, border-color .25s, transform .25s; }
.gh-feats--cards .gh-feat:hover { transform: translateY(-3px); }
.gh-cat__img img, .gh-coll__img img { transition: transform .5s ease; }
.gh-cat:hover .gh-cat__img img, .gh-coll:hover .gh-coll__img img { transform: scale(1.06); }
.gh-cat__img, .gh-coll__img { overflow: hidden; border-radius: 8px; }
.gh-wish:active { transform: scale(.85); }
.gh-wish.is-active svg { animation: gh-heart .45s ease; }
@keyframes gh-heart { 0% { transform: scale(1); } 40% { transform: scale(1.35); } 100% { transform: scale(1); } }
.gh-review { transition: transform .3s, box-shadow .3s; }
.gh-review:hover { transform: translateY(-4px); box-shadow: var(--gh-shadow); }
.gh-review__quote { animation: gh-float 4s ease-in-out infinite; }
.gh-nl__icon { animation: gh-float 3.2s ease-in-out infinite; }
@keyframes gh-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
.gh-faq__5g .gh-icon path { animation: gh-wave 1.8s ease-in-out infinite; }
.gh-faq__item { transition: box-shadow .25s, border-color .25s, transform .25s; }
.gh-faq__item:hover { transform: translateX(3px); }
.gh-faq__item[open] .gh-faq__a { animation: gh-open .35s ease; }
@keyframes gh-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.gh-pp__cart .gh-buy-now { animation: gh-buy 2.6s ease-in-out infinite; }
@keyframes gh-buy { 0%, 100% { box-shadow: 0 8px 20px rgba(22, 82, 240, .25); } 50% { box-shadow: 0 8px 28px rgba(22, 82, 240, .5), 0 0 0 4px rgba(22, 82, 240, .12); } }
.gh-kb__item svg { transition: transform .35s; }
.gh-kb__item:hover svg { transform: translateY(-4px) scale(1.1); }
.gh-social a { transition: transform .25s, background .25s; }
.gh-social a:hover { transform: translateY(-3px); }
.gh-flinks a { transition: color .2s, padding .2s; }
.gh-flinks a:hover { padding-left: 4px; }
.gh-ccard__icon { transition: transform .35s; }
.gh-ccard:hover .gh-ccard__icon { transform: rotate(-8deg) scale(1.1); }
.gh-pagehero::after { animation: gh-spin 30s linear infinite; }
@keyframes gh-spin { to { transform: rotate(360deg); } }
.gh-bnav a .gh-icon { transition: transform .25s; }
.gh-bnav a:active .gh-icon, .gh-bnav a.is-active .gh-icon { transform: translateY(-2px); }