/* ============================================================
   Ultra FX – látványos prémium effektek (türkisz paletta)
   ============================================================ */

/* Finom film-grain a teljes oldalon – könnyített, görgetésbarát */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  opacity: 0.028;
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0.14) 0.55px, transparent 0.55px);
  background-size: 3px 3px;
  mix-blend-mode: overlay;
}

/* —— HERO FX —— */

.hero-fx {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

.hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  opacity: 0.55;
}

.hero-orb--1 {
  width: min(520px, 55vw);
  height: min(520px, 55vw);
  top: 10%;
  left: -8%;
  background: radial-gradient(circle, rgba(45, 212, 191, 0.55) 0%, transparent 68%);
  animation: orb-drift-1 14s ease-in-out infinite;
}

.hero-orb--2 {
  width: min(380px, 42vw);
  height: min(380px, 42vw);
  top: 35%;
  right: 5%;
  background: radial-gradient(circle, rgba(34, 211, 238, 0.4) 0%, transparent 68%);
  animation: orb-drift-2 18s ease-in-out infinite;
}

.hero-orb--3 {
  width: min(280px, 30vw);
  height: min(280px, 30vw);
  bottom: 15%;
  left: 35%;
  background: radial-gradient(circle, rgba(252, 211, 77, 0.22) 0%, transparent 70%);
  animation: orb-drift-3 22s ease-in-out infinite;
}

.hero-beam {
  position: absolute;
  top: -20%;
  left: 18%;
  width: 2px;
  height: 140%;
  background: linear-gradient(to bottom, transparent, rgba(45, 212, 191, 0.5), transparent);
  transform: rotate(25deg);
  filter: blur(1px);
  animation: beam-sweep 8s ease-in-out infinite;
  opacity: 0.35;
}

.hero-grid-lines {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(45, 212, 191, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(45, 212, 191, 0.07) 1px, transparent 1px);
  background-size: 72px 72px;
  -webkit-mask-image: radial-gradient(ellipse 85% 75% at 28% 48%, #000 15%, transparent 72%);
  mask-image: radial-gradient(ellipse 85% 75% at 28% 48%, #000 15%, transparent 72%);
  animation: grid-pulse 6s ease-in-out infinite;
}

.hero-content h1 {
  font-size: clamp(2.85rem, 6.5vw, 4.5rem);
  text-shadow:
    0 0 40px rgba(45, 212, 191, 0.15),
    0 2px 28px rgba(2, 6, 23, 0.55);
}

.hero-lead {
  font-size: 1.18rem;
  border-left: 3px solid rgba(45, 212, 191, 0.55);
  padding-left: 1.15rem;
  margin-left: 2px;
}

.card > *,
.warranty-card > *,
.contact-item > *:not(.glass-hover__fx),
.contact-map > *:not(.glass-hover__fx) {
  position: relative;
  z-index: 1;
}

.step-num {
  animation: step-pulse 3s ease-in-out infinite;
}

@keyframes step-pulse {
  0%, 100% { box-shadow: 4px 4px 0 rgba(15, 97, 89, 0.45), 0 0 24px rgba(45, 212, 191, 0.3); }
  50% { box-shadow: 4px 4px 0 rgba(15, 97, 89, 0.55), 0 0 36px rgba(45, 212, 191, 0.48); }
}

.hero h1 em {
  background-size: 220% auto;
  animation: gradient-flow 7s ease infinite;
}

.hero-title-text {
  display: inline-block;
  transform-origin: left center;
}

@keyframes hero-title-tremble {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0); }
  10% { transform: translate3d(-1.5px, 0.5px, 0) rotate(-0.2deg); }
  22% { transform: translate3d(2px, -0.5px, 0) rotate(0.25deg); }
  34% { transform: translate3d(-1px, -0.5px, 0) rotate(-0.15deg); }
  46% { transform: translate3d(1.5px, 0.5px, 0) rotate(0.18deg); }
  58% { transform: translate3d(-0.5px, 0, 0) rotate(-0.08deg); }
  70% { transform: translate3d(1px, -0.25px, 0) rotate(0.1deg); }
  82% { transform: translate3d(-0.5px, 0.25px, 0) rotate(-0.05deg); }
}

.hero-title-text.is-trembling {
  animation: hero-title-tremble 0.52s ease-in-out;
}

/* Gombok – csillogó sweep */
.btn-primary {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.btn-primary::after {
  content: "";
  position: absolute;
  inset: -2px;
  background: linear-gradient(
    105deg,
    transparent 38%,
    rgba(255, 255, 255, 0.42) 50%,
    transparent 62%
  );
  transform: translateX(-120%) skewX(-12deg);
  transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.btn-primary:hover::after {
  transform: translateX(120%) skewX(-12deg);
}

.nav-cta {
  position: relative;
  overflow: hidden;
}

.nav-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, 0.28) 50%, transparent 60%);
  transform: translateX(-130%);
  transition: transform 0.55s ease;
}

.nav-cta:hover::after {
  transform: translateX(130%);
}

/* Hero kártya – pulzáló keret */
.hero-card {
  animation: card-glow-pulse 4s ease-in-out infinite;
}

.hero-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(45, 212, 191, 0.12) 0%,
    transparent 40%,
    rgba(34, 211, 238, 0.08) 100%
  );
  pointer-events: none;
  z-index: 0;
}

.hero-card ul {
  position: relative;
  z-index: 1;
}

/* —— Kártyák – fénycsík hover —— */

.card,
.timeline-item {
  position: relative;
  overflow: hidden;
}

.card::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 55%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(45, 212, 191, 0.14),
    transparent
  );
  transform: skewX(-18deg);
  transition: left 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
  z-index: 2;
}

.card:hover::before {
  left: 140%;
}

/* Garancia – üveg kártyák (mint Áraink) */
@keyframes warranty-aurora {
  0%, 100% {
    transform: translate(0, 0) scale(1);
    opacity: 0.88;
  }
  50% {
    transform: translate(2%, -1.5%) scale(1.04);
    opacity: 1;
  }
}

.warranty-card::before,
.contact-item::before,
.contact-map::before {
  content: "";
  position: absolute;
  inset: 0;
  clip-path: inherit;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.55) 0%, transparent 40%, rgba(255, 255, 255, 0.08) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, transparent 32%);
  pointer-events: none;
  z-index: 0;
  transition: opacity 0.45s ease;
}

.warranty-card::after {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.85), transparent);
  opacity: 0.75;
  pointer-events: none;
  z-index: 2;
  transition: opacity 0.45s ease, box-shadow 0.45s ease;
}

.contact-item::after,
.contact-map::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.85), transparent);
  opacity: 0.75;
  pointer-events: none;
  z-index: 2;
  transition: opacity 0.45s ease, box-shadow 0.45s ease;
}

.warranty-card.glass-hover.is-hover i {
  color: var(--accent);
  filter: drop-shadow(0 4px 18px rgba(45, 212, 191, 0.48));
}

.warranty-grid {
  perspective: 1200px;
}

.warranty::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(45, 212, 191, 0.35) 20%,
    rgba(52, 211, 153, 0.55) 50%,
    rgba(45, 212, 191, 0.35) 80%,
    transparent
  );
  pointer-events: none;
  z-index: 1;
}

/* —— Címsorok – élő keret —— */

.bb-top-left,
.bb-bottom-left,
.bb-top-right,
.bb-bottom-right {
  animation: bracket-glow 3s ease-in-out infinite alternate;
}

.process .bb-top-left,
.process .bb-bottom-left,
.process .bb-top-right,
.process .bb-bottom-right {
  animation: bracket-glow-bright 2.5s ease-in-out infinite alternate;
}

/* —— Szekciók – átmeneti fény —— */

.section {
  isolation: isolate;
}

.hero-scroll-hint {
  animation: scroll-hint-bounce 2.2s ease-in-out infinite;
}

.hero-scroll-hint:hover,
.hero-scroll-hint:focus-visible {
  animation: none;
}

@keyframes scroll-hint-bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50% { transform: translateX(-50%) translateY(6px); }
}

.start-block::after,
.pricing::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(13, 148, 136, 0.35) 20%,
    rgba(45, 212, 191, 0.55) 50%,
    rgba(13, 148, 136, 0.35) 80%,
    transparent
  );
  pointer-events: none;
  z-index: 1;
}

@keyframes pricing-aurora {
  0%, 100% {
    transform: translate(0, 0) scale(1);
    opacity: 0.85;
  }
  50% {
    transform: translate(2%, -1.5%) scale(1.04);
    opacity: 1;
  }
}

/* Üveg hover – penge effekt (Áraink + Folyamat) */
.glass-hover__fx {
  position: absolute;
  inset: 0;
  z-index: 3;
  overflow: hidden;
  clip-path: inherit;
  pointer-events: none;
}

.glass-hover__blade {
  position: absolute;
  top: -65%;
  left: -50%;
  width: 40%;
  height: 230%;
  background: linear-gradient(
    118deg,
    transparent 0%,
    rgba(255, 255, 255, 0.04) 28%,
    rgba(255, 255, 255, 0.95) 46%,
    rgba(153, 246, 228, 0.7) 49%,
    rgba(34, 211, 238, 0.55) 50%,
    rgba(255, 255, 255, 0.9) 51%,
    rgba(255, 255, 255, 0.1) 66%,
    transparent 100%
  );
  transform: skewX(-28deg) rotate(6deg);
  opacity: 0;
  filter: blur(0.35px) drop-shadow(0 0 14px rgba(255, 255, 255, 0.85));
  mix-blend-mode: overlay;
}

.glass-hover__blade--echo {
  width: 24%;
  left: -55%;
  background: linear-gradient(
    118deg,
    transparent 0%,
    rgba(255, 255, 255, 0.55) 48%,
    rgba(45, 212, 191, 0.35) 50%,
    transparent 100%
  );
  filter: blur(0.6px);
}

.glass-hover.is-sweep .glass-hover__blade {
  animation: price-glass-blade 0.75s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.glass-hover.is-sweep .glass-hover__blade--echo {
  animation: price-glass-blade-echo 0.88s cubic-bezier(0.22, 1, 0.36, 1) 0.06s forwards;
}

@keyframes price-glass-blade {
  0% {
    left: -55%;
    opacity: 0;
  }
  15% {
    opacity: 1;
  }
  100% {
    left: 120%;
    opacity: 0;
  }
}

@keyframes price-glass-blade-echo {
  0% {
    left: -60%;
    opacity: 0;
  }
  20% {
    opacity: 0.85;
  }
  100% {
    left: 125%;
    opacity: 0;
  }
}

.glass-hover__fracture {
  position: absolute;
  inset: -15%;
  opacity: 0;
  background: linear-gradient(
    128deg,
    transparent 0%,
    transparent 47.5%,
    rgba(255, 255, 255, 0.98) 48.8%,
    rgba(45, 212, 191, 0.65) 50%,
    rgba(255, 255, 255, 0.92) 51.2%,
    transparent 52.5%,
    transparent 100%
  );
  transform: translateX(-12%) skewX(-14deg);
  mix-blend-mode: soft-light;
}

.glass-hover.is-sweep .glass-hover__fracture {
  animation: price-fracture-sweep 0.62s ease-out forwards;
}

@keyframes price-fracture-sweep {
  0% {
    opacity: 0;
    transform: translateX(-22%) skewX(-14deg);
  }
  30% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateX(18%) skewX(-14deg);
  }
}

.glass-hover__cursor-glow {
  position: absolute;
  left: var(--mx);
  top: var(--my);
  width: 160px;
  height: 160px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(45, 212, 191, 0.42) 0%,
    rgba(255, 255, 255, 0.2) 38%,
    transparent 72%
  );
  opacity: 0;
  filter: blur(10px);
  transition: opacity 0.2s ease;
}

.glass-hover.is-hover .glass-hover__cursor-glow {
  opacity: 1;
}

.price-card::before {
  content: "";
  position: absolute;
  inset: 0;
  clip-path: inherit;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.55) 0%, transparent 40%, rgba(255, 255, 255, 0.08) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, transparent 32%);
  pointer-events: none;
  z-index: 0;
  transition: opacity 0.45s ease;
}

.price-card::after {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.85), transparent);
  opacity: 0.75;
  pointer-events: none;
  z-index: 2;
  transition: opacity 0.45s ease, box-shadow 0.45s ease;
}

.price-card.glass-hover.is-hover::before,
.warranty-card.glass-hover.is-hover::before,
.contact-item.glass-hover.is-hover::before,
.contact-map.glass-hover.is-hover::before {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.88) 0%, transparent 42%, rgba(255, 255, 255, 0.22) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.42) 0%, transparent 35%);
}

.price-card.glass-hover.is-hover::after,
.warranty-card.glass-hover.is-hover::after,
.contact-item.glass-hover.is-hover::after,
.contact-map.glass-hover.is-hover::after {
  opacity: 1;
  box-shadow: 0 0 22px rgba(45, 212, 191, 0.55);
}

.price-card.glass-hover.is-hover .price-value {
  filter: drop-shadow(0 4px 18px rgba(45, 212, 191, 0.48));
}

.price-grid {
  perspective: none;
}

#arak .price-card,
#garancia .warranty-card {
  transform-style: flat;
}

#arak .glass-hover__fx,
#garancia .glass-hover__fx {
  display: none;
}

#arak .price-card.glass-hover.is-hover::before,
#garancia .warranty-card.glass-hover.is-hover::before,
#arak .price-card.glass-hover.is-hover::after,
#garancia .warranty-card.glass-hover.is-hover::after {
  box-shadow: none;
}

#arak .price-card.glass-hover.is-hover .price-value,
#garancia .warranty-card.glass-hover.is-hover i {
  filter: none;
}

.contact-list,
.contact-map {
  perspective: 1200px;
}

@keyframes contact-aurora {
  0%, 100% {
    transform: translate(0, 0) scale(1);
    opacity: 0.88;
  }
  50% {
    transform: translate(-2%, 1.5%) scale(1.04);
    opacity: 1;
  }
}

.contact::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(13, 148, 136, 0.35) 20%,
    rgba(45, 212, 191, 0.55) 50%,
    rgba(13, 148, 136, 0.35) 80%,
    transparent
  );
  pointer-events: none;
  z-index: 1;
}

/* Folyamat – animált scan vonal */
.process::before {
  animation: orb-drift-1 20s ease-in-out infinite;
}

.process .faq-accordion::before {
  content: "";
  position: absolute;
  inset: 0;
  clip-path: inherit;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.28) 0%, transparent 38%, rgba(255, 255, 255, 0.04) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, transparent 28%);
  pointer-events: none;
  z-index: 0;
}

.process .faq-accordion::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.55), transparent);
  opacity: 0.7;
  transition: opacity 0.3s;
  pointer-events: none;
  z-index: 1;
}

.process .faq-accordion.active::before {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.75) 0%, transparent 42%, rgba(255, 255, 255, 0.15) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.35) 0%, transparent 32%);
}

.process .faq-accordion.active::after {
  opacity: 1;
  background: linear-gradient(90deg, transparent, rgba(45, 212, 191, 0.65), transparent);
}

/* Gömb szekció – keringő aurora */
.devices::before {
  content: "";
  position: absolute;
  inset: -20%;
  background:
    radial-gradient(ellipse 40% 35% at 30% 40%, rgba(45, 212, 191, 0.18), transparent 55%),
    radial-gradient(ellipse 35% 30% at 70% 60%, rgba(34, 211, 238, 0.12), transparent 55%);
  animation: aurora-shift 16s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
}

.devices > .container {
  position: relative;
  z-index: 1;
}

.device-globe__atmosphere {
  animation: globe-breathe 5s ease-in-out infinite;
  transition: box-shadow 0.5s ease, filter 0.5s ease;
}

.devices.is-ship-active .device-globe__atmosphere {
  box-shadow:
    0 0 90px rgba(45, 212, 191, 0.65),
    0 0 180px rgba(251, 191, 36, 0.18),
    inset -26px -30px 70px rgba(2, 6, 23, 0.55),
    inset 12px 14px 46px rgba(255, 255, 255, 0.28);
  filter: brightness(1.08);
}

.device-globe__ship {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 24;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.4s ease;
  perspective: 520px;
}

.devices.is-ship-active .device-globe__ship {
  opacity: 1;
  will-change: transform;
}

.device-globe__craft {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: visible;
  filter: drop-shadow(0 0 18px rgba(56, 189, 248, 0.28));
  animation: brand-logo-idle 2.8s ease-in-out infinite;
}

.devices.is-ship-active .device-globe__craft {
  filter: drop-shadow(0 0 24px rgba(56, 189, 248, 0.48));
  animation: brand-logo-active 3.8s ease-in-out infinite;
}

.device-globe__craft-dome {
  position: relative;
  z-index: 2;
  display: block;
  width: clamp(42px, 6.2vw, 58px);
  height: auto;
  margin-bottom: -0.42rem;
  overflow: visible;
}

.device-globe__brand-logo {
  position: relative;
  z-index: 3;
  display: block;
  width: auto;
  height: clamp(28px, 4.2vw, 42px);
  max-width: min(50vw, 190px);
  filter: drop-shadow(0 1px 2px rgba(255, 255, 255, 0.35));
}

.device-globe__craft-arms {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 5;
  pointer-events: none;
}

.device-globe__arm {
  position: absolute;
  top: 54%;
  width: 0;
  height: 0;
}

.device-globe__arm--left {
  left: 8%;
}

.device-globe__arm--right {
  right: 8%;
}

.device-globe__arm-shoulder {
  position: absolute;
  left: 0;
  top: 0;
  transform-origin: 50% 0;
}

.devices.is-ship-active .device-globe__arm-shoulder,
.devices.is-ship-active .device-globe__arm-elbow {
  will-change: transform;
}

.device-globe__arm-upper {
  width: clamp(3px, 0.45vw, 4px);
  height: clamp(20px, 3.2vw, 30px);
  margin: 0 auto;
  border-radius: 999px;
  background: linear-gradient(90deg, #27272a, #71717a 48%, #3f3f46);
  box-shadow: 0 0 5px rgba(24, 24, 27, 0.45);
}

.device-globe__arm-elbow {
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  transform-origin: 50% 0;
}

.device-globe__arm-lower {
  width: clamp(3px, 0.42vw, 4px);
  height: clamp(16px, 2.6vw, 24px);
  margin: 0 auto;
  border-radius: 999px;
  background: linear-gradient(90deg, #18181b, #52525b 50%, #27272a);
}

.device-globe__arm-hand {
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  width: clamp(18px, 2.6vw, 24px);
  height: clamp(14px, 2vw, 18px);
}

.device-globe__arm-wrench,
.device-globe__arm-driver {
  position: absolute;
  display: block;
  overflow: visible;
}

.device-globe__arm-wrench {
  left: 0;
  bottom: 0;
  width: 58%;
  height: auto;
  transform: rotate(-18deg);
  transform-origin: 80% 80%;
}

.device-globe__arm-driver {
  right: 0;
  bottom: 0;
  width: 48%;
  height: auto;
  transform: rotate(12deg);
  transform-origin: 50% 90%;
}

.device-globe__arm--right .device-globe__arm-wrench {
  transform: rotate(18deg) scaleX(-1);
}

.device-globe__arm--right .device-globe__arm-driver {
  transform: rotate(-12deg) scaleX(-1);
}

.device-globe__arm-shoulder::before,
.device-globe__arm-elbow::before {
  content: "";
  position: absolute;
  z-index: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #71717a, #27272a);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.device-globe__arm-shoulder::before {
  left: 50%;
  top: 0;
  width: clamp(7px, 1vw, 9px);
  height: clamp(7px, 1vw, 9px);
  transform: translate(-50%, -45%);
}

.device-globe__arm-elbow::before {
  left: 50%;
  top: 0;
  width: clamp(6px, 0.85vw, 8px);
  height: clamp(6px, 0.85vw, 8px);
  transform: translate(-50%, -42%);
}

.device-globe__arm.is-servicing .device-globe__arm-hand {
  animation: arm-tool-work 0.16s ease-in-out infinite alternate;
}

.device-globe__arm.is-servicing .device-globe__arm-hand::before,
.device-globe__arm.is-servicing .device-globe__arm-hand::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  pointer-events: none;
  animation: arm-contact-spark 0.2s ease-out infinite;
}

.device-globe__arm.is-servicing .device-globe__arm-hand::before {
  background: #fef08a;
  box-shadow:
    -6px -4px 0 0 #fbbf24,
    5px -6px 0 0 #fff,
    -3px 6px 0 0 #f97316,
    0 0 8px #fbbf24;
  animation-delay: 0s;
}

.device-globe__arm.is-servicing .device-globe__arm-hand::after {
  background: #bae6fd;
  box-shadow:
    4px 3px 0 0 #38bdf8,
    -5px 2px 0 0 #fff,
    0 0 10px #60a5fa;
  animation-delay: 0.1s;
}

@keyframes arm-contact-spark {
  0% { transform: translate(-50%, -50%) scale(0.5); opacity: 0.4; }
  40% { opacity: 1; }
  100% { transform: translate(calc(-50% + var(--ax, 4px)), calc(-50% + var(--ay, -6px))) scale(1.6); opacity: 0; }
}

@keyframes arm-tool-work {
  0% { transform: translateX(-50%) rotate(-10deg); }
  100% { transform: translateX(-50%) rotate(12deg); }
}

.device-globe__repair-fx {
  position: absolute;
  inset: -22px;
  pointer-events: none;
  opacity: 0;
  z-index: 4;
  overflow: visible;
  contain: layout paint style;
}

.device-globe__logo.is-being-serviced .device-globe__repair-fx {
  opacity: 1;
}

.device-globe__logo-smoke {
  position: absolute;
  left: 50%;
  bottom: 8%;
  width: 88%;
  height: 70%;
  transform: translateX(-50%);
  border-radius: 50%;
  background:
    radial-gradient(ellipse at 45% 75%, rgba(148, 163, 184, 0.62), rgba(100, 116, 139, 0.28) 46%, transparent 72%);
  animation: repair-smoke 1.1s ease-out infinite;
}

.device-globe__logo-smoke--alt {
  width: 64%;
  height: 55%;
  bottom: 18%;
  background:
    radial-gradient(ellipse at 55% 70%, rgba(203, 213, 225, 0.48), rgba(71, 85, 105, 0.22) 50%, transparent 75%);
  animation-delay: 0.35s;
  animation-duration: 1.35s;
}

@keyframes repair-smoke {
  0% { transform: translateX(-50%) translateY(10px) scale(0.75); opacity: 0.15; }
  35% { opacity: 0.85; }
  100% { transform: translateX(-50%) translateY(-22px) scale(1.35); opacity: 0; }
}

.device-globe__logo-flash {
  position: absolute;
  inset: 2px;
  border-radius: 11px;
  pointer-events: none;
  animation: repair-flash 0.28s steps(2, end) infinite;
}

@keyframes repair-flash {
  0%, 100% {
    background: rgba(255, 255, 255, 0);
    box-shadow: inset 0 0 0 0 rgba(255, 255, 255, 0);
  }
  50% {
    background: rgba(255, 255, 255, 0.32);
    box-shadow:
      inset 0 0 18px rgba(186, 230, 253, 0.85),
      0 0 20px rgba(56, 189, 248, 0.75),
      0 0 36px rgba(251, 191, 36, 0.45);
  }
}

.device-globe__logo-bolts {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.device-globe__logo-bolts i {
  position: absolute;
  display: block;
  width: 2px;
  height: clamp(10px, 2vw, 16px);
  background: linear-gradient(to bottom, #fff 0%, #7dd3fc 35%, #38bdf8 60%, transparent 100%);
  transform-origin: 50% 0;
  opacity: 0;
  filter: drop-shadow(0 0 4px #38bdf8);
  animation: repair-bolt 0.32s steps(1, end) infinite;
}

.device-globe__logo-bolts i:nth-child(1) { left: 22%; top: 10%; transform: rotate(-18deg); animation-delay: 0s; }
.device-globe__logo-bolts i:nth-child(2) { left: 68%; top: 14%; transform: rotate(22deg); animation-delay: 0.08s; }
.device-globe__logo-bolts i:nth-child(3) { left: 42%; top: 6%; transform: rotate(-6deg); animation-delay: 0.16s; }
.device-globe__logo-bolts i:nth-child(4) { left: 54%; top: 18%; transform: rotate(12deg); animation-delay: 0.22s; }

@keyframes repair-bolt {
  0%, 100% { opacity: 0; height: 0; }
  15% { opacity: 1; height: clamp(12px, 2.2vw, 18px); }
  35% { opacity: 0; height: clamp(8px, 1.6vw, 12px); }
}

.device-globe__logo-sparks {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.device-globe__logo-sparks i {
  position: absolute;
  display: block;
  border-radius: 50%;
  animation: logo-spark 0.22s ease-out infinite;
}

.device-globe__logo-sparks i:nth-child(odd) {
  width: 3px;
  height: 3px;
  background: #fef08a;
  box-shadow: 0 0 6px #fbbf24, 0 0 12px #f97316;
}

.device-globe__logo-sparks i:nth-child(even) {
  width: 2px;
  height: 2px;
  background: #fff;
  box-shadow: 0 0 5px #bae6fd, 0 0 10px #38bdf8;
  animation-duration: 0.18s;
}

.device-globe__logo-sparks i:nth-child(1)  { left: 12%; top: 18%; animation-delay: 0s;    --sx: -7px; --sy: -8px; }
.device-globe__logo-sparks i:nth-child(2)  { left: 28%; top: 8%;  animation-delay: 0.04s; --sx: -4px; --sy: -9px; }
.device-globe__logo-sparks i:nth-child(3)  { left: 44%; top: 14%; animation-delay: 0.08s; --sx: 2px;  --sy: -10px; }
.device-globe__logo-sparks i:nth-child(4)  { left: 58%; top: 6%;  animation-delay: 0.02s; --sx: 6px;  --sy: -8px; }
.device-globe__logo-sparks i:nth-child(5)  { left: 74%; top: 20%; animation-delay: 0.1s;  --sx: 8px;  --sy: -5px; }
.device-globe__logo-sparks i:nth-child(6)  { left: 86%; top: 34%; animation-delay: 0.06s; --sx: 9px;  --sy: 2px; }
.device-globe__logo-sparks i:nth-child(7)  { left: 78%; top: 62%; animation-delay: 0.12s; --sx: 7px;  --sy: 7px; }
.device-globe__logo-sparks i:nth-child(8)  { left: 62%; top: 78%; animation-delay: 0.03s; --sx: 5px;  --sy: 9px; }
.device-globe__logo-sparks i:nth-child(9)  { left: 46%; top: 84%; animation-delay: 0.14s; --sx: 0;   --sy: 10px; }
.device-globe__logo-sparks i:nth-child(10) { left: 30%; top: 72%; animation-delay: 0.07s; --sx: -5px; --sy: 8px; }
.device-globe__logo-sparks i:nth-child(11) { left: 16%; top: 56%; animation-delay: 0.11s; --sx: -8px; --sy: 4px; }
.device-globe__logo-sparks i:nth-child(12) { left: 8%;  top: 38%; animation-delay: 0.05s; --sx: -9px; --sy: -2px; }
.device-globe__logo-sparks i:nth-child(13) { left: 36%; top: 42%; animation-delay: 0.09s; --sx: -3px; --sy: 6px; }
.device-globe__logo-sparks i:nth-child(14) { left: 66%; top: 48%; animation-delay: 0.13s; --sx: 4px;  --sy: 5px; }

@keyframes logo-spark {
  0% { transform: scale(0.3) translate(0, 0); opacity: 0; }
  20% { opacity: 1; }
  100% { transform: scale(1.8) translate(var(--sx, 4px), var(--sy, -5px)); opacity: 0; }
}

.device-globe__logo.is-being-serviced img {
  animation: repair-logo-flicker 0.24s steps(2, end) infinite;
  filter:
    drop-shadow(0 0 10px rgba(251, 191, 36, 0.9))
    drop-shadow(0 0 18px rgba(56, 189, 248, 0.55))
    drop-shadow(0 2px 4px rgba(15, 23, 42, 0.15));
}

@keyframes repair-logo-flicker {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.82; transform: scale(1.04); }
}

.device-globe__craft-thrust {
  position: absolute;
  top: calc(100% - 0.35rem);
  left: 50%;
  z-index: 1;
  transform: translateX(-50%);
  width: clamp(34px, 5.2vw, 48px);
  height: clamp(36px, 5.4vw, 52px);
  pointer-events: none;
}

.device-globe__craft-plume {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  transform-origin: 50% 0%;
  border-radius: 0 0 50% 50%;
  pointer-events: none;
}

.device-globe__craft-plume--outer {
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom,
    rgba(56, 189, 248, 0.34) 0%,
    rgba(14, 165, 233, 0.16) 45%,
    rgba(56, 189, 248, 0.02) 100%);
  clip-path: polygon(8% 0, 92% 0, 100% 100%, 0 100%);
  opacity: 0.72;
  animation: craft-thrust-outer 1.05s ease-in-out infinite;
}

.device-globe__craft-plume--mid {
  width: 68%;
  height: 82%;
  background: linear-gradient(to bottom,
    rgba(186, 230, 253, 0.82) 0%,
    rgba(56, 189, 248, 0.52) 38%,
    rgba(14, 165, 233, 0.08) 100%);
  clip-path: polygon(12% 0, 88% 0, 100% 100%, 0 100%);
  opacity: 0.88;
  animation: craft-thrust-mid 0.78s ease-in-out infinite;
}

.device-globe__craft-plume--core {
  width: 38%;
  height: 62%;
  background: linear-gradient(to bottom,
    #f0f9ff 0%,
    #7dd3fc 42%,
    rgba(56, 189, 248, 0.15) 100%);
  clip-path: polygon(18% 0, 82% 0, 100% 100%, 0 100%);
  opacity: 0.95;
  animation: craft-thrust-core 0.55s ease-in-out infinite;
}

.device-globe__craft-bloom {
  position: absolute;
  left: 50%;
  top: -2px;
  transform: translateX(-50%);
  width: 72%;
  height: 12px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(125, 211, 252, 0.85), rgba(56, 189, 248, 0.15) 68%, transparent 100%);
  animation: craft-thrust-bloom 0.9s ease-in-out infinite;
}

.devices.is-ship-active .device-globe__craft-plume--outer {
  opacity: 1;
}

.devices.is-ship-active .device-globe__craft-plume--mid,
.devices.is-ship-active .device-globe__craft-plume--core,
.devices.is-ship-active .device-globe__craft-bloom {
  animation-duration: 0.62s;
}

@keyframes craft-thrust-outer {
  0%, 100% { transform: translateX(-50%) scaleY(0.86); opacity: 0.58; }
  50% { transform: translateX(-50%) scaleY(1.08); opacity: 0.92; }
}

@keyframes craft-thrust-mid {
  0%, 100% { transform: translateX(-50%) scaleY(0.8); opacity: 0.72; }
  50% { transform: translateX(-50%) scaleY(1.12); opacity: 1; }
}

@keyframes craft-thrust-core {
  0%, 100% { transform: translateX(-50%) scaleY(0.74); opacity: 0.82; }
  50% { transform: translateX(-50%) scaleY(1.18); opacity: 1; }
}

@keyframes craft-thrust-bloom {
  0%, 100% { transform: translateX(-50%) scale(0.88); opacity: 0.65; }
  50% { transform: translateX(-50%) scale(1.12); opacity: 1; }
}

@keyframes brand-logo-idle {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}

@keyframes brand-logo-active {
  0%, 100% { transform: translateY(0) rotate(-2deg); }
  50% { transform: translateY(-5px) rotate(2deg); }
}

.devices.is-ship-active {
  background-position:
    260px 220px,
    300px 260px,
    340px 280px,
    280px 240px,
    320px 300px,
    100% 100%,
    100% 100%,
    100% 100%;
  animation: devices-star-drift 18s linear infinite;
}

@keyframes devices-star-drift {
  from { background-position: 0 0, 40px 20px, 80px 40px, 20px 60px, 60px 10px, 0 0, 0 0, 0 0; }
  to { background-position: -260px -220px, -220px -180px, -180px -160px, -240px -140px, -200px -200px, 0 0, 0 0, 0 0; }
}

/* Brand sáv – fénycsík */
.brand-strip::before {
  content: "";
  position: absolute;
  top: 0;
  left: -30%;
  width: 30%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.08), transparent);
  animation: brand-shine 6s linear infinite;
  pointer-events: none;
  z-index: 2;
}

/* Kapcsolat térkép – üveg keret */
.contact-map iframe {
  position: relative;
  z-index: 4;
}

/* Lábléc – aurora + fénycsík */
.site-footer::before {
  content: "";
  position: absolute;
  inset: -15%;
  background:
    radial-gradient(ellipse 42% 55% at 15% 25%, rgba(45, 212, 191, 0.2), transparent 58%),
    radial-gradient(ellipse 38% 50% at 85% 75%, rgba(52, 211, 153, 0.14), transparent 55%),
    radial-gradient(ellipse 55% 48% at 50% 100%, rgba(20, 184, 166, 0.12), transparent 62%);
  pointer-events: none;
  animation: footer-aurora 24s ease-in-out infinite;
}

.site-footer::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(45, 212, 191, 0.35) 20%,
    rgba(52, 211, 153, 0.55) 50%,
    rgba(45, 212, 191, 0.35) 80%,
    transparent
  );
  pointer-events: none;
  z-index: 1;
}

@keyframes footer-aurora {
  0%, 100% {
    transform: translate(0, 0) scale(1);
    opacity: 0.88;
  }
  50% {
    transform: translate(2%, -1.5%) scale(1.04);
    opacity: 1;
  }
}

/* —— Keyframes —— */

@keyframes gradient-flow {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes orb-drift-1 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(40px, -30px) scale(1.06); }
  66% { transform: translate(-20px, 25px) scale(0.96); }
}

@keyframes orb-drift-2 {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(-35px, 20px); }
}

@keyframes orb-drift-3 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  40% { transform: translate(25px, -15px) scale(1.08); }
  80% { transform: translate(-15px, 10px) scale(0.94); }
}

@keyframes beam-sweep {
  0%, 100% { opacity: 0.2; transform: rotate(25deg) translateX(0); }
  50% { opacity: 0.5; transform: rotate(25deg) translateX(30px); }
}

@keyframes grid-pulse {
  0%, 100% { opacity: 0.6; }
  50% { opacity: 1; }
}

@keyframes card-glow-pulse {
  0%, 100% {
    box-shadow:
      10px 10px 0 rgba(45, 212, 191, 0.28),
      0 0 0 1px rgba(45, 212, 191, 0.12) inset,
      0 32px 70px rgba(2, 6, 23, 0.55);
  }
  50% {
    box-shadow:
      10px 10px 0 rgba(45, 212, 191, 0.38),
      0 0 0 1px rgba(45, 212, 191, 0.22) inset,
      0 32px 70px rgba(2, 6, 23, 0.55),
      0 0 48px rgba(45, 212, 191, 0.18);
  }
}

@keyframes featured-pulse {
  0%, 100% {
    box-shadow: 8px 8px 0 rgba(15, 97, 89, 0.42), 0 0 32px rgba(45, 212, 191, 0.15);
  }
  50% {
    box-shadow: 8px 8px 0 rgba(15, 97, 89, 0.52), 0 0 52px rgba(45, 212, 191, 0.28);
  }
}

@keyframes bracket-glow {
  from { filter: drop-shadow(0 0 0 transparent); opacity: 0.85; }
  to { filter: drop-shadow(0 0 6px rgba(13, 148, 136, 0.45)); opacity: 1; }
}

@keyframes bracket-glow-bright {
  from { filter: drop-shadow(0 0 0 transparent); }
  to { filter: drop-shadow(0 0 10px rgba(45, 212, 191, 0.65)); }
}

@keyframes aurora-shift {
  0%, 100% { transform: translate(0, 0) rotate(0deg); opacity: 0.7; }
  50% { transform: translate(3%, -2%) rotate(2deg); opacity: 1; }
}

@keyframes globe-breathe {
  0%, 100% {
    box-shadow:
      0 0 70px rgba(45, 212, 191, 0.45),
      0 0 140px rgba(13, 148, 136, 0.22),
      inset -26px -30px 70px rgba(2, 6, 23, 0.6),
      inset 12px 14px 46px rgba(255, 255, 255, 0.22);
  }
  50% {
    box-shadow:
      0 0 90px rgba(45, 212, 191, 0.58),
      0 0 180px rgba(13, 148, 136, 0.32),
      inset -26px -30px 70px rgba(2, 6, 23, 0.6),
      inset 12px 14px 46px rgba(255, 255, 255, 0.28);
  }
}

@keyframes brand-shine {
  0% { left: -30%; }
  100% { left: 130%; }
}

@keyframes map-frame-pulse {
  0%, 100% { box-shadow: 8px 8px 0 rgba(13, 148, 136, 0.22); }
  50% { box-shadow: 8px 8px 0 rgba(13, 148, 136, 0.32), 0 0 36px rgba(45, 212, 191, 0.15); }
}

/* Egér követő fény – JS aktiválja */
.hero-fx.is-active .hero-orb--1 {
  transition: transform 0.35s ease-out;
}

@media (prefers-reduced-motion: reduce) {
  body::after,
  .hero-orb,
  .hero-beam,
  .hero-grid-lines,
  .hero h1 em,
  .hero-title-text.is-trembling,
  .hero-card,
  .device-globe__atmosphere,
  .devices.is-ship-active,
  .device-globe__craft,
  .device-globe__craft-plume,
  .device-globe__craft-bloom,
  .device-globe__arm.is-servicing .device-globe__arm-hand,
  .device-globe__arm.is-servicing .device-globe__arm-hand::before,
  .device-globe__arm.is-servicing .device-globe__arm-hand::after,
  .device-globe__logo-sparks i,
  .device-globe__logo-smoke,
  .device-globe__logo-flash,
  .device-globe__logo-bolts i,
  .device-globe__logo.is-being-serviced img,
  .bb-top-left,
  .bb-bottom-left,
  .bb-top-right,
  .bb-bottom-right,
  .brand-strip::before,
  .step-num,
  .pricing::before,
  .warranty::before,
  .contact::before,
  .site-footer::before {
    animation: none !important;
  }

  .glass-hover.is-sweep .glass-hover__blade,
  .glass-hover.is-sweep .glass-hover__blade--echo,
  .glass-hover.is-sweep .glass-hover__fracture {
    animation: none !important;
    opacity: 0 !important;
  }

  .btn-primary::after,
  .nav-cta::after {
    display: none;
  }
}

/* Áraink / Garancia / Kapcsolat – fényátfedés (sweep) nélkül, többi effekt marad */

#arak .glass-hover__blade,
#arak .glass-hover__blade--echo,
#arak .glass-hover__fracture,
#arak .glass-hover__cursor-glow,
#garancia .glass-hover__blade,
#garancia .glass-hover__blade--echo,
#garancia .glass-hover__fracture,
#garancia .glass-hover__cursor-glow,
#kapcsolat .glass-hover__blade,
#kapcsolat .glass-hover__blade--echo,
#kapcsolat .glass-hover__fracture,
#kapcsolat .glass-hover__cursor-glow {
  display: none !important;
}

#arak .glass-hover.is-sweep .glass-hover__blade,
#arak .glass-hover.is-sweep .glass-hover__blade--echo,
#arak .glass-hover.is-sweep .glass-hover__fracture,
#garancia .glass-hover.is-sweep .glass-hover__blade,
#garancia .glass-hover.is-sweep .glass-hover__blade--echo,
#garancia .glass-hover.is-sweep .glass-hover__fracture,
#kapcsolat .glass-hover.is-sweep .glass-hover__blade,
#kapcsolat .glass-hover.is-sweep .glass-hover__blade--echo,
#kapcsolat .glass-hover.is-sweep .glass-hover__fracture {
  animation: none !important;
  opacity: 0 !important;
}

#arak .price-card.glass-hover.is-hover::before,
#garancia .warranty-card.glass-hover.is-hover::before,
#kapcsolat .contact-item.glass-hover.is-hover::before,
#kapcsolat .contact-map.glass-hover.is-hover::before {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.55) 0%, transparent 40%, rgba(255, 255, 255, 0.08) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, transparent 32%);
}

#arak .price-card.glass-hover.is-hover::after,
#garancia .warranty-card.glass-hover.is-hover::after,
#kapcsolat .contact-item.glass-hover.is-hover::after,
#kapcsolat .contact-map.glass-hover.is-hover::after {
  opacity: 0.75;
  box-shadow: none;
}

/* Áraink / Garancia – enyhe hover (nincs 3D billenés, flip, glow) */

/* Görgetés közben – animáció/blur szünet a simaságért */

body.is-scrolling .hero-orb,
body.is-scrolling .hero-beam,
body.is-scrolling .hero-grid-lines,
body.is-scrolling .brand-strip::before,
body.is-scrolling .brand-marquee-track,
body.is-scrolling .pricing::before,
body.is-scrolling .warranty::before,
body.is-scrolling .contact::before,
body.is-scrolling .site-footer::before,
body.is-scrolling .bb-top-left,
body.is-scrolling .bb-bottom-left,
body.is-scrolling .bb-top-right,
body.is-scrolling .bb-bottom-right,
body.is-scrolling .step-num,
body.is-scrolling .device-globe__atmosphere,
body.is-scrolling .devices.is-ship-active {
  animation-play-state: paused !important;
}

body.is-scrolling .price-card,
body.is-scrolling .warranty-card,
body.is-scrolling .contact-item,
body.is-scrolling .contact-map,
body.is-scrolling .hero-card,
body.is-scrolling .feature-box,
body.is-scrolling .process .faq-accordion.active,
body.is-scrolling .site-header::before {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.is-scrolling .site-header {
  transition: none;
}