/* ==========================================================================
   Helti FX — global styles for helti-des.com
   Colors and fonts mirror Elementor → Site Settings (Global colors/fonts).
   ========================================================================== */

:root {
	--hx-bg: #0A0910;
	--hx-surface: #13111C;
	--hx-surface2: #1B1828;
	--hx-line: #2A2638;
	--hx-ink: #F2EFFA;
	--hx-text: #B9B3CB;
	--hx-muted: #8E88A3;
	--hx-brand: #8A4DFF;
	--hx-accent: #C8FF4D;
	--hx-display: "Unbounded", "Noto Sans Armenian", sans-serif;
	--hx-body: "Manrope", "Noto Sans Armenian", sans-serif;
	--hx-mono: "JetBrains Mono", ui-monospace, monospace;
	--hx-ease: cubic-bezier(.22, 1, .36, 1);
	--hx-r: 20px;
}

/* ---------- Base ---------- */
html {
	background: var(--hx-bg);
	scrollbar-color: #3a3450 var(--hx-bg);
}

html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

body.hx {
	background-color: var(--hx-bg);
	color: var(--hx-text);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: clip;
}

body.hx ::selection { background: var(--hx-accent); color: var(--hx-bg); }

body.hx a { transition: color .25s var(--hx-ease); }

/* film grain */
body.hx::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 9990;
	pointer-events: none;
	opacity: .05;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Astra leftovers */
body.hx #page, body.hx .site-content, body.hx .ast-container { background: transparent; }
body.hx .site-header:not(#masthead) { display: none; }
body.hx #ast-scroll-top { display: none !important; }

/* Armenian: Unbounded and Manrope have no Armenian glyphs */
.hx-lang-hy .elementor-heading-title,
.hx-lang-hy .hx-display { font-family: var(--hx-display) !important; }
.hx-lang-hy,
.hx-lang-hy .elementor-widget-text-editor,
.hx-lang-hy .elementor-button,
.hx-lang-hy .elementor-icon-list-text,
.hx-lang-hy .elementor-counter-title,
.hx-lang-hy .elementor-tab-title,
.hx-lang-hy .hx-nav a,
.hx-lang-hy .hx-mmenu a { font-family: var(--hx-body) !important; }
.hx-lang-hy .elementor-heading-title { letter-spacing: 0 !important; }

/* ---------- Typography helpers ---------- */
.hx-hl { color: var(--hx-accent); }
.hx-violet { color: var(--hx-brand); }
.hx-outline {
	color: transparent;
	-webkit-text-stroke: 1.5px var(--hx-ink);
}
.hx-it { font-style: italic; font-weight: 400; }

.hx-label .elementor-heading-title,
.hx-label p,
p.hx-label {
	display: inline-flex;
	align-items: center;
	gap: .6em;
}
.hx-label .elementor-heading-title::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--hx-accent);
	box-shadow: 0 0 12px var(--hx-accent);
}

.hx-measure { max-width: 62ch; }

/* ---------- Header ---------- */
#masthead { position: relative; z-index: 1000; }

.hx-header {
	position: fixed !important;
	top: 14px;
	left: 50%;
	width: min(1240px, calc(100% - 28px)) !important;
	transform: translateX(-50%);
	z-index: 1000;
	border: 1px solid transparent;
	border-radius: 999px;
	transition: transform .5s var(--hx-ease), background-color .4s, border-color .4s, backdrop-filter .4s;
}
.admin-bar .hx-header { top: 46px; }

html.hx-scrolled .hx-header {
	background-color: rgba(19, 17, 28, .72);
	border-color: rgba(255, 255, 255, .08);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
	backdrop-filter: blur(16px) saturate(140%);
}
html.hx-hide-header:not(.hx-menu-open) .hx-header { transform: translate(-50%, calc(-100% - 30px)); }

.hx-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 2px;
	width: 100%;
	transform-origin: 0 50%;
	transform: scaleX(0);
	background: var(--hx-accent);
	z-index: 1001;
	pointer-events: none;
}

/* Logo */
.hx-logo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none !important;
	color: var(--hx-ink) !important;
}
.hx-logo__mark {
	width: 38px;
	height: 38px;
	flex: none;
	transition: transform .7s var(--hx-ease);
	filter: drop-shadow(0 4px 14px rgba(138, 77, 255, .45));
}
.hx-logo:hover .hx-logo__mark { transform: rotate(-72deg) scale(1.06); }
.hx-logo__word {
	font-family: "Unbounded", sans-serif;
	font-weight: 700;
	font-size: 19px;
	letter-spacing: -.02em;
}
.hx-logo__word b { font-weight: 400; color: var(--hx-accent); }

/* Desktop nav */
.hx-nav ul {
	display: flex;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.hx-nav a {
	position: relative;
	display: block;
	padding: 10px 14px;
	border-radius: 999px;
	font-family: var(--hx-body);
	font-weight: 600;
	font-size: 15px;
	color: var(--hx-text) !important;
	text-decoration: none !important;
	overflow: hidden;
}
.hx-nav a span {
	position: relative;
	display: block;
	transition: transform .45s var(--hx-ease);
}
.hx-nav a span::after {
	content: attr(data-text);
	position: absolute;
	left: 0;
	top: 100%;
	padding-top: 10px;
	color: var(--hx-accent);
}
.hx-nav a:hover span { transform: translateY(calc(-100% - 10px)); }
.hx-nav a.is-current { color: var(--hx-ink) !important; background: rgba(255, 255, 255, .06); }

.hx-nav-wrap .elementor-shortcode { display: flex; align-items: center; }

/* Language pills */
.hx-lang {
	display: inline-flex;
	padding: 3px;
	gap: 2px;
	border: 1px solid var(--hx-line);
	border-radius: 999px;
	background: rgba(10, 9, 16, .5);
}
.hx-lang a {
	padding: 6px 10px;
	border-radius: 999px;
	font-family: var(--hx-mono) !important;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .06em;
	line-height: 1;
	color: var(--hx-muted) !important;
	text-decoration: none !important;
}
.hx-lang a:hover { color: var(--hx-ink) !important; }
.hx-lang a.is-active { background: var(--hx-ink); color: var(--hx-bg) !important; }

/* Burger */
.hx-burger {
	display: none;
	position: relative;
	width: 46px;
	height: 46px;
	padding: 0 !important;
	border: 1px solid var(--hx-line) !important;
	border-radius: 50% !important;
	background: var(--hx-surface) !important;
	cursor: pointer;
	z-index: 1002;
}
.hx-burger span {
	position: absolute;
	left: 14px;
	right: 14px;
	height: 2px;
	border-radius: 2px;
	background: var(--hx-ink);
	transition: transform .45s var(--hx-ease), top .45s var(--hx-ease);
}
.hx-burger span:nth-child(1) { top: 18px; }
.hx-burger span:nth-child(2) { top: 26px; }
.hx-menu-open .hx-burger span:nth-child(1) { top: 22px; transform: rotate(45deg); }
.hx-menu-open .hx-burger span:nth-child(2) { top: 22px; transform: rotate(-45deg); }

/* Fullscreen mobile menu */
.hx-mmenu {
	position: fixed;
	inset: 0;
	z-index: 999;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 110px 24px 32px;
	background: var(--hx-bg);
	clip-path: circle(0% at calc(100% - 50px) 44px);
	visibility: hidden;
	transition: clip-path .8s var(--hx-ease), visibility 0s .8s;
	overflow-y: auto;
}
.hx-menu-open .hx-mmenu {
	clip-path: circle(150% at calc(100% - 50px) 44px);
	visibility: visible;
	transition: clip-path .8s var(--hx-ease), visibility 0s;
}
.hx-mmenu__glow {
	position: absolute;
	width: 120vw;
	height: 120vw;
	right: -60vw;
	bottom: -60vw;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(138, 77, 255, .35), transparent 60%);
	pointer-events: none;
}
.hx-mmenu ul { position: relative; margin: 0; padding: 0; list-style: none; }
.hx-mmenu li {
	opacity: 0;
	transform: translateY(40px);
	transition: opacity .6s var(--hx-ease), transform .6s var(--hx-ease);
	transition-delay: calc(.15s + var(--i) * .06s);
}
.hx-menu-open .hx-mmenu li { opacity: 1; transform: none; }
.hx-mmenu li a {
	display: flex;
	align-items: baseline;
	gap: 14px;
	padding: 8px 0;
	border-bottom: 1px solid var(--hx-line);
	font-family: var(--hx-display);
	font-weight: 700;
	font-size: clamp(30px, 9vw, 56px);
	line-height: 1.1;
	letter-spacing: -.03em;
	color: var(--hx-ink) !important;
	text-decoration: none !important;
}
.hx-mmenu li a small {
	font-family: var(--hx-mono);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--hx-muted);
}
.hx-mmenu li a.is-current { color: var(--hx-accent) !important; }
.hx-mmenu__foot {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	margin-top: 36px;
}
.hx-m-cta {
	display: inline-flex;
	gap: 10px;
	padding: 16px 26px;
	border-radius: 999px;
	background: var(--hx-accent);
	color: var(--hx-bg) !important;
	font-family: var(--hx-body);
	font-weight: 700;
	text-decoration: none !important;
}
.hx-mmenu__contacts { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.hx-mmenu__contacts a { color: var(--hx-text) !important; font-size: 15px; }

@media (max-width: 1024px) {
	.hx-nav { display: none; }
	.hx-burger { display: block; }
	.hx-header .hx-hide-tablet { display: none !important; }
}

/* ---------- Buttons ---------- */
body.hx .elementor-button {
	transition: background-color .3s, color .3s, border-color .3s, transform .4s var(--hx-ease), box-shadow .3s;
	will-change: transform;
}
body.hx .elementor-button:hover { box-shadow: 0 10px 40px -10px rgba(200, 255, 77, .55); }
body.hx .hx-btn-ghost .elementor-button:hover { box-shadow: none; }
body.hx .elementor-button .elementor-button-icon svg { transition: transform .4s var(--hx-ease); }
body.hx .elementor-button:hover .elementor-button-icon svg { transform: translateX(4px) rotate(-45deg); }

/* ---------- Sections ---------- */
.hx-section { position: relative; }

.hx-glow { position: relative; isolation: isolate; }
.hx-glow::before {
	content: "";
	position: absolute;
	z-index: -1;
	width: 900px;
	height: 900px;
	left: var(--gx, 70%);
	top: var(--gy, 40%);
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: radial-gradient(circle, rgba(138, 77, 255, .22), transparent 62%);
	pointer-events: none;
}

/* ---------- Hero ---------- */
.hx-hero {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}
.hx-hero > .e-con-inner { position: relative; z-index: 2; }
.hx-hero::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 180px;
	background: linear-gradient(to bottom, transparent, var(--hx-bg));
	z-index: 1;
	pointer-events: none;
}

.hx-3d { position: relative; }
.hx-3d canvas { display: block; width: 100% !important; height: 100% !important; }
.hx-3d-abs {
	position: absolute !important;
	inset: 0 -8% 0 38%;
	z-index: 0;
	pointer-events: auto;
}
.hx-3d-abs .elementor-widget-container,
.hx-3d-abs .elementor-widget-html,
.hx-3d-abs > div { height: 100%; }
.hx-3d-fill { width: 100%; height: 100%; min-height: 420px; }

.hx-hero-badge {
	position: absolute;
	right: 6%;
	bottom: 14%;
	z-index: 3;
	width: 132px;
	height: 132px;
	animation: hx-spin 18s linear infinite;
}
.hx-hero-badge text {
	font-family: var(--hx-mono);
	font-size: 10.5px;
	letter-spacing: .28em;
	text-transform: uppercase;
	fill: var(--hx-ink);
}
.hx-hero-badge__dot { fill: var(--hx-accent); }
@keyframes hx-spin { to { transform: rotate(360deg); } }

@media (max-width: 1024px) {
	.hx-3d-abs { inset: 8% -30% 20% 20%; opacity: .75; }
	.hx-hero-badge { width: 100px; height: 100px; right: 5%; bottom: 6%; }
}
@media (max-width: 767px) {
	.hx-3d-abs { inset: 0 -45% 35% 5%; opacity: .55; }
	.hx-hero-badge { display: none; }
}

/* ---------- Marquee ---------- */
.hx-marquees {
	position: relative;
	height: 220px;
	overflow: hidden;
	margin: -40px 0;
	z-index: 3;
}
.hx-marquee {
	position: absolute;
	left: -5%;
	width: 110%;
	top: 50%;
	padding: 18px 0;
	overflow: hidden;
	white-space: nowrap;
	transform: translateY(-50%) rotate(-3deg);
	background: var(--hx-accent);
	color: var(--hx-bg);
}
.hx-marquee--b {
	transform: translateY(-50%) rotate(2.5deg);
	background: var(--hx-brand);
	color: var(--hx-ink);
	opacity: .9;
}
.hx-marquee__track {
	display: inline-flex;
	animation: hx-marquee 32s linear infinite;
}
.hx-marquee--b .hx-marquee__track { animation-direction: reverse; animation-duration: 40s; }
.hx-marquee span {
	display: inline-flex;
	align-items: center;
	gap: 28px;
	padding-right: 28px;
	font-family: var(--hx-display);
	font-weight: 700;
	font-size: clamp(20px, 2.6vw, 34px);
	letter-spacing: -.02em;
	text-transform: uppercase;
}
.hx-marquee span::after { content: "✦"; font-size: .7em; }
@keyframes hx-marquee { to { transform: translateX(-50%); } }

/* ---------- Cards ---------- */
.hx-card {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	border: 1px solid var(--hx-line);
	border-radius: var(--hx-r);
	background-color: var(--hx-surface);
	transition: border-color .4s, transform .6s var(--hx-ease);
}
.hx-card::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	opacity: 0;
	transition: opacity .4s;
	background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%), rgba(200, 255, 77, .10), transparent 60%);
	pointer-events: none;
}
.hx-card:hover { border-color: #3d3752; }
.hx-card:hover::before { opacity: 1; }

.hx-card--violet {
	background: radial-gradient(120% 120% at 100% 0%, #5a2fd1 0%, #2a1666 40%, #15112a 100%);
	border-color: #4b2fa0;
}
.hx-card--lime {
	background-color: var(--hx-accent);
	border-color: var(--hx-accent);
}
.hx-card--lime * { color: var(--hx-bg) !important; }
.hx-card--lime::before { background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%), rgba(255, 255, 255, .45), transparent 60%); }

.hx-big-num .elementor-heading-title {
	font-family: var(--hx-display) !important;
	line-height: .9 !important;
}

/* Tilt */
.hx-tilt {
	transform-style: preserve-3d;
	will-change: transform;
}

/* ---------- Works ---------- */
.hx-work { cursor: none; }
.hx-work__shot {
	perspective: 1200px;
}
.hx-work__shot img {
	display: block;
	width: 100%;
	border-radius: 14px;
	border: 1px solid var(--hx-line);
	box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .8), 0 0 0 1px rgba(255, 255, 255, .03);
	transform: rotateX(var(--rx, 6deg)) rotateY(var(--ry, -8deg)) translateZ(0);
	transition: transform .8s var(--hx-ease);
}
.hx-work:hover .hx-work__shot img { --rx: 0deg; --ry: 0deg; transform: rotateX(0) rotateY(0) scale(1.02); }
.hx-work--alt .hx-work__shot img { --ry: 8deg; }

.hx-browser {
	position: relative;
	padding-top: 34px;
	border-radius: 16px;
	background: #1d1a29;
	border: 1px solid var(--hx-line);
	overflow: hidden;
}
.hx-browser::before {
	content: "";
	position: absolute;
	top: 13px;
	left: 16px;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #ff5f57;
	box-shadow: 15px 0 0 #febc2e, 30px 0 0 #28c840;
}
.hx-browser img { border-radius: 0 !important; border: 0 !important; box-shadow: none !important; transform: none !important; }

.hx-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.hx-tags li {
	padding: 7px 12px;
	border: 1px solid var(--hx-line);
	border-radius: 999px;
	font-family: var(--hx-mono);
	font-size: 12px;
	color: var(--hx-text);
}

.hx-stamp {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(200, 255, 77, .12);
	color: var(--hx-accent);
	font-family: var(--hx-mono);
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

/* Empty slot: "your project" */
.hx-slot {
	border: 1.5px dashed #3d3752 !important;
	background: repeating-linear-gradient(-45deg, transparent 0 14px, rgba(255, 255, 255, .015) 14px 28px), var(--hx-bg) !important;
}
.hx-slot:hover { border-color: var(--hx-accent) !important; }

/* ---------- Steps ---------- */
.hx-step { position: relative; }
.hx-step::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 2px;
	width: 100%;
	background: var(--hx-line);
}
.hx-step::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 2px;
	width: 100%;
	background: var(--hx-accent);
	transform: scaleX(0);
	transform-origin: 0 50%;
	transition: transform 1.2s var(--hx-ease);
	transition-delay: var(--d, 0s);
}
.hx-step.is-in::after,
.elementor-editor-active .hx-step::after { transform: scaleX(1); }
.hx-step-num .elementor-heading-title {
	font-family: var(--hx-mono) !important;
	color: var(--hx-accent) !important;
}

/* Check list */
.hx-checks .elementor-icon-list-item {
	padding: 14px 0 !important;
	border-bottom: 1px solid var(--hx-line);
}
.hx-checks .elementor-icon-list-icon svg { fill: var(--hx-accent) !important; }

/* ---------- FAQ (toggle widget) ---------- */
.hx-faq .elementor-toggle-item {
	margin: 0 0 10px !important;
	border: 1px solid var(--hx-line);
	border-radius: 16px;
	background: var(--hx-surface);
	overflow: hidden;
	transition: border-color .3s;
}
.hx-faq .elementor-toggle-item:hover { border-color: #3d3752; }
.hx-faq .elementor-tab-title {
	padding: 22px 24px !important;
	border: 0 !important;
}
.hx-faq .elementor-tab-content {
	padding: 0 24px 22px !important;
	border: 0 !important;
}
.hx-faq .elementor-toggle-icon svg { fill: var(--hx-accent) !important; }

/* ---------- Forms (WPForms) ---------- */
.hx-form .wpforms-container {
	--wpforms-field-background-color: #1B1828;
	--wpforms-field-border-color: #2A2638;
	--wpforms-field-text-color: #F2EFFA;
	--wpforms-label-color: #F2EFFA;
	--wpforms-label-sublabel-color: #8E88A3;
	--wpforms-label-error-color: #ff7a8a;
	--wpforms-field-border-radius: 12px;
	--wpforms-field-size-input-height: 52px;
	--wpforms-button-background-color: #C8FF4D;
	--wpforms-button-text-color: #0A0910;
	--wpforms-button-border-radius: 999px;
	--wpforms-button-size-height: 56px;
	--wpforms-button-size-font-size: 16px;
	--wpforms-button-size-padding-h: 32px;
	--wpforms-page-break-color: #C8FF4D;
	margin: 0 !important;
}
.hx-form .wpforms-container .wpforms-field { padding: 10px 0 !important; }
.hx-form .wpforms-container .wpforms-field-label {
	font-family: var(--hx-mono) !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--hx-muted) !important;
	margin-bottom: 8px !important;
}
.hx-form .wpforms-container .wpforms-required-label { color: var(--hx-accent) !important; }
.hx-form .wpforms-container input[type="text"],
.hx-form .wpforms-container input[type="email"],
.hx-form .wpforms-container textarea {
	width: 100% !important;
	max-width: 100% !important;
	padding: 14px 16px !important;
	border: 1px solid var(--hx-line) !important;
	border-radius: 12px !important;
	background: var(--hx-surface2) !important;
	color: var(--hx-ink) !important;
	font-family: var(--hx-body) !important;
	font-size: 16px !important;
	box-shadow: none !important;
	transition: border-color .25s, box-shadow .25s;
}
.hx-form .wpforms-container textarea { min-height: 140px !important; }
.hx-form .wpforms-container input:focus,
.hx-form .wpforms-container textarea:focus {
	border-color: var(--hx-accent) !important;
	box-shadow: 0 0 0 4px rgba(200, 255, 77, .15) !important;
	outline: 0 !important;
}
.hx-form .wpforms-container ::placeholder { color: #5f5973 !important; }
.hx-form .wpforms-container .wpforms-field-row { max-width: 100% !important; }
.hx-form .wpforms-container .wpforms-field-row-block { padding: 0 !important; width: 100% !important; }
.hx-form .wpforms-container .wpforms-field-name .wpforms-field-row { display: flex; gap: 12px; }
.hx-form .wpforms-container .wpforms-field-sublabel { color: var(--hx-muted) !important; font-size: 12px !important; }
.hx-form .wpforms-container button[type="submit"] {
	height: 56px !important;
	padding: 0 34px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--hx-accent) !important;
	color: var(--hx-bg) !important;
	font-family: var(--hx-body) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	cursor: pointer;
	transition: transform .4s var(--hx-ease), box-shadow .3s !important;
}
.hx-form .wpforms-container button[type="submit"]:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 40px -12px rgba(200, 255, 77, .6) !important;
}
.hx-form .wpforms-container .wpforms-submit-container { padding-top: 16px !important; }
.hx-form .wpforms-confirmation-container-full {
	border: 1px solid var(--hx-accent) !important;
	border-radius: 16px !important;
	background: rgba(200, 255, 77, .08) !important;
	color: var(--hx-ink) !important;
	padding: 24px !important;
}
.hx-form .wpforms-confirmation-container-full p { color: var(--hx-ink) !important; margin: 0; }
.hx-form label.wpforms-error, .hx-form em.wpforms-error { color: #ff7a8a !important; }

/* ---------- Contact links ---------- */
.hx-contact-link .elementor-heading-title a {
	background: linear-gradient(var(--hx-accent), var(--hx-accent)) 0 100% / 0 2px no-repeat;
	transition: background-size .5s var(--hx-ease), color .3s;
}
.hx-contact-link .elementor-heading-title a:hover {
	background-size: 100% 2px;
	color: var(--hx-accent) !important;
}

/* ---------- Footer ---------- */
.hx-footer { position: relative; overflow: hidden; }
.hx-bigword {
	position: relative;
	margin: 0;
	font-family: "Unbounded", sans-serif;
	font-weight: 800;
	font-size: clamp(64px, 17.5vw, 300px);
	line-height: .8;
	letter-spacing: -.06em;
	white-space: nowrap;
	text-align: center;
	color: transparent;
	-webkit-text-stroke: 1px #3a3450;
	background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 50%), var(--hx-accent), var(--hx-brand) 45%, transparent 70%);
	-webkit-background-clip: text;
	background-clip: text;
	user-select: none;
}
.hx-flinks { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.hx-flinks a {
	color: var(--hx-text) !important;
	font-size: 16px;
	text-decoration: none !important;
}
.hx-flinks a:hover { color: var(--hx-accent) !important; }

/* ---------- Cursor ---------- */
.hx-cursor, .hx-cursor-ring {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	pointer-events: none;
	border-radius: 50%;
	opacity: 0;
	transition: opacity .3s;
}
.hx-cursor {
	width: 8px;
	height: 8px;
	margin: -4px 0 0 -4px;
	background: var(--hx-accent);
}
.hx-cursor-ring {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin: -22px 0 0 -22px;
	border: 1px solid rgba(242, 239, 250, .35);
	transition: opacity .3s, width .4s var(--hx-ease), height .4s var(--hx-ease), margin .4s var(--hx-ease), background-color .3s, border-color .3s;
}
.hx-cursor-ring span {
	font-family: var(--hx-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .04em;
	color: var(--hx-bg);
	text-transform: uppercase;
	opacity: 0;
	transition: opacity .2s;
}
html.hx-has-cursor .hx-cursor,
html.hx-has-cursor .hx-cursor-ring { opacity: 1; }
html.hx-cur-link .hx-cursor-ring {
	width: 64px;
	height: 64px;
	margin: -32px 0 0 -32px;
	border-color: var(--hx-accent);
}
html.hx-cur-view .hx-cursor-ring {
	width: 104px;
	height: 104px;
	margin: -52px 0 0 -52px;
	background: var(--hx-accent);
	border-color: var(--hx-accent);
}
html.hx-cur-view .hx-cursor-ring span { opacity: 1; }
html.hx-cur-view .hx-cursor { opacity: 0; }

/* ---------- Reveal ---------- */
html.hx-js body:not(.elementor-editor-active) .hx-reveal {
	opacity: 0;
	transform: translateY(40px);
	transition: opacity 1s var(--hx-ease), transform 1s var(--hx-ease);
	transition-delay: var(--d, 0s);
}
html.hx-js body:not(.elementor-editor-active) .hx-reveal.is-in { opacity: 1; transform: none; }

.hx-split .hx-w {
	display: inline-block;
	overflow: hidden;
	vertical-align: top;
	padding-bottom: .08em;
	margin-bottom: -.08em;
}
.hx-split .hx-w > i {
	display: inline-block;
	font-style: inherit;
	transform: translateY(110%) rotate(4deg);
	transition: transform 1.1s var(--hx-ease);
	transition-delay: calc(var(--wi) * 55ms);
}
.hx-split.is-in .hx-w > i { transform: none; }

/* ---------- Elementor tweaks ---------- */
body.hx .elementor-widget-divider .elementor-divider-separator { border-color: var(--hx-line) !important; }
body.hx .elementor-counter .elementor-counter-number-wrapper { font-family: var(--hx-display); }

/* Image widget used as portrait */
.hx-portrait img {
	border-radius: 24px;
	filter: saturate(.9) contrast(1.05);
}
.hx-portrait { position: relative; }
.hx-portrait::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 24px;
	background: linear-gradient(to top, rgba(10, 9, 16, .55), transparent 45%);
	pointer-events: none;
}

/* Hide decorative glow on small screens to save GPU */
@media (max-width: 767px) {
	.hx-glow::before { width: 520px; height: 520px; }
	.hx-marquees { height: 150px; margin: -24px 0; }
	.hx-marquee { padding: 12px 0; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	.hx-marquee__track, .hx-hero-badge { animation: none !important; }
	.hx-split .hx-w > i, .hx-reveal { transform: none !important; opacity: 1 !important; transition: none !important; }
	.hx-work__shot img { transform: none !important; }
}

/* ==========================================================================
   Blocks
   ========================================================================== */
.hx-hero-copy { position: relative; z-index: 2; }
.hx-page-hero .hx-hero-side { position: relative; }

.hx-sticky { position: sticky !important; top: 120px; align-self: flex-start; }
@media (max-width: 1024px) { .hx-sticky { position: relative !important; top: 0; } }

.hx-rounded-sec { border-radius: 36px; margin-left: 12px !important; margin-right: 12px !important; }
@media (max-width: 767px) { .hx-rounded-sec { border-radius: 24px; margin-left: 6px !important; margin-right: 6px !important; } }

.hx-ico { display: block; }

/* Editorial service rows */
.hx-svc-list { border-top: 1px solid var(--hx-line); }
.hx-svc-row {
	position: relative;
	border-bottom: 1px solid var(--hx-line);
	text-decoration: none !important;
	isolation: isolate;
}
.hx-svc-row::before {
	content: "";
	position: absolute;
	inset: 0 -24px;
	z-index: -1;
	border-radius: 20px;
	background: var(--hx-surface);
	opacity: 0;
	transform: scaleY(.6);
	transition: opacity .5s var(--hx-ease), transform .5s var(--hx-ease);
}
a.hx-svc-row:hover::before { opacity: 1; transform: none; }
.hx-svc-row__num { flex: 0 0 56px; }
.hx-svc-row__title { flex: 0 0 38%; }
.hx-svc-row__title .elementor-heading-title { font-size: clamp(24px, 2.6vw, 40px) !important; transition: color .3s; }
a.hx-svc-row:hover .hx-svc-row__title .elementor-heading-title { color: var(--hx-accent) !important; }
.hx-svc-row__text { flex: 1 1 auto; max-width: 520px; }
.hx-arrow {
	display: grid;
	place-items: center;
	width: 60px;
	height: 60px;
	border: 1px solid var(--hx-line);
	border-radius: 50%;
	color: var(--hx-ink);
	transition: background-color .4s, color .4s, transform .6s var(--hx-ease), border-color .4s;
}
a.hx-svc-row:hover .hx-arrow { background: var(--hx-accent); border-color: var(--hx-accent); color: var(--hx-bg); transform: rotate(-45deg); }
.hx-svc-row .elementor-widget-html { flex: none; }
@media (max-width: 767px) {
	.hx-svc-row__num, .hx-svc-row__title { flex: none; }
	.hx-svc-row .elementor-widget-html { display: none; }
	.hx-svc-row::before { inset: 0 -12px; }
}

/* Duration bars (services) */
.hx-size-list { border-top: 1px solid var(--hx-line); }
.hx-size-row { border-bottom: 1px solid var(--hx-line); }
.hx-dur {
	position: relative;
	height: 10px;
	border-radius: 999px;
	background: var(--hx-surface2);
	overflow: hidden;
}
.hx-dur span {
	position: absolute;
	inset: 0 auto 0 0;
	width: var(--w, 50%);
	border-radius: 999px;
	background: linear-gradient(90deg, var(--hx-brand), var(--hx-accent));
	transform: scaleX(0);
	transform-origin: 0 50%;
	transition: transform 1.4s var(--hx-ease) .2s;
}
.hx-size-row.is-in .hx-dur span,
.elementor-editor-active .hx-dur span,
html:not(.hx-js) .hx-dur span { transform: none; }

/* Stats */
.hx-stat { border-top: 1px solid var(--hx-line); padding-top: 22px !important; }
.hx-stat .elementor-counter-title { max-width: 220px; text-align: left; }
.hx-stat .elementor-counter-number-wrapper { justify-content: flex-start; }

/* CTA panel */
.hx-cta {
	min-height: 440px;
	background:
		radial-gradient(70% 120% at 100% 50%, rgba(138, 77, 255, .35), transparent 60%),
		var(--hx-surface) !important;
}
.hx-cta__copy { position: relative; z-index: 2; }
.hx-cta__3d {
	position: absolute !important;
	right: -6%;
	top: 0;
	bottom: 0;
	width: 52% !important;
	z-index: 1;
}
.hx-cta__3d .hx-3d-fill { height: 100%; min-height: 0; }
@media (max-width: 1024px) {
	.hx-cta__3d { position: relative !important; right: auto; width: 100% !important; height: 300px; margin-top: -10px; }
	.hx-cta { min-height: 0; }
}
@media (max-width: 767px) { .hx-cta__3d { height: 260px; } }

.hx-3d-box { height: 460px; min-height: 0; }
@media (max-width: 1024px) { .hx-3d-box { height: 360px; } }
@media (max-width: 767px) { .hx-3d-box { height: 280px; } }

/* Work cards */
.hx-work__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.hx-work__domain { font-family: var(--hx-mono); font-size: 13px; color: var(--hx-muted); }
.hx-work--full .hx-big-num .elementor-heading-title { font-size: clamp(56px, 7vw, 110px) !important; }
.hx-work--full .hx-outline { -webkit-text-stroke: 1.5px #4a4362; }
html.hx-has-cursor .hx-work { cursor: none; }
html.hx-has-cursor .hx-work a { cursor: none; }

/* "Your project" slot */
.hx-slot__plus {
	display: grid;
	place-items: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	border: 1.5px dashed var(--hx-accent);
	color: var(--hx-accent);
	font-family: var(--hx-display);
	font-size: 30px;
	line-height: 1;
	transition: transform .8s var(--hx-ease);
}
.hx-slot:hover .hx-slot__plus { transform: rotate(180deg); }
.hx-slot__plus--xl { width: 96px; height: 96px; font-size: 44px; margin: 0 auto 6px; }
.hx-slot--big { text-align: center; }
.hx-slot--big .hx-label .elementor-heading-title { justify-content: center; }

/* Portrait */
.hx-portrait-badge { position: absolute !important; left: -40px; bottom: -30px; z-index: 3; width: 140px; }
.hx-portrait-badge .hx-hero-badge { position: static; display: block; width: 140px; height: 140px; }
.hx-portrait-badge svg { background: var(--hx-bg); border-radius: 50%; }
@media (max-width: 767px) {
	.hx-portrait-badge { left: auto; right: 6px; bottom: -24px; width: 100px; }
	.hx-portrait-badge .hx-hero-badge { width: 100px; height: 100px; display: block; }
}

/* Checklist variants */
.hx-checks--dark .elementor-icon-list-item { border-bottom-color: rgba(10, 9, 16, .15) !important; }
.hx-checks--dark .elementor-icon-list-icon svg { fill: var(--hx-bg) !important; }
.hx-checks .elementor-icon-list-item:last-child { border-bottom: 0; }

/* Header pieces */
.hx-header > .e-con, .hx-header > .elementor-element { flex: 0 0 auto !important; width: auto !important; }
.hx-header .elementor-button { padding: 12px 20px !important; font-size: 15px !important; }

/* Footer */
.hx-footer { border-top: 1px solid var(--hx-line); }
.hx-footer__bottom { border-top: 1px solid var(--hx-line); }
.hx-totop {
	font-family: var(--hx-mono);
	font-size: 13px;
	color: var(--hx-text) !important;
	text-decoration: none !important;
}
.hx-totop:hover { color: var(--hx-accent) !important; }
.hx-footer .elementor-widget-html { width: 100%; }

/* ---------- Fixes ---------- */
body.hx .elementor-button { white-space: nowrap; }
@media (max-width: 420px) { body.hx .elementor-button { white-space: normal; } }
.hx-work:not(.hx-work--full) .hx-browser img { aspect-ratio: 16 / 11; object-fit: cover; object-position: top center; height: auto; }
.hx-slot .elementor-widget-html,
.hx-slot > .elementor-widget-button { flex: 0 0 auto !important; width: auto !important; }
.hx-footer__bottom > .elementor-element { width: auto !important; flex: 0 0 auto !important; }
.hx-footer__bottom p { margin: 0; }
.hx-size-row h3.elementor-heading-title { font-size: clamp(24px, 2.6vw, 38px) !important; }
.hx-work--full h2.elementor-heading-title { font-size: clamp(28px, 3.2vw, 46px) !important; }
.hx-3d-fill { position: relative; overflow: hidden; }
.hx-3d-fill canvas { position: absolute; inset: 0; display: block; width: 100% !important; height: 100% !important; }
html, body.hx { overflow-x: clip; }
.ast-mobile-popup-drawer, .ast-mobile-header-wrap, #ast-desktop-header { display: none !important; }
@media (max-width: 1024px) { .hx-page-hero .hx-hero-side { max-width: 520px; } }
.hx-lang-hy h1.elementor-heading-title { font-size: clamp(30px, 4.4vw, 56px) !important; }
body.hx #masthead { position: relative; z-index: 1000 !important; }

/* ---------- 404 (Astra) ---------- */
body.hx.error404 #primary { margin: 0 !important; padding: 170px 0 100px !important; }
body.hx.error404 .ast-article-single,
body.hx.error404 .ast-404-layout-1,
body.hx.error404 .error-404,
body.hx.error404 #primary .ast-article-post { background: transparent !important; border: 0 !important; box-shadow: none !important; }
body.hx.error404 .page-title {
	font-family: var(--hx-display) !important;
	font-weight: 700;
	font-size: clamp(34px, 6vw, 72px) !important;
	line-height: 1.04;
	letter-spacing: -.03em;
	color: var(--hx-ink) !important;
}
body.hx.error404 .page-sub-title, body.hx.error404 .page-content p { color: var(--hx-text) !important; font-family: var(--hx-body); }
body.hx.error404 .search-form input[type="search"] {
	border: 1px solid var(--hx-line) !important;
	border-radius: 999px !important;
	background: var(--hx-surface2) !important;
	color: var(--hx-ink) !important;
	padding: 14px 22px !important;
}

/* ---------- Big footer word v2: no stroke (variable-font overlaps), box fits the text ---------- */
.hx-bigword {
	display: table;
	margin: 0 auto;
	font-size: min(calc((100vw - 60px) / 5.05), 236px);
	-webkit-text-stroke: 0;
	color: transparent;
	background:
		radial-gradient(var(--hx-spot, 440px) circle at var(--mx, -999px) var(--my, -999px), var(--hx-accent), var(--hx-brand) 42%, transparent 72%),
		linear-gradient(#1c1929, #1c1929);
	-webkit-background-clip: text;
	background-clip: text;
}
.hx-bigword:hover { --hx-spot: 640px; }
@media (hover: none) {
	.hx-bigword { background: linear-gradient(100deg, var(--hx-brand), var(--hx-accent)); -webkit-background-clip: text; background-clip: text; }
}
.hx-outline,
.hx-work--full .hx-outline { -webkit-text-stroke: 0; color: #2c2840; }

/* ---------- Form v2: grid, selects, pill radios ---------- */
.hx-form .wpforms-field-container { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
.hx-form .wpforms-field-container > .wpforms-field { grid-column: 1 / -1; }
.hx-form .wpforms-field-container > .wpforms-field.hx-half { grid-column: auto; }
@media (max-width: 600px) {
	.hx-form .wpforms-field-container > .wpforms-field.hx-half { grid-column: 1 / -1; }
}
.hx-form .wpforms-container select {
	-webkit-appearance: none;
	appearance: none;
	width: 100% !important;
	max-width: 100% !important;
	height: 52px !important;
	padding: 0 44px 0 16px !important;
	border: 1px solid var(--hx-line) !important;
	border-radius: 12px !important;
	background: var(--hx-surface2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23C8FF4D' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 18px center / 13px !important;
	color: var(--hx-ink) !important;
	font-family: var(--hx-body) !important;
	font-size: 16px !important;
	box-shadow: none !important;
	cursor: pointer;
}
.hx-form .wpforms-container select:focus {
	border-color: var(--hx-accent) !important;
	box-shadow: 0 0 0 4px rgba(200, 255, 77, .15) !important;
	outline: 0 !important;
}
.hx-form .wpforms-container select { color-scheme: dark; }
.hx-form .wpforms-container select option,
.hx-form .wpforms-container select optgroup { background-color: #1B1828 !important; color: #F2EFFA !important; }
.hx-form .wpforms-container select option:checked { background-color: #2c2547 !important; }
.hx-form .wpforms-container select option[value=""],
.hx-form .wpforms-container select option.placeholder { color: #8E88A3 !important; }
.hx-form .wpforms-container .wpforms-field-description { color: var(--hx-muted) !important; font-size: 13px !important; margin-top: 6px !important; }
.hx-form .wpforms-field-radio ul { display: flex !important; flex-wrap: wrap; gap: 8px; margin: 0 !important; padding: 0 !important; list-style: none !important; }
.hx-form .wpforms-field-radio ul li { position: relative; margin: 0 !important; padding: 0 !important; width: auto !important; }
.hx-form .wpforms-field-radio ul li input[type="radio"] { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; margin: 0 !important; opacity: 0; cursor: pointer; z-index: 1; }
.hx-form .wpforms-field-radio ul li label.wpforms-field-label-inline {
	display: inline-flex !important;
	align-items: center;
	height: 44px;
	margin: 0 !important;
	padding: 0 20px !important;
	border: 1px solid var(--hx-line);
	border-radius: 999px;
	background: var(--hx-surface2);
	color: var(--hx-text) !important;
	font-family: var(--hx-body) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	transition: background .25s, border-color .25s, color .25s;
}
.hx-form .wpforms-field-radio ul li:hover label.wpforms-field-label-inline { border-color: #4a4462; color: var(--hx-ink) !important; }
.hx-form .wpforms-field-radio ul li input:checked + label.wpforms-field-label-inline { background: var(--hx-accent); border-color: var(--hx-accent); color: var(--hx-bg) !important; }
.hx-form .wpforms-field-radio ul li input:focus-visible + label.wpforms-field-label-inline { box-shadow: 0 0 0 4px rgba(200, 255, 77, .25); }

/* ---------- Floating Telegram button (phones, tablets) ---------- */
.hx-tgfab {
	position: fixed;
	right: 16px;
	bottom: calc(16px + env(safe-area-inset-bottom, 0px));
	z-index: 900;
	display: none;
	align-items: center;
	gap: 8px;
	height: 52px;
	padding: 0 20px 0 16px;
	border-radius: 999px;
	background: var(--hx-accent);
	color: var(--hx-bg) !important;
	font-family: var(--hx-body);
	font-size: 15px;
	font-weight: 700;
	text-decoration: none !important;
	box-shadow: 0 14px 40px -12px rgba(200, 255, 77, .55), 0 0 0 1px rgba(10, 9, 16, .25);
	opacity: 0;
	pointer-events: none;
	transform: translateY(130%) scale(.9);
	transition: transform .5s var(--hx-ease), opacity .3s;
}
@media (max-width: 1024px) {
	.hx-tgfab { display: inline-flex; }
}
.hx-past-hero .hx-tgfab { opacity: 1; pointer-events: auto; transform: none; }
.hx-menu-open .hx-tgfab { opacity: 0; pointer-events: none; transform: translateY(130%) scale(.9); }
@media (prefers-reduced-motion: reduce) { .hx-tgfab { transition: opacity .2s; } }

/* ---------- Mobile polish ---------- */
.hx-at-footer .hx-tgfab { opacity: 0; pointer-events: none; transform: translateY(130%) scale(.9); }

@media (max-width: 767px) {
	/* Marquee: two parallel ribbons instead of a cross (the cross hid the violet one) */
	.hx-marquees { height: 128px; margin: -18px 0; }
	.hx-marquee { padding: 10px 0; transform: translateY(-1%) rotate(-4deg); }
	.hx-marquee--b { transform: translateY(-99%) rotate(-4deg); opacity: 1; }
	.hx-marquee span { gap: 16px; padding-right: 16px; font-size: 17px; }

	/* Tighter vertical rhythm between sections */
	body.hx .elementor > .e-con-boxed.e-parent:not(.hx-hero):not(.hx-page-hero) > .e-con-inner {
		padding-top: calc(var(--padding-top) * .7) !important;
		padding-bottom: calc(var(--padding-bottom) * .7) !important;
	}
	body.hx .elementor > .hx-page-hero.e-parent > .e-con-inner {
		padding-top: max(100px, calc(var(--padding-top) * .8)) !important;
		padding-bottom: calc(var(--padding-bottom) * .7) !important;
	}

	body.hx .elementor > .hx-hero.e-parent { min-height: 0 !important; }
	body.hx .elementor > .hx-hero.e-parent > .e-con-inner { padding-bottom: 44px !important; }

	/* Bento */
	.hx-card--violet { min-height: 0 !important; gap: 40px !important; }
	.hx-big-num .elementor-heading-title { font-size: 60px !important; }

	/* Work cards */
	.hx-work--full .hx-big-num .elementor-heading-title { font-size: 44px !important; }
	.hx-work--full > .e-con { --gap: 14px; gap: 14px !important; }
	.hx-work--full h2.elementor-heading-title { font-size: 26px !important; }

	/* Service rows */
	.hx-svc-row { --padding-top: 22px !important; --padding-bottom: 22px !important; }

	/* FAQ */
	.hx-faq .elementor-toggle-item { margin-bottom: 8px !important; border-radius: 14px; }
	.hx-faq .elementor-tab-title { padding: 16px 18px !important; }
	.hx-faq .elementor-toggle-title { font-size: 16px !important; line-height: 1.3 !important; }
	.hx-faq .elementor-tab-content { padding: 0 18px 16px !important; font-size: 15px; }

	/* CTA */
	.hx-cta__3d { height: 200px; margin-top: -24px; }

	/* Footer: pages and language side by side, contacts below */
	.hx-footer > .e-con-inner > .e-con:first-child > .e-con:nth-child(2) {
		display: grid !important;
		grid-template-columns: 1fr auto;
		gap: 28px 20px;
	}
	.hx-footer > .e-con-inner > .e-con:first-child > .e-con:nth-child(2) > .e-con:nth-child(2) { grid-column: 1 / -1; order: 3; }
}
