/* ==========================================================================
   Design — AURORA
   Animated aurora light, gradient display type, frosted-glass surfaces,
   glowing gradient buttons and a 3D mockup stack.
   Palette stays on-brand: #3e89ff blue, #1F437D navy, #6EC1E4 sky
   (the sky blue comes from the original Elementor kit).
   Works with dark / light / mixed tokens.
   ========================================================================== */
:root[data-design="aurora"] {
	--radius-sm: 14px;
	--radius: 20px;
	--radius-lg: 28px;
	--sky: #6ec1e4;
	--au-grad: linear-gradient(100deg, #ffffff 0%, #b9dcff 30%, #6ec1e4 55%, #3e89ff 80%);
	--au-btn: linear-gradient(135deg, #5a9bff 0%, #3e89ff 45%, #2a62d6 100%);
	--au-ring: linear-gradient(135deg, rgba(110, 193, 228, .9), rgba(62, 137, 255, .2) 40%, rgba(255, 255, 255, .05) 60%, rgba(110, 193, 228, .7));
}
:root[data-design="aurora"][data-theme="dark"],
:root[data-design="aurora"]:not([data-theme]) {
	--bg: #070b16;
	--bg-2: #0b1120;
	--surface: rgba(255, 255, 255, .045);
	--surface-2: rgba(255, 255, 255, .08);
	--line: rgba(160, 200, 255, .14);
	--line-strong: rgba(160, 200, 255, .28);
	--muted: #93a3bd;
	--glass-hi: rgba(255, 255, 255, .12);
	--au-blob-a: rgba(62, 137, 255, .55);
	--au-blob-b: rgba(110, 193, 228, .45);
	--au-blob-c: rgba(31, 67, 125, .8);
}
:root[data-design="aurora"][data-theme="light"] {
	--bg: #f2f5fb;
	--bg-2: #e8eef8;
	--surface: rgba(255, 255, 255, .62);
	--surface-2: rgba(255, 255, 255, .85);
	--line: rgba(31, 67, 125, .12);
	--line-strong: rgba(31, 67, 125, .22);
	--text: #0d1b33;
	--muted: #55627a;
	--accent-text: #2a6ee8;
	--glass-hi: rgba(255, 255, 255, .9);
	--au-grad: linear-gradient(100deg, #1f437d 0%, #2a6ee8 45%, #3e89ff 65%, #6ec1e4 100%);
	--au-blob-a: rgba(62, 137, 255, .35);
	--au-blob-b: rgba(110, 193, 228, .4);
	--au-blob-c: rgba(186, 214, 255, .7);
	--tk-ghost-bg: rgba(255, 255, 255, .7);
}
/* Mixed: ink sections become deep night-navy glass */
:root[data-design="aurora"][data-style="mixed"][data-theme="light"] [data-tone="ink"] {
	--bg: #070b16;
	--surface: rgba(255, 255, 255, .05);
	--surface-2: rgba(255, 255, 255, .08);
	--line: rgba(160, 200, 255, .14);
	--line-strong: rgba(160, 200, 255, .28);
	--muted: #93a3bd;
	--glass-hi: rgba(255, 255, 255, .12);
	--au-grad: linear-gradient(100deg, #ffffff 0%, #b9dcff 30%, #6ec1e4 55%, #3e89ff 80%);
	background: radial-gradient(60% 80% at 15% 0%, rgba(62, 137, 255, .28), transparent 60%), radial-gradient(50% 70% at 90% 100%, rgba(110, 193, 228, .2), transparent 60%), #070b16;
}

/* ---------- Ambient light behind the whole page ---------- */
:root[data-design="aurora"] body { background: var(--bg); }
:root[data-design="aurora"] body::before {
	content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
	background:
		radial-gradient(40vw 40vw at 85% 10%, var(--au-blob-a), transparent 70%),
		radial-gradient(35vw 35vw at 5% 60%, var(--au-blob-b), transparent 70%),
		radial-gradient(45vw 45vw at 60% 110%, var(--au-blob-c), transparent 70%);
	opacity: .35; filter: blur(20px);
}

/* ---------- Glass primitive ---------- */
:root[data-design="aurora"] [data-glow],
:root[data-design="aurora"] .faq__card,
:root[data-design="aurora"] .mini-card,
:root[data-design="aurora"] .form-card,
:root[data-design="aurora"] .review__card,
:root[data-design="aurora"] .help-band,
:root[data-design="aurora"] .stack__inner,
:root[data-design="aurora"] .post-nav a,
:root[data-design="aurora"] .hwork__card,
:root[data-design="aurora"] .accordion__item,
:root[data-design="aurora"] .site-footer__col {
	background: var(--surface);
	border: 1px solid var(--line);
	box-shadow: inset 0 1px 0 var(--glass-hi), 0 30px 60px -40px rgba(7, 11, 22, .6);
	backdrop-filter: blur(18px) saturate(1.3); -webkit-backdrop-filter: blur(18px) saturate(1.3);
}
:root[data-design="aurora"] [data-glow]::before { background: radial-gradient(380px circle at var(--mx, 50%) var(--my, 50%), rgba(110, 193, 228, .25), transparent 60%); }
:root[data-design="aurora"] [data-glow]:hover { border-color: rgba(110, 193, 228, .5); }

/* Gradient text accents */
:root[data-design="aurora"] .text-accent,
:root[data-design="aurora"] .hero__line em,
:root[data-design="aurora"] .cta__line--accent,
:root[data-design="aurora"] .hero-stat__num,
:root[data-design="aurora"] .site-footer__mail span {
	background: var(--au-grad); background-size: 200% 100%;
	-webkit-background-clip: text; background-clip: text; color: transparent !important;
	animation: au-shine 8s ease-in-out infinite alternate;
}
@keyframes au-shine { to { background-position: 100% 0; } }

/* ---------- Buttons: glowing gradient pill + glass ghost ---------- */
:root[data-design="aurora"] .btn--primary {
	--btn-bg: transparent; --btn-fg: #fff; --btn-icon-bg: rgba(255, 255, 255, .95); --btn-icon-fg: #2a62d6; --btn-hover: #1f437d;
	background: var(--au-btn);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, .18) inset, 0 14px 40px -12px rgba(62, 137, 255, .85);
}
:root[data-design="aurora"] .btn--primary:hover { box-shadow: 0 0 0 1px rgba(255, 255, 255, .25) inset, 0 18px 50px -10px rgba(110, 193, 228, .9); }
:root[data-design="aurora"] .btn--ghost {
	--btn-bg: var(--surface); --btn-icon-bg: var(--surface-2); --btn-icon-fg: var(--text);
	border-color: var(--line-strong); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
:root[data-design="aurora"] .btn--ghost:hover .btn__icon { background: #fff; color: var(--primary); }
:root[data-design="aurora"] .wpcf7-submit { background: var(--au-btn); box-shadow: 0 14px 40px -12px rgba(62, 137, 255, .85); }

/* Header + nav glass */
:root[data-design="aurora"] .nav__list { background: var(--surface); border-color: var(--line); box-shadow: inset 0 1px 0 var(--glass-hi); }
:root[data-design="aurora"] .nav__list .is-active a { background: var(--au-btn); box-shadow: 0 6px 20px -6px rgba(62, 137, 255, .9); }
:root[data-design="aurora"] .site-header.is-scrolled { background: color-mix(in srgb, var(--bg) 70%, transparent); }
:root[data-design="aurora"] .theme-toggle { background: var(--surface); border-color: var(--line); }

/* Kicker → glass pill with glowing dot */
:root[data-design="aurora"] .kicker { padding: 7px 14px; border-radius: 99px; background: var(--surface); border: 1px solid var(--line); color: var(--text); backdrop-filter: blur(10px); }
:root[data-design="aurora"] .kicker__dot { background: var(--sky); box-shadow: 0 0 12px var(--sky); }
:root[data-design="aurora"] .pills li { background: var(--surface); border-color: var(--line); backdrop-filter: blur(10px); }
:root[data-design="aurora"] .pills li.is-strong { background: var(--au-btn); color: #fff; border-color: transparent; }

/* ---------- Hero ---------- */
.au-hero { position: relative; display: block; min-height: auto; padding: calc(var(--header-h) + clamp(40px, 7vw, 96px)) 0 0; overflow: hidden; text-align: center; }
.au-aurora { position: absolute; inset: -20% -10% 20%; z-index: -1; filter: blur(60px) saturate(1.2); opacity: .95; }
.au-aurora i { position: absolute; border-radius: 50%; mix-blend-mode: screen; animation: au-drift 18s ease-in-out infinite alternate; }
:root[data-theme="light"] .au-aurora i { mix-blend-mode: multiply; }
.au-aurora i:nth-child(1) { width: 46vw; height: 46vw; left: 8%; top: 0; background: radial-gradient(circle, var(--au-blob-a), transparent 65%); }
.au-aurora i:nth-child(2) { width: 40vw; height: 40vw; right: 6%; top: 6%; background: radial-gradient(circle, var(--au-blob-b), transparent 65%); animation-duration: 22s; animation-delay: -6s; }
.au-aurora i:nth-child(3) { width: 60vw; height: 30vw; left: 20%; top: 35%; background: radial-gradient(ellipse, var(--au-blob-c), transparent 65%); animation-duration: 26s; animation-delay: -12s; }
.au-aurora i:nth-child(4) { width: 22vw; height: 22vw; left: 44%; top: 4%; background: radial-gradient(circle, rgba(255, 255, 255, .35), transparent 65%); animation-duration: 15s; }
@keyframes au-drift { 0% { transform: translate(0, 0) scale(1); } 50% { transform: translate(6vw, 3vw) scale(1.15); } 100% { transform: translate(-4vw, -2vw) scale(.92); } }
.au-stars { position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
	background-image: radial-gradient(rgba(255, 255, 255, .6) 1px, transparent 1px); background-size: 120px 120px;
	mask-image: radial-gradient(ellipse 70% 60% at 50% 30%, #000, transparent 75%); -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 30%, #000, transparent 75%); }
:root[data-theme="light"] .au-stars { background-image: radial-gradient(rgba(31, 67, 125, .25) 1px, transparent 1px); }

.au-hero__inner { display: flex; flex-direction: column; align-items: center; }
.au-badge { display: inline-flex; align-items: center; gap: 10px; padding: 6px 16px 6px 6px; border-radius: 99px; background: var(--surface); border: 1px solid var(--line); box-shadow: inset 0 1px 0 var(--glass-hi); backdrop-filter: blur(12px); font-size: 14px; font-weight: 500; }
.au-badge__new { padding: 4px 10px; border-radius: 99px; background: var(--au-btn); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.au-hero__title { margin: clamp(22px, 3vw, 36px) 0 0; font-size: clamp(56px, 11.2vw, 190px); font-weight: 600; line-height: .92; letter-spacing: -.045em; }
.au-hero__title .hero__line { display: block; overflow: hidden; padding: 0 .04em .08em; }
.au-hero__title em { font-style: normal; }
.au-hero__text { max-width: 600px; margin: clamp(20px, 2.4vw, 32px) auto 0; color: var(--muted); font-size: var(--fs-lg); line-height: 1.55; }
.au-hero__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 32px; }
.au-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 36px; }
.au-chips li { padding: 10px 18px; border-radius: 99px; background: var(--surface); border: 1px solid var(--line); box-shadow: inset 0 1px 0 var(--glass-hi); backdrop-filter: blur(12px); font-size: 14px; color: var(--muted); }
.au-chips strong { color: var(--text); font-weight: 700; margin-right: 4px; }

/* 3D mockup stack */
.au-stage { position: relative; margin-top: clamp(48px, 6vw, 88px); padding: 0 var(--gutter) clamp(40px, 6vw, 96px); perspective: 1800px; }
.au-stack { position: relative; width: min(1100px, 100%); margin: 0 auto; aspect-ratio: 16 / 8.2; transform-style: preserve-3d; transform: rotateX(26deg) scale(.9); transform-origin: 50% 0; }
.au-shot { position: absolute; margin: 0; overflow: hidden; border-radius: 22px; padding: 8px; background: linear-gradient(var(--surface-2), var(--surface)); border: 1px solid var(--line-strong); box-shadow: 0 50px 100px -30px rgba(7, 11, 22, .7), 0 0 80px -20px rgba(62, 137, 255, .45); }
.au-shot img { width: 100%; height: 100%; object-fit: cover; border-radius: 15px; }
.au-stage::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 30%; background: linear-gradient(transparent, var(--bg)); pointer-events: none; z-index: 4; }

/* ---------- Sections ---------- */
:root[data-design="aurora"] .section-title { font-weight: 600; letter-spacing: -.04em; }
:root[data-design="aurora"] .marquee:not(.marquee--logos) { border-color: var(--line); background: linear-gradient(90deg, transparent, var(--surface), transparent); }
:root[data-design="aurora"] .marquee--big .marquee__item { background: var(--au-grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-stroke: 0; }
:root[data-design="aurora"] .marquee--big .marquee__item:nth-child(4n+3) { background: none; -webkit-text-stroke: 1px var(--line-strong); }
:root[data-design="aurora"] .marquee__star { background: var(--sky); filter: drop-shadow(0 0 10px var(--sky)); }

:root[data-design="aurora"] .srv-row__link::before { background: var(--au-btn); }
:root[data-design="aurora"] .srv-row__num { color: var(--sky); }
:root[data-design="aurora"] .hwork__card { padding: 10px; border-radius: calc(var(--radius-lg) + 6px); }
:root[data-design="aurora"] .hwork__info { padding: 14px 8px 4px; }
:root[data-design="aurora"] .why__icon { background: linear-gradient(135deg, rgba(110, 193, 228, .25), rgba(62, 137, 255, .25)); color: var(--sky); box-shadow: 0 0 30px -6px rgba(110, 193, 228, .6); }
:root[data-design="aurora"] .vm__card--accent { background: var(--au-btn); }
:root[data-design="aurora"] .clients__logo { background: rgba(255, 255, 255, .92); border-color: transparent; }
:root[data-design="aurora"] .accordion { border: 0; display: grid; gap: 10px; }
:root[data-design="aurora"] .accordion__item { border-radius: var(--radius); padding-inline: 22px; }
:root[data-design="aurora"] .accordion__item[open] .accordion__icon { background: var(--au-btn); border-color: transparent; }
:root[data-design="aurora"] .stack__card:nth-child(3n+2) .stack__inner { background: linear-gradient(135deg, #1f437d, #10264a); }
:root[data-design="aurora"] .stack__card:nth-child(3n+3) .stack__inner { background: var(--au-btn); }

/* Page hero: centred with aurora light */
:root[data-design="aurora"] .page-hero { text-align: center; }
:root[data-design="aurora"] .page-hero .container > * { margin-inline: auto; }
:root[data-design="aurora"] .page-hero .crumbs, :root[data-design="aurora"] .page-hero .pills { justify-content: center; }
:root[data-design="aurora"] .page-hero .hero-row { grid-template-columns: 1fr; justify-items: center; gap: 22px; }
:root[data-design="aurora"] .page-hero .hero-row__text { margin-inline: auto; color: var(--muted); }
:root[data-design="aurora"] .page-hero .hero-stat { justify-self: center; }
:root[data-design="aurora"] .page-hero::before { width: 80vw; left: 10vw; right: auto; top: -40vw; background: radial-gradient(circle, var(--au-blob-a), var(--au-blob-b) 35%, transparent 65%); opacity: .8; }
:root[data-design="aurora"] .page-hero__grid-bg { opacity: .6; }
:root[data-design="aurora"] .about-hero__row { justify-content: center; flex-direction: column; align-items: center; }

/* CTA: night sky with aurora orbs */
:root[data-design="aurora"] .cta { background: radial-gradient(70% 90% at 20% 0%, rgba(62, 137, 255, .55), transparent 60%), radial-gradient(60% 80% at 90% 100%, rgba(110, 193, 228, .45), transparent 60%), #070b16; border: 1px solid rgba(160, 200, 255, .18); }
:root[data-design="aurora"] .cta__orb--1 { background: radial-gradient(circle, rgba(110, 193, 228, .6), transparent 65%); }

/* Footer glow */
:root[data-design="aurora"] .site-footer { border-top-color: var(--line); }
:root[data-design="aurora"] .site-footer__glow { background: radial-gradient(circle, rgba(110, 193, 228, .3), transparent 65%); }
:root[data-design="aurora"] .site-footer__col { padding: 22px; border-radius: var(--radius); }
:root[data-design="aurora"] .site-footer__top { border-bottom: 0; }

/* Forms */
:root[data-design="aurora"] input[type="text"], :root[data-design="aurora"] input[type="email"], :root[data-design="aurora"] input[type="tel"], :root[data-design="aurora"] textarea { background: var(--surface); }

@media (max-width: 767px) {
	.au-hero__title { font-size: 16.5vw; }
	.au-stack { aspect-ratio: 4 / 3; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.au-aurora i { animation: none; }
	.au-stack { transform: none; }
}

/* ---------- Aurora mockup slider (3D coverflow) ---------- */
.au-stack { aspect-ratio: 16 / 7.6; }
.au-shot { top: 0; left: 50%; width: 70%; height: 100%; cursor: pointer;
	transition: transform 1s var(--ease-out), opacity .9s var(--ease-out), filter .9s var(--ease-out); will-change: transform; }
.au-shot[data-pos="c"]  { z-index: 5; transform: translateX(-50%); opacity: 1; cursor: default; }
.au-shot[data-pos="r"]  { z-index: 3; transform: translateX(-12%) translateZ(-240px) rotateY(-24deg) scale(.84); opacity: .8; filter: saturate(.8); }
.au-shot[data-pos="l"]  { z-index: 3; transform: translateX(-88%) translateZ(-240px) rotateY(24deg) scale(.84); opacity: .8; filter: saturate(.8); }
.au-shot[data-pos="rr"] { z-index: 1; transform: translateX(14%) translateZ(-480px) rotateY(-32deg) scale(.7); opacity: .35; filter: saturate(.6) blur(1px); }
.au-shot[data-pos="ll"] { z-index: 1; transform: translateX(-114%) translateZ(-480px) rotateY(32deg) scale(.7); opacity: .35; filter: saturate(.6) blur(1px); }
.au-shot[data-pos="h"]  { z-index: 0; transform: translateX(-50%) translateZ(-700px) scale(.6); opacity: 0; pointer-events: none; }
.au-shot[data-pos="r"]:hover, .au-shot[data-pos="l"]:hover { opacity: 1; }
.au-controls { position: relative; z-index: 6; display: flex; justify-content: center; align-items: center; gap: 16px; margin-top: clamp(20px, 3vw, 36px); }
.au-nav { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--surface); border: 1px solid var(--line-strong); color: var(--text); box-shadow: inset 0 1px 0 var(--glass-hi); backdrop-filter: blur(12px); transition: background-color .3s, color .3s, transform .3s; }
.au-nav:hover { background: var(--primary); color: #fff; border-color: transparent; }
.au-nav .icon { width: 18px; height: 18px; }
.au-count { font-size: 14px; color: var(--muted); font-variant-numeric: tabular-nums; }
.au-count b { color: var(--text); }
.au-dots { display: flex; gap: 6px; }
.au-dots button { width: 8px; height: 8px; padding: 0; border-radius: 99px; background: var(--line-strong); transition: width .5s var(--ease-out), background-color .3s; }
.au-dots button.is-on { width: 28px; background: var(--au-btn); }
@media (max-width: 767px) {
	.au-stack { aspect-ratio: 4 / 3; }
	.au-shot { width: 100%; }
	.au-shot[data-pos="r"], .au-shot[data-pos="l"], .au-shot[data-pos="rr"], .au-shot[data-pos="ll"] { opacity: 0; pointer-events: none; transform: translateX(-50%) scale(.92); }
	.au-dots { display: none; }
}