@font-face {
  font-family: "Manrope IOTIC";
  src: url("../fonts/manrope-latin-variable.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

@font-face {
  font-family: "Space Grotesk IOTIC";
  src: url("../fonts/space-grotesk-latin-variable.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}

:root {
  --bg: #030a13;
  --bg-deep: #02070e;
  --panel: rgba(6, 17, 31, .88);
  --panel-strong: rgba(7, 22, 41, .96);
  --line: rgba(77, 187, 255, .15);
  --line-strong: rgba(48, 212, 255, .34);
  --text: #eef7ff;
  --muted: #9ab0c4;
  --cyan: #27dcff;
  --cyan-soft: #72efff;
  --blue: #1788ff;
  --green: #58f5c7;
  --shadow: 0 26px 80px rgba(0, 0, 0, .42);
  --radius-xl: 30px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --max-width: 1370px;
  --font-body: "Manrope IOTIC", "Segoe UI", system-ui, sans-serif;
  --font-display: "Space Grotesk IOTIC", "Manrope IOTIC", "Segoe UI", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  color: var(--text);
  background: var(--bg);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.skip-link {
  position: fixed;
  z-index: 999;
  top: 10px;
  left: 10px;
  padding: 10px 14px;
  color: #03111b;
  border-radius: 10px;
  background: var(--cyan);
  font-weight: 800;
  transform: translateY(-160%);
  transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid rgba(114, 239, 255, .72); outline-offset: 3px; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
.brand strong,
.main-menu,
.eyebrow,
.section-kicker,
h1, h2, h3,
.btn,
.project-category,
.stats-strip strong {
  font-family: var(--font-display);
}
.container { width: min(var(--max-width), calc(100% - 56px)); margin-inline: auto; }

.site-backdrop {
  position: fixed;
  inset: 0;
  z-index: -10;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at 8% 28%, rgba(28, 213, 255, .13), transparent 27%),
    radial-gradient(circle at 91% 13%, rgba(35, 105, 255, .18), transparent 30%),
    linear-gradient(145deg, #020810 0%, #061221 47%, #020810 100%);
}
.backdrop-grid {
  position: absolute;
  inset: 0;
  opacity: .42;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: radial-gradient(circle at 52% 28%, #000 22%, transparent 82%);
}
.backdrop-glow {
  position: absolute;
  width: 480px;
  aspect-ratio: 1;
  border-radius: 50%;
  filter: blur(100px);
  opacity: .18;
  animation: backgroundFloat 12s ease-in-out infinite;
}
.glow-left { left: -180px; top: 160px; background: var(--cyan); }
.glow-right { right: -150px; top: 40px; background: #245cff; animation-delay: -4s; }
.stars {
  position: absolute;
  inset: 0;
  opacity: .24;
  background-image: radial-gradient(circle, rgba(93, 225, 255, .85) 0 1px, transparent 1.5px);
  background-size: 72px 72px;
  animation: starsDrift 30s linear infinite;
}
@keyframes backgroundFloat {
  0%, 100% { transform: translate3d(0,0,0) scale(1); }
  50% { transform: translate3d(30px,-24px,0) scale(1.08); }
}
@keyframes starsDrift { to { transform: translate3d(-72px, 72px, 0); } }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  padding: 15px 0 0;
}
.nav {
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 8px 10px 8px 14px;
  border: 1px solid rgba(79, 189, 255, .13);
  border-radius: 999px;
  background: rgba(3, 10, 18, .79);
  backdrop-filter: blur(20px);
  box-shadow: 0 16px 42px rgba(0,0,0,.3);
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
}
.brand img {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 0 28px rgba(39, 220, 255, .18);
}
.brand strong {
  font-size: 1.08rem;
  font-weight: 650;
  letter-spacing: .14em;
}
.main-menu {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}
.main-menu > a {
  position: relative;
  padding: 11px 13px;
  border-radius: 999px;
  color: var(--muted);
  font-size: .91rem;
  font-weight: 750;
  transition: color .2s ease, background .2s ease, transform .2s ease;
}
.main-menu > a:hover,
.main-menu > a.active { color: var(--text); }
.main-menu > a:not(.nav-cta):not(.access-link)::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: 4px;
  height: 2px;
  border-radius: 99px;
  background: var(--cyan);
  transition: left .2s ease, right .2s ease;
}
.main-menu > a.active::after,
.main-menu > a:hover::after { left: 13px; right: 13px; }
.main-menu .access-link {
  margin-left: 4px;
  border: 1px solid rgba(79, 189, 255, .18);
  background: rgba(255,255,255,.02);
}
.main-menu .nav-cta {
  margin-left: 4px;
  padding-inline: 19px;
  color: #03111b;
  background: linear-gradient(135deg, var(--cyan), #4bc4ff);
  box-shadow: 0 13px 30px rgba(39, 220, 255, .16);
}
.main-menu .nav-cta:hover { transform: translateY(-1px); color: #03111b; }
.main-menu .nav-cta span { margin-left: 9px; font-size: 1.3rem; line-height: 0; }
.language-switch {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: 3px;
  padding: 5px 7px;
  border: 1px solid rgba(79, 189, 255, .18);
  border-radius: 999px;
  background: rgba(255,255,255,.025);
}
.language-switch a {
  min-width: 27px;
  padding: 5px 6px;
  color: var(--muted);
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 850;
  text-align: center;
  transition: color .2s ease, background .2s ease;
}
.language-switch a:hover { color: var(--text); }
.language-switch a.current { color: #03111b; background: var(--cyan); }
.language-switch > span { color: rgba(154, 176, 196, .5); font-size: .68rem; }
.menu-toggle {
  display: none;
  width: 46px;
  height: 46px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgba(255,255,255,.04);
  cursor: pointer;
}
.menu-toggle span {
  display: block;
  width: 21px;
  height: 2px;
  margin: 5px auto;
  border-radius: 99px;
  background: var(--text);
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(570px, 1.08fr);
  align-items: center;
  gap: 26px;
  min-height: 690px;
  padding: 45px 0 32px;
}
.hero-copy { position: relative; z-index: 5; padding-left: 10px; }
.eyebrow,
.section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--cyan);
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.eyebrow {
  padding: 10px 14px;
  border: 1px solid rgba(39, 220, 255, .32);
  border-radius: 999px;
  background: rgba(2, 13, 23, .45);
}
.eyebrow svg { width: 18px; height: 18px; fill: var(--cyan); }
.hero h1 {
  max-width: 680px;
  margin: 22px 0 18px;
  font-size: clamp(3.05rem, 5.25vw, 4.8rem);
  line-height: .98;
  font-weight: 650;
  letter-spacing: -.048em;
}
.hero h1 span {
  display: block;
  color: var(--cyan);
  text-shadow: 0 0 30px rgba(39, 220, 255, .16);
}
.hero-copy > p {
  max-width: 570px;
  margin: 0;
  color: var(--muted);
  font-size: 1.03rem;
  line-height: 1.75;
}
.hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 13px;
  margin-top: 29px;
}
.btn {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 22px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 850;
  cursor: pointer;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn-primary {
  color: #03121d;
  background: linear-gradient(135deg, #35c9ff, #57f2c7);
  box-shadow: 0 17px 38px rgba(39, 220, 255, .22);
}
.btn-outline {
  color: var(--text);
  border-color: rgba(95, 190, 255, .22);
  background: rgba(255,255,255,.025);
}
.btn-outline:hover { border-color: rgba(39, 220, 255, .45); }
.full-width { width: 100%; }
.trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 31px;
  color: var(--muted);
  font-size: .84rem;
}
.trust-row > span { display: inline-flex; align-items: center; gap: 8px; }
.trust-icon {
  position: relative;
  width: 18px;
  height: 18px;
  display: inline-block;
  border: 1px solid rgba(103, 191, 255, .42);
}
.trust-icon.shield { clip-path: polygon(50% 0, 92% 18%, 86% 72%, 50% 100%, 14% 72%, 8% 18%); }
.trust-icon.clock { border-radius: 50%; }
.trust-icon.clock::after { content: ""; position: absolute; width: 1px; height: 5px; left: 8px; top: 3px; background: var(--cyan); box-shadow: 2px 5px 0 var(--cyan); }
.trust-icon.check { border-radius: 50%; }
.trust-icon.check::after { content: ""; position: absolute; left: 4px; top: 5px; width: 7px; height: 4px; border-left: 2px solid var(--cyan); border-bottom: 2px solid var(--cyan); transform: rotate(-45deg); }

.hero-visual { position: relative; min-width: 0; }
.tech-orbit {
  position: relative;
  width: min(100%, 720px);
  min-height: 600px;
  margin-inline: auto;
  display: grid;
  place-items: center;
  isolation: isolate;
  perspective: 1100px;
}
.tech-orbit::before {
  content: "";
  position: absolute;
  width: 76%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(40, 199, 255, .14), rgba(13, 46, 79, .06) 52%, transparent 72%);
  filter: blur(3px);
  z-index: -3;
}
.orbit-plane {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(43, 201, 255, .21);
  border-radius: 50%;
  transform-origin: center;
  z-index: -2;
  will-change: transform;
}
.orbit-plane::before,
.orbit-plane::after {
  content: "";
  position: absolute;
  inset: 9%;
  border: 1px dashed rgba(57, 187, 255, .1);
  border-radius: inherit;
}
.orbit-plane::after { inset: 22%; border-style: solid; opacity: .7; }
.orbit-plane-1 {
  width: 610px; height: 610px;
  margin: -305px 0 0 -305px;
  animation: orbitSpin 30s linear infinite;
}
.orbit-plane-2 {
  width: 540px; height: 540px;
  margin: -270px 0 0 -270px;
  animation: orbitSpinReverse 24s linear infinite;
}
.orbit-plane-3 {
  width: 460px; height: 460px;
  margin: -230px 0 0 -230px;
  animation: orbitSpin 19s linear infinite;
}
.orbit-plane-4 {
  width: 382px; height: 382px;
  margin: -191px 0 0 -191px;
  animation: orbitSpinReverse 15s linear infinite;
}
.orbit-plane-5 {
  width: 312px; height: 312px;
  margin: -156px 0 0 -156px;
  animation: orbitSpin 11s linear infinite;
}
.orbit-dot {
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #d3ffff 0 12%, #33e5ff 35%, #099eca 72%, transparent 74%);
  box-shadow: 0 0 12px rgba(39,220,255,.9), 0 0 26px rgba(39,220,255,.5);
}
.dot-1 { top: 12%; right: 17%; }
.dot-2 { bottom: 10%; left: 18%; }
.dot-3 { top: 48%; left: -7px; }
.dot-4 { bottom: 15%; right: 12%; }
.dot-5 { top: -7px; left: calc(50% - 7px); }
@keyframes orbitSpin { to { transform: rotate(360deg); } }
@keyframes orbitSpinReverse { to { transform: rotate(-360deg); } }

.ambient-particle {
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 18px rgba(39,220,255,.9);
  animation: particleFloat 4.8s ease-in-out infinite;
}
.particle-1 { top: 16%; left: 25%; }
.particle-2 { top: 27%; right: 14%; animation-delay: -.9s; }
.particle-3 { bottom: 24%; left: 17%; animation-delay: -1.8s; }
.particle-4 { bottom: 19%; right: 20%; animation-delay: -2.7s; }
@keyframes particleFloat {
  0%, 100% { transform: translateY(0) scale(.82); opacity: .65; }
  50% { transform: translateY(-11px) scale(1.12); opacity: 1; }
}

.core-glow {
  position: absolute;
  width: 315px;
  height: 315px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(73, 191, 255, .23), rgba(20, 85, 135, .08) 50%, transparent 72%);
  filter: blur(11px);
  animation: corePulse 4.2s ease-in-out infinite;
}
@keyframes corePulse {
  0%, 100% { transform: scale(.96); opacity: .72; }
  50% { transform: scale(1.05); opacity: 1; }
}
.fox-core {
  display: block;
  position: relative;
  z-index: 4;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  transform-style: preserve-3d;
  animation: coreFloat 5.6s ease-in-out infinite;
  will-change: transform;
}
.fox-core::after {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 1px solid rgba(123, 225, 255, .38);
  box-shadow: 0 0 30px rgba(39,220,255,.26), inset 0 0 24px rgba(255,255,255,.1);
  pointer-events: none;
}
.fox-core img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  filter: drop-shadow(0 23px 25px rgba(0,0,0,.38));
}
@keyframes coreFloat {
  0%, 100% { transform: translate3d(0,0,35px) rotateY(-1deg); }
  50% { transform: translate3d(0,-10px,50px) rotateY(2deg); }
}

.hologram-base {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 53px;
  width: 300px;
  height: 90px;
  transform: translateX(-50%) perspective(500px) rotateX(68deg);
  border: 1px solid rgba(39, 220, 255, .42);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(39,220,255,.36), rgba(30,159,255,.11) 36%, transparent 70%);
  box-shadow: 0 0 40px rgba(39,220,255,.18), inset 0 0 32px rgba(39,220,255,.16);
  animation: basePulse 3.6s ease-in-out infinite;
}
.hologram-base span {
  position: absolute;
  inset: 9px;
  border: 1px solid rgba(39,220,255,.25);
  border-radius: 50%;
}
.hologram-base span:nth-child(2) { inset: 20px; }
.hologram-base span:nth-child(3) { inset: 31px; }
.hologram-base span:nth-child(4) { inset: 42px; background: rgba(39,220,255,.14); }
@keyframes basePulse {
  0%, 100% { opacity: .72; transform: translateX(-50%) perspective(500px) rotateX(68deg) scale(.96); }
  50% { opacity: 1; transform: translateX(-50%) perspective(500px) rotateX(68deg) scale(1.04); }
}

.orbit-card {
  position: absolute;
  z-index: 8;
  min-width: 190px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 14px 16px;
  border: 1px solid rgba(68, 185, 255, .26);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(8, 25, 47, .95), rgba(3, 13, 26, .92));
  box-shadow: 0 18px 45px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.04);
  backdrop-filter: blur(12px);
  animation: cardFloat 5.5s ease-in-out infinite;
  transition: border-color .2s ease, transform .2s ease;
}
.orbit-card:hover { border-color: rgba(39,220,255,.58); }
.orbit-card-icon {
  width: 39px;
  height: 39px;
  flex: 0 0 39px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: var(--cyan);
  border: 1px solid rgba(73, 199, 255, .2);
  background: radial-gradient(circle, rgba(39,220,255,.14), rgba(24,74,120,.16));
  box-shadow: 0 0 18px rgba(39,220,255,.08);
  font-size: .91rem;
  font-weight: 900;
}
.orbit-card-icon svg { width: 23px; height: 23px; fill: currentColor; }
.orbit-card strong { display: block; font-size: .93rem; line-height: 1.25; }
.orbit-card small { display: block; margin-top: 4px; color: var(--muted); font-size: .78rem; }
.card-automation { top: 78px; left: 10px; }
.card-web { top: 94px; right: 2px; animation-delay: -.8s; }
.card-support { left: -10px; bottom: 105px; animation-delay: -1.7s; }
.card-security { right: -4px; bottom: 137px; animation-delay: -2.6s; }
@keyframes cardFloat {
  0%, 100% { transform: translate3d(0,0,0); }
  50% { transform: translate3d(0,-8px,0); }
}

.projects-shell {
  margin-top: -2px;
  padding: 28px 34px 26px;
  border: 1px solid rgba(77, 187, 255, .12);
  border-radius: var(--radius-xl);
  background: linear-gradient(180deg, rgba(5, 16, 29, .91), rgba(3, 11, 21, .97));
  box-shadow: var(--shadow);
}
.section-header { max-width: 830px; margin-bottom: 22px; }
.split-header {
  max-width: none;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.section-kicker { padding: 0; }
.section-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 13px rgba(39,220,255,.85);
}
.section-header h2,
.about-card h2,
.contact-copy h2 {
  margin: 11px 0 0;
  font-size: clamp(2rem, 3.65vw, 3rem);
  line-height: 1.05;
  font-weight: 620;
  letter-spacing: -.038em;
}
.section-header > p,
.about-card p,
.contact-copy > p {
  margin: 13px 0 0;
  color: var(--muted);
  line-height: 1.75;
}
.text-button {
  border: 0;
  padding: 10px 0;
  color: var(--cyan);
  background: transparent;
  font-weight: 750;
  cursor: pointer;
  white-space: nowrap;
}
.text-button:hover { text-decoration: underline; }
.project-grid {
  display: grid;
  grid-template-columns: repeat(var(--project-columns, 4), minmax(0, 1fr));
  gap: 17px;
}
.project-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(77,187,255,.15);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(8,24,45,.94), rgba(4,14,27,.98));
  box-shadow: 0 16px 38px rgba(0,0,0,.2);
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}
.project-card:hover {
  transform: translateY(-6px);
  border-color: rgba(39,220,255,.38);
  box-shadow: 0 23px 46px rgba(0,0,0,.32), 0 0 28px rgba(39,220,255,.07);
}
.project-extra[hidden] { display: none !important; }
.project-image {
  position: relative;
  height: 224px;
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid rgba(77,187,255,.12);
}
.project-image > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .5s ease;
}
.project-card:hover .project-image > img { transform: scale(1.045); }
.project-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(3,12,22,.55));
}
.project-icon {
  position: absolute;
  z-index: 2;
  top: 11px;
  left: 11px;
  min-width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  padding-inline: 8px;
  border-radius: 50%;
  color: var(--cyan-soft);
  border: 1px solid rgba(80, 209, 255, .32);
  background: rgba(4, 20, 36, .78);
  backdrop-filter: blur(8px);
  font-size: .77rem;
  font-weight: 900;
}
.project-video-badge {
  position: absolute;
  z-index: 3;
  right: 14px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
  border: 1px solid rgba(114, 239, 255, .3);
  border-radius: 999px;
  color: #eaffff;
  background: rgba(3, 14, 26, .88);
  box-shadow: 0 10px 28px rgba(0,0,0,.26);
  backdrop-filter: blur(10px);
  font-family: var(--font-display);
  font-size: .7rem;
  font-weight: 650;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.project-video-badge span {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #03111b;
  background: var(--cyan);
  font-size: .62rem;
}
.project-video-badge:hover { transform: translateY(-2px); border-color: rgba(114,239,255,.65); background: rgba(6,28,48,.96); }
.project-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 21px 22px 19px;
}
.project-content h3 {
  margin: 2px 0 10px;
  font-size: 1.22rem;
  font-weight: 620;
  line-height: 1.22;
  letter-spacing: -.025em;
}
.project-category {
  display: inline-block;
  width: fit-content;
  margin-bottom: 8px;
  padding: 5px 9px;
  border-radius: 999px;
  color: var(--cyan);
  background: rgba(39,220,255,.11);
  font-size: .68rem;
  font-weight: 650;
  letter-spacing: .025em;
}
.project-content p {
  min-height: 68px;
  margin: 0;
  color: var(--muted);
  font-size: .86rem;
  line-height: 1.65;
}
.project-content footer {
  margin-top: auto;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 13px;
  padding-top: 17px;
}
.project-content footer small {
  max-width: 100%;
  overflow: hidden;
  color: #7894ab;
  font-size: .73rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.project-actions {
  width: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.project-content footer .project-link {
  width: auto;
  height: auto;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 12px;
  color: #dffaff;
  border: 1px solid rgba(77,187,255,.2);
  border-radius: 999px;
  background: rgba(39,220,255,.07);
  font-family: var(--font-display);
  font-size: .72rem;
  font-weight: 620;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.project-content footer .project-link:hover { transform: translateY(-2px); border-color: rgba(39,220,255,.5); background: rgba(39,220,255,.13); }
.project-content footer .project-link-video { color: #dffcf3; border-color: rgba(88,245,199,.22); background: rgba(88,245,199,.07); }
.project-content footer .project-link-video:hover { border-color: rgba(88,245,199,.52); background: rgba(88,245,199,.13); }

.stats-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 19px;
  overflow: hidden;
  border: 1px solid rgba(77,187,255,.1);
  border-radius: 18px;
  background: linear-gradient(90deg, rgba(8,27,50,.78), rgba(4,17,32,.86));
}
.stats-strip article {
  position: relative;
  min-height: 83px;
  display: grid;
  grid-template-columns: auto auto;
  align-content: center;
  justify-content: center;
  column-gap: 11px;
  padding: 15px;
  border-right: 1px solid rgba(77,187,255,.1);
}
.stats-strip article:last-child { border-right: 0; }
.stat-icon {
  grid-row: 1 / span 2;
  align-self: center;
  color: var(--cyan);
  font-size: 1.45rem;
  text-shadow: 0 0 20px rgba(39,220,255,.5);
}
.stats-strip strong { font-size: 1.65rem; line-height: 1; }
.stats-strip small { margin-top: 5px; color: var(--muted); }

.partners-section {
  padding: 74px 0 4px;
}
.partners-header {
  max-width: 790px;
  margin-inline: auto;
  text-align: center;
}
.partners-header .section-kicker { justify-content: center; }
.partners-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
  gap: 14px;
}
.partner-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(77,187,255,.13);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(7,22,41,.88), rgba(3,13,25,.96));
  box-shadow: 0 18px 42px rgba(0,0,0,.2);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.partner-card:hover {
  transform: translateY(-4px);
  border-color: rgba(39,220,255,.34);
  box-shadow: 0 24px 48px rgba(0,0,0,.28), 0 0 26px rgba(39,220,255,.06);
}
.partner-link {
  min-height: 176px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 14px;
  padding: 18px;
  text-align: center;
}
.partner-logo {
  width: 100%;
  height: 88px;
  display: grid;
  place-items: center;
  padding: 14px;
  overflow: hidden;
  border: 1px solid rgba(210,232,246,.76);
  border-radius: 15px;
  background: linear-gradient(145deg, #ffffff, #eaf3f8);
  box-shadow: inset 0 1px rgba(255,255,255,.8);
}
.partner-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: saturate(.88);
  transition: filter .22s ease, transform .22s ease;
}
.partner-card:hover .partner-logo img { filter: saturate(1.08); transform: scale(1.025); }
.partner-copy { min-width: 0; display: grid; gap: 4px; }
.partner-copy strong {
  overflow: hidden;
  font-family: var(--font-display);
  font-size: .93rem;
  font-weight: 620;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.partner-copy small { color: var(--muted); font-size: .72rem; }

.content-section { padding: 74px 0 10px; }
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.services-grid article {
  position: relative;
  overflow: hidden;
  padding: 23px;
  border: 1px solid rgba(77,187,255,.12);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(7,22,41,.86), rgba(3,13,25,.94));
  box-shadow: 0 18px 42px rgba(0,0,0,.2);
  transition: transform .22s ease, border-color .22s ease;
}
.services-grid article:hover { transform: translateY(-4px); border-color: rgba(39,220,255,.34); }
.services-grid article > span {
  position: absolute;
  top: 17px;
  right: 18px;
  color: rgba(39,220,255,.22);
  font-size: 1.8rem;
  font-weight: 900;
}
.services-grid h3 { margin: 0 0 9px; font-size: 1.05rem; }
.services-grid p { margin: 0; color: var(--muted); line-height: 1.68; }

.insights-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.insights-grid article {
  position: relative;
  min-height: 190px;
  overflow: hidden;
  padding: 25px;
  border: 1px solid rgba(77,187,255,.12);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 100% 0, rgba(39,220,255,.1), transparent 42%),
    linear-gradient(180deg, rgba(7,22,41,.86), rgba(3,13,25,.94));
  box-shadow: 0 18px 42px rgba(0,0,0,.2);
  transition: transform .22s ease, border-color .22s ease;
}
.insights-grid article:hover { transform: translateY(-4px); border-color: rgba(39,220,255,.34); }
.insights-grid article > span { color: rgba(39,220,255,.28); font-size: 2rem; font-weight: 900; }
.insights-grid h3 { margin: 28px 0 9px; font-size: 1.08rem; }
.insights-grid p { margin: 0; color: var(--muted); line-height: 1.68; }

.about-card {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 30px;
  padding: 31px;
  border: 1px solid rgba(77,187,255,.12);
  border-radius: var(--radius-xl);
  background: linear-gradient(135deg, rgba(7,24,44,.9), rgba(3,13,25,.96));
  box-shadow: var(--shadow);
}
.about-points { display: grid; gap: 11px; }
.about-points span {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid rgba(77,187,255,.1);
  border-radius: 14px;
  color: var(--muted);
  background: rgba(255,255,255,.018);
}
.about-points b { color: var(--cyan); }

.contact-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(350px, .9fr);
  gap: 28px;
  margin-top: 74px;
  padding: 31px;
  border: 1px solid rgba(77,187,255,.12);
  border-radius: var(--radius-xl);
  background: linear-gradient(135deg, rgba(7,24,44,.92), rgba(3,13,25,.98));
  box-shadow: var(--shadow);
}
.contact-links {
  display: grid;
  gap: 10px;
  margin-top: 21px;
}
.contact-links a {
  padding: 13px 15px;
  border: 1px solid rgba(77,187,255,.11);
  border-radius: 14px;
  background: rgba(255,255,255,.018);
  transition: border-color .2s ease, transform .2s ease;
}
.contact-links a:hover { transform: translateX(3px); border-color: rgba(39,220,255,.32); }
.contact-links span { display: block; margin-bottom: 3px; color: var(--muted); font-size: .78rem; }
.contact-links strong { font-size: .92rem; }
.contact-form { display: grid; gap: 12px; }
.contact-form label > span { display: block; margin: 0 0 7px 3px; font-size: .85rem; font-weight: 700; }
.contact-form input,
.contact-form select,
.contact-form textarea {
  width: 100%;
  padding: 13px 14px;
  color: var(--text);
  border: 1px solid rgba(77,187,255,.14);
  border-radius: 14px;
  outline: 0;
  background: rgba(1,8,15,.42);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  border-color: rgba(39,220,255,.48);
  box-shadow: 0 0 0 4px rgba(39,220,255,.07);
}
.contact-form textarea { resize: vertical; }

.site-footer { padding: 28px 0 32px; }
.footer-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 17px;
  padding-top: 19px;
  border-top: 1px solid rgba(77,187,255,.1);
}
.brand-small img { width: 38px; height: 38px; }
.brand-small strong { font-size: .95rem; }
.footer-content p,
.footer-content > span { color: var(--muted); font-size: .82rem; }
.footer-message { max-width: 580px; text-align: center; }
.footer-message p { margin: 0; }
.footer-message small { display: block; margin-top: 5px; color: #6f8ba2; font-size: .7rem; }

.projects-shell,
.partners-section,
.content-section,
.contact-section {
  content-visibility: auto;
  contain-intrinsic-size: auto 720px;
}

.floating-whatsapp {
  position: fixed;
  z-index: 120;
  right: 20px;
  bottom: 20px;
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  color: #03121d;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--cyan), var(--green));
  box-shadow: 0 18px 40px rgba(39,220,255,.24);
  transition: transform .2s ease;
}
.floating-whatsapp:hover { transform: translateY(-3px) scale(1.03); }
.floating-whatsapp svg { width: 27px; fill: currentColor; }

.reveal {
  opacity: 1;
  transform: none;
}
.reveal.visible { opacity: 1; transform: none; }
.delay-1 { transition-delay: 0s; }

@media (max-width: 1240px) {
  .main-menu > a { padding-inline: 9px; font-size: .84rem; }
  .main-menu .nav-cta { padding-inline: 14px; }
  .hero { grid-template-columns: minmax(0, .88fr) minmax(520px, 1.12fr); }
  .tech-orbit { transform: scale(.92); }
  .project-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); }
}

@media (max-width: 1040px) {
  .menu-toggle { display: block; }
  .nav { position: relative; }
  .main-menu {
    position: absolute;
    top: calc(100% + 9px);
    left: 0;
    right: 0;
    display: none;
    align-items: stretch;
    flex-direction: column;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: rgba(3,10,18,.98);
    box-shadow: var(--shadow);
  }
  .main-menu.open { display: flex; }
  .main-menu > a { padding: 13px 15px; }
  .main-menu .access-link,
  .main-menu .nav-cta { margin-left: 0; }
  .language-switch { align-self: flex-start; margin: 3px 0; }
  .main-menu > a:not(.nav-cta):not(.access-link)::after { display: none; }
  .hero {
    grid-template-columns: 1fr;
    gap: 4px;
    min-height: auto;
    padding-top: 52px;
  }
  .hero-copy { text-align: center; padding-left: 0; }
  .hero-copy > p { margin-inline: auto; }
  .hero-actions,
  .trust-row { justify-content: center; }
  .hero-visual { margin-top: -10px; }
  .tech-orbit { transform: none; }
  .contact-section,
  .about-card { grid-template-columns: 1fr; }
}

@media (max-width: 780px) {
  .container { width: min(var(--max-width), calc(100% - 28px)); }
  .site-header { padding-top: 10px; }
  .nav { min-height: 62px; border-radius: 20px; }
  .brand img { width: 44px; height: 44px; }
  .brand strong { font-size: 1rem; }
  .hero h1 { font-size: clamp(2.55rem, 11vw, 4rem); }
  .hero-copy > p { font-size: .97rem; }
  .tech-orbit { min-height: 550px; width: 100%; }
  .orbit-plane-1 { width: 520px; height: 520px; margin: -260px 0 0 -260px; }
  .orbit-plane-2 { width: 460px; height: 460px; margin: -230px 0 0 -230px; }
  .orbit-plane-3 { width: 400px; height: 400px; margin: -200px 0 0 -200px; }
  .orbit-plane-4 { width: 338px; height: 338px; margin: -169px 0 0 -169px; }
  .orbit-plane-5 { width: 280px; height: 280px; margin: -140px 0 0 -140px; }
  .fox-core { width: 265px; height: 265px; }
  .core-glow { width: 280px; height: 280px; }
  .hologram-base { width: 260px; bottom: 43px; }
  .orbit-card { min-width: 170px; padding: 12px 13px; }
  .card-automation { top: 56px; left: 0; }
  .card-web { top: 73px; right: 0; }
  .card-support { left: 0; bottom: 77px; }
  .card-security { right: 0; bottom: 105px; }
  .projects-shell { padding: 23px 18px 20px; }
  .split-header { display: block; }
  .text-button { margin-top: 9px; }
  .stats-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stats-strip article:nth-child(2) { border-right: 0; }
  .stats-strip article:nth-child(-n+2) { border-bottom: 1px solid rgba(77,187,255,.1); }
  .services-grid,
  .insights-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-section { margin-top: 64px; padding: 24px; }
}

@media (max-width: 560px) {
  .hero-visual, .tech-orbit { overflow: hidden; }
  .container { width: min(var(--max-width), calc(100% - 20px)); }
  .eyebrow { font-size: .66rem; letter-spacing: .08em; }
  .hero { padding-top: 37px; }
  .hero-actions { flex-direction: column; }
  .hero-actions .btn { width: 100%; }
  .trust-row { display: grid; justify-content: start; max-width: 290px; margin-inline: auto; text-align: left; }
  .tech-orbit {
    min-height: 620px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 75px;
  }
  .orbit-plane-1 { width: 390px; height: 390px; margin: -195px 0 0 -195px; }
  .orbit-plane-2 { width: 345px; height: 345px; margin: -172.5px 0 0 -172.5px; }
  .orbit-plane-3 { width: 300px; height: 300px; margin: -150px 0 0 -150px; }
  .orbit-plane-4 { width: 256px; height: 256px; margin: -128px 0 0 -128px; }
  .orbit-plane-5 { width: 216px; height: 216px; margin: -108px 0 0 -108px; }
  .fox-core { width: 225px; height: 225px; }
  .core-glow { width: 235px; height: 235px; }
  .hologram-base { width: 220px; height: 68px; bottom: 105px; }
  .orbit-card {
    position: relative;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: calc(50% - 7px);
    min-width: 0;
    animation-duration: 4.6s;
  }
  .card-automation,
  .card-web,
  .card-support,
  .card-security { position: absolute; }
  .card-automation { top: 8px !important; left: 0 !important; }
  .card-web { top: 8px !important; right: 0 !important; }
  .card-support { bottom: 10px !important; left: 0 !important; }
  .card-security { bottom: 10px !important; right: 0 !important; }
  .orbit-card-icon { width: 34px; height: 34px; flex-basis: 34px; }
  .orbit-card strong { font-size: .78rem; }
  .orbit-card small { font-size: .68rem; }
  .project-grid,
  .services-grid,
  .insights-grid { grid-template-columns: 1fr; }
  .project-image { height: 190px; }
  .project-content p { min-height: 0; }
  .stats-strip { grid-template-columns: 1fr; }
  .stats-strip article { border-right: 0; border-bottom: 1px solid rgba(77,187,255,.1); }
  .stats-strip article:last-child { border-bottom: 0; }
  .section-header h2,
  .about-card h2,
  .contact-copy h2 { font-size: 2rem; }
  .about-card,
  .contact-section { padding: 20px; }
  .footer-content { flex-direction: column; text-align: center; }
}

@media (min-width: 1041px) {
  html[lang="en"] .main-menu > a { padding-inline: 9px; font-size: .82rem; }
  html[lang="en"] .main-menu .nav-cta { padding-inline: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}

/* ===== v6.0 orbit and hologram upgrade ===== */
.tech-orbit {
  width: min(100%, 760px);
  min-height: 640px;
}
.tech-orbit::before {
  width: 82%;
  background:
    radial-gradient(circle, rgba(42, 208, 255, .18), rgba(14, 48, 82, .08) 46%, transparent 74%),
    radial-gradient(circle at 50% 50%, rgba(39,220,255,.08), transparent 68%);
  filter: blur(4px);
}
.tech-orbit::after {
  content: "";
  position: absolute;
  inset: 10% 12%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(39,220,255,.08), transparent 60%);
  filter: blur(14px);
  z-index: -4;
  animation: orbitAuraPulse 5s ease-in-out infinite;
}
@keyframes orbitAuraPulse {
  0%,100% { opacity: .45; transform: scale(.96); }
  50% { opacity: .9; transform: scale(1.03); }
}

.orbit-plane {
  border-color: rgba(56, 198, 255, .14);
  box-shadow: inset 0 0 24px rgba(39,220,255,.03), 0 0 22px rgba(39,220,255,.05);
}
.orbit-plane::before,
.orbit-plane::after {
  content: "";
  position: absolute;
  border-radius: inherit;
}
.orbit-plane::before {
  inset: -2px;
  border: none;
  background:
    conic-gradient(from 0deg,
      transparent 0 19%,
      rgba(39,220,255,.18) 24%,
      rgba(150,247,255,.92) 27%,
      rgba(39,220,255,.22) 31%,
      transparent 36% 58%,
      rgba(39,220,255,.18) 63%,
      rgba(150,247,255,.86) 66%,
      rgba(39,220,255,.2) 70%,
      transparent 76% 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px));
  opacity: .95;
  filter: drop-shadow(0 0 10px rgba(39,220,255,.28));
  animation: orbitFlash 4.8s ease-in-out infinite;
}
.orbit-plane::after {
  inset: 10%;
  border: 1px dashed rgba(86, 218, 255, .13);
  opacity: .7;
  animation: orbitInnerPulse 4.2s ease-in-out infinite;
}
.orbit-plane-1 { animation: orbitSpin 34s linear infinite; }
.orbit-plane-2 { animation: orbitSpinReverse 26s linear infinite; }
.orbit-plane-3 { animation: orbitSpin 20s linear infinite; }
.orbit-plane-4 { animation: orbitSpinReverse 15s linear infinite; }
.orbit-plane-5 { animation: orbitSpin 10s linear infinite; }
.orbit-plane-1::before { animation-delay: -.2s; }
.orbit-plane-2::before { animation-delay: -1.1s; }
.orbit-plane-3::before { animation-delay: -2.1s; }
.orbit-plane-4::before { animation-delay: -2.9s; }
.orbit-plane-5::before { animation-delay: -3.5s; }
.orbit-plane-2::after { animation-delay: -.8s; }
.orbit-plane-4::after { animation-delay: -1.5s; }
@keyframes orbitFlash {
  0%,100% { opacity: .75; filter: drop-shadow(0 0 8px rgba(39,220,255,.2)); }
  50% { opacity: 1; filter: drop-shadow(0 0 14px rgba(39,220,255,.38)); }
}
@keyframes orbitInnerPulse {
  0%,100% { opacity: .34; }
  50% { opacity: .72; }
}

.orbit-dot {
  width: 16px;
  height: 16px;
  background: radial-gradient(circle at 34% 34%, #ffffff 0 16%, #8af7ff 26%, #2bddff 58%, rgba(16, 149, 194, .72) 74%, transparent 75%);
  box-shadow: 0 0 18px rgba(39,220,255,.92), 0 0 34px rgba(39,220,255,.45);
  animation: dotPulse 1.8s ease-in-out infinite;
}
.orbit-dot::before,
.orbit-dot::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.orbit-dot::before {
  inset: -7px;
  background: radial-gradient(circle, rgba(39,220,255,.28), transparent 72%);
  animation: dotHalo 1.8s ease-in-out infinite;
}
.orbit-dot::after {
  width: 6px;
  height: 6px;
  right: -9px;
  top: 5px;
  background: rgba(122, 241, 255, .85);
  box-shadow: 0 0 10px rgba(39,220,255,.8);
  opacity: .7;
}
@keyframes dotPulse {
  0%,100% { transform: scale(.92); }
  50% { transform: scale(1.18); }
}
@keyframes dotHalo {
  0%,100% { transform: scale(.82); opacity: .5; }
  50% { transform: scale(1.12); opacity: .95; }
}

.ambient-particle {
  width: 8px;
  height: 8px;
  box-shadow: 0 0 26px rgba(39,220,255,.9), 0 0 40px rgba(39,220,255,.24);
}

.core-glow {
  width: 340px;
  height: 340px;
  background: radial-gradient(circle, rgba(73, 191, 255, .28), rgba(20, 85, 135, .09) 50%, transparent 72%);
  filter: blur(14px);
}
.energy-column {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 118px;
  width: 150px;
  height: 250px;
  transform: translateX(-50%);
  pointer-events: none;
  filter: blur(6px);
  opacity: .92;
}
.energy-column::before {
  content: "";
  position: absolute;
  inset: 0;
  clip-path: polygon(42% 0, 58% 0, 73% 100%, 27% 100%);
  background: linear-gradient(180deg, rgba(120,245,255,.02), rgba(82,232,255,.18) 18%, rgba(44,221,255,.42) 48%, rgba(44,221,255,.12) 100%);
  animation: beamPulse 3s ease-in-out infinite;
}
.energy-column span {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(152,249,255,.66), rgba(41,221,255,.05));
}
.energy-column span:first-child {
  top: 12px;
  width: 32px;
  height: 210px;
  filter: blur(8px);
  opacity: .8;
  animation: beamPulse 2.7s ease-in-out infinite reverse;
}
.energy-column span:last-child {
  top: 24px;
  width: 68px;
  height: 188px;
  filter: blur(18px);
  opacity: .45;
  animation: beamPulse 3.4s ease-in-out infinite;
}
@keyframes beamPulse {
  0%,100% { opacity: .54; transform: scaleY(.94); }
  50% { opacity: .96; transform: scaleY(1.06); }
}

.fox-core {
  width: 312px;
  height: 312px;
  filter: drop-shadow(0 18px 24px rgba(0,0,0,.22));
}
.fox-core::before {
  content: "";
  position: absolute;
  inset: 8%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 34% 22%, rgba(255,255,255,.28), transparent 24%),
    radial-gradient(circle at 40% 34%, rgba(113,233,255,.14), transparent 38%);
  mix-blend-mode: screen;
  pointer-events: none;
}
.fox-core::after {
  inset: -10px;
  border: 1px solid rgba(144, 232, 255, .4);
  box-shadow: 0 0 34px rgba(39,220,255,.28), inset 0 0 24px rgba(255,255,255,.14);
}
.fox-core img {
  box-shadow: 0 0 0 1px rgba(125, 226, 255, .22), 0 22px 50px rgba(0,0,0,.34);
}

.hologram-base {
  bottom: 34px;
  width: 360px;
  height: 118px;
  border: 1px solid rgba(39, 220, 255, .36);
  background:
    radial-gradient(circle at center, rgba(123,244,255,.3), rgba(39,220,255,.12) 26%, rgba(24,117,173,.08) 45%, transparent 68%),
    radial-gradient(circle at center, rgba(39,220,255,.08), transparent 70%);
  box-shadow: 0 0 54px rgba(39,220,255,.22), inset 0 0 30px rgba(39,220,255,.18);
  animation: basePulseV6 2.9s ease-in-out infinite;
  overflow: visible;
}
.hologram-base::before,
.hologram-base::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 50%;
  pointer-events: none;
}
.hologram-base::before {
  width: 132%;
  height: 160%;
  bottom: -12%;
  background: radial-gradient(ellipse at center, rgba(39,220,255,.22), rgba(39,220,255,.08) 35%, transparent 66%);
  filter: blur(18px);
  animation: baseHalo 3.2s ease-in-out infinite;
}
.hologram-base::after {
  width: 88%;
  height: 36%;
  top: 18px;
  border-top: 2px solid rgba(188, 248, 255, .95);
  border-bottom: 2px solid rgba(39,220,255,.14);
  opacity: .85;
  animation: baseSweep 5.4s linear infinite;
}
.hologram-base span {
  position: absolute;
  left: 50%;
  transform: translateX(-50%) scale(.92);
  border: 1px solid rgba(39,220,255,.24);
  border-radius: 50%;
  background: transparent;
  box-shadow: inset 0 0 16px rgba(39,220,255,.08), 0 0 18px rgba(39,220,255,.08);
  animation: rippleRise 3.2s ease-out infinite;
}
.hologram-base span:nth-child(1) { inset: 10px 34px; animation-delay: 0s; }
.hologram-base span:nth-child(2) { inset: 20px 52px; animation-delay: .25s; }
.hologram-base span:nth-child(3) { inset: 30px 70px; animation-delay: .5s; }
.hologram-base span:nth-child(4) { inset: 40px 96px; background: rgba(39,220,255,.14); animation-delay: .75s; }
.hologram-base span:nth-child(5) { inset: 24px 84px; animation-delay: 1.05s; opacity: .7; }
.hologram-base span:nth-child(6) { inset: 14px 120px; animation-delay: 1.3s; opacity: .55; }
@keyframes basePulseV6 {
  0%,100% { opacity: .82; transform: translateX(-50%) perspective(500px) rotateX(68deg) scale(.96); }
  50% { opacity: 1; transform: translateX(-50%) perspective(500px) rotateX(68deg) scale(1.06); }
}
@keyframes rippleRise {
  0% { opacity: .18; transform: translateX(-50%) scale(.78); }
  38% { opacity: .85; }
  100% { opacity: .08; transform: translateX(-50%) scale(1.12); }
}
@keyframes baseHalo {
  0%,100% { opacity: .52; transform: translateX(-50%) scale(.94); }
  50% { opacity: 1; transform: translateX(-50%) scale(1.08); }
}
@keyframes baseSweep {
  from { transform: translateX(-50%) rotate(0deg); }
  to { transform: translateX(-50%) rotate(360deg); }
}

.orbit-card {
  border-color: rgba(68, 185, 255, .3);
  box-shadow: 0 20px 48px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.05), 0 0 24px rgba(39,220,255,.04);
  animation-duration: 4.8s;
}
.orbit-card:hover {
  border-color: rgba(39,220,255,.64);
  box-shadow: 0 20px 48px rgba(0,0,0,.34), 0 0 26px rgba(39,220,255,.14);
}
.card-automation { top: 70px; left: -2px; }
.card-web { top: 86px; right: -8px; }
.card-support { left: -16px; bottom: 112px; }
.card-security { right: -12px; bottom: 144px; }

@media (max-width: 980px) {
  .tech-orbit { min-height: 596px; }
  .energy-column { bottom: 108px; height: 220px; }
  .hologram-base { width: 320px; height: 104px; bottom: 34px; }
  .fox-core { width: 286px; height: 286px; }
}
@media (max-width: 640px) {
  .tech-orbit { min-height: 540px; }
  .energy-column { width: 122px; height: 182px; bottom: 96px; }
  .hologram-base { width: 268px; height: 86px; bottom: 34px; }
  .hologram-base span:nth-child(1) { inset: 8px 24px; }
  .hologram-base span:nth-child(2) { inset: 16px 38px; }
  .hologram-base span:nth-child(3) { inset: 24px 52px; }
  .hologram-base span:nth-child(4) { inset: 31px 72px; }
  .hologram-base span:nth-child(5) { inset: 19px 64px; }
  .hologram-base span:nth-child(6) { inset: 12px 90px; }
}

/* ===== v6.1 stability and performance corrections ===== */
.fox-core {
  --tilt-x: 0deg;
  --tilt-y: 0deg;
}
@keyframes coreFloat {
  0%, 100% {
    transform: translate3d(0,0,35px)
      rotateX(var(--tilt-x))
      rotateY(calc(var(--tilt-y) - 1deg));
  }
  50% {
    transform: translate3d(0,-10px,50px)
      rotateX(var(--tilt-x))
      rotateY(calc(var(--tilt-y) + 2deg));
  }
}

.energy-column::before {
  animation-name: beamCorePulse;
}
.energy-column span:first-child,
.energy-column span:last-child {
  animation-name: beamSpanPulse;
}
@keyframes beamCorePulse {
  0%,100% { opacity: .54; transform: scaleY(.94); }
  50% { opacity: .96; transform: scaleY(1.06); }
}
@keyframes beamSpanPulse {
  0%,100% { opacity: .54; transform: translateX(-50%) scaleY(.94); }
  50% { opacity: .96; transform: translateX(-50%) scaleY(1.06); }
}

.orbit-plane::before {
  filter: drop-shadow(0 0 10px rgba(39,220,255,.28));
  animation-name: orbitFlashStable;
}
@keyframes orbitFlashStable {
  0%,100% { opacity: .76; }
  50% { opacity: 1; }
}

.orbit-plane,
.orbit-dot,
.fox-core,
.hologram-base,
.energy-column {
  will-change: transform, opacity;
}

@media (min-width: 561px) and (max-width: 780px) {
  .tech-orbit { min-height: 590px; }
  .card-automation { top: 58px; left: 4px; }
  .card-web { top: 74px; right: 4px; }
  .card-support { left: 4px; bottom: 84px; }
  .card-security { right: 4px; bottom: 112px; }
  .hologram-base { bottom: 38px; }
  .energy-column { bottom: 110px; }
}
