/* Services Page Phase 1.1 — UI polish */

/* Consistent CTA icon alignment */
.services-page .btn,
.services-hero-actions .btn,
.services-difference .btn,
.services-cta-card .btn,
button[data-project-trigger].btn {
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  white-space:nowrap;
  line-height:1!important;
}
.services-page .btn svg,
.services-hero-actions .btn svg,
.services-difference .btn svg,
.services-cta-card .btn svg,
button[data-project-trigger].btn svg {
  display:block!important;
  flex:0 0 auto!important;
  width:16px!important;
  height:16px!important;
  margin:0!important;
  position:static!important;
}

/* Hero overflow and floating cards */
.services-hero {
  overflow:hidden;
}
.services-hero-grid {
  z-index:2;
}
.services-engine {
  overflow:visible!important;
  z-index:15!important;
}
.services-engine-flow,
.services-engine-top,
.services-engine-line {
  position:relative;
  z-index:3;
}
.services-engine-float {
  z-index:30!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:none;
  animation:servicesFloat 4.5s ease-in-out infinite;
}
.services-engine-float.float-a {
  right:-24px!important;
  top:22%!important;
}
.services-engine-float.float-b {
  left:-28px!important;
  bottom:14%!important;
  animation-delay:-2.1s;
}
@keyframes servicesFloat {
  0%,100% { transform:translate3d(0,0,0); }
  50% { transform:translate3d(0,-8px,0); }
}

/* Make service content permanently visible and readable */
.service-overview-card,
.service-card-body,
.service-card-body > * {
  opacity:1!important;
  visibility:visible!important;
}
.service-card-body {
  position:relative;
  z-index:4;
  min-width:0;
}
.service-card-body h3,
.service-card-body p,
.service-card-body strong,
.service-card-body span,
.service-card-body small {
  color:inherit;
}
.service-card-body > p,
.service-meta small,
.service-tags span {
  color:var(--muted)!important;
}
.service-card-body > strong {
  color:var(--primary)!important;
}

/* Technology ecosystem */
.tech-orbit-stage {
  position:relative;
  isolation:isolate;
  height:680px;
  max-width:980px;
  margin:0 auto;
  overflow:visible;
}
.tech-orbit-backdrop {
  position:absolute;
  inset:7% 3%;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(124,58,237,.13), transparent 31%),
    radial-gradient(circle at 22% 26%, rgba(56,189,248,.10), transparent 24%),
    radial-gradient(circle at 78% 72%, rgba(16,185,129,.09), transparent 24%);
  filter:blur(2px);
  z-index:-2;
}
.tech-orbit-svg {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  z-index:-1;
}
.orbit-path {
  fill:none;
  stroke:url(#orbitGradient);
  stroke-width:1.5;
  stroke-dasharray:7 9;
  vector-effect:non-scaling-stroke;
  opacity:.48;
  transform-origin:450px 310px;
}
.orbit-path-one { animation:orbitRotate 34s linear infinite; }
.orbit-path-two { animation:orbitRotateReverse 44s linear infinite; opacity:.36; }
.orbit-path-three { animation:orbitRotate 58s linear infinite; opacity:.24; }
.orbit-connector {
  fill:none;
  stroke:var(--line-strong);
  stroke-width:1;
  stroke-dasharray:3 9;
  opacity:.42;
}
.tech-orbit-core {
  z-index:5;
  width:190px;
  height:190px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  overflow:visible;
  border:1px solid rgba(255,255,255,.2);
}
.tech-orbit-core > i {
  width:30px;
  height:30px;
  margin-bottom:6px;
}
.tech-orbit-core strong {
  font-size:15px;
  letter-spacing:.14em;
}
.tech-core-pulse {
  position:absolute;
  inset:-18px;
  border:1px solid rgba(124,58,237,.35);
  border-radius:50%;
  animation:corePulse 2.8s ease-out infinite;
}
.tech-node {
  position:absolute;
  z-index:6;
  display:flex;
  align-items:center;
  gap:11px;
  min-width:138px;
  padding:11px 14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:color-mix(in srgb,var(--surface) 90%,transparent);
  backdrop-filter:blur(16px);
  box-shadow:0 16px 38px rgba(25,20,50,.1);
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.tech-node:hover {
  z-index:8;
  transform:translateY(-5px) scale(1.025);
  border-color:rgba(124,58,237,.42);
  box-shadow:0 23px 48px rgba(124,58,237,.15);
}
.tech-node-icon {
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:12px;
  color:var(--primary);
  background:rgba(124,58,237,.1);
}
.tech-node-icon svg { width:19px;height:19px; }
.tech-node b,.tech-node small { display:block; }
.tech-node b { font-size:10px;line-height:1.2; }
.tech-node small { margin-top:3px;color:var(--muted);font-size:7px; }
.tech-node.t1 { left:41%;top:1%; }
.tech-node.t2 { right:8%;top:14%; }
.tech-node.t3 { right:-2%;top:42%; }
.tech-node.t4 { right:10%;bottom:11%; }
.tech-node.t5 { left:41%;bottom:0; }
.tech-node.t6 { left:8%;bottom:11%; }
.tech-node.t7 { left:-2%;top:42%; }
.tech-node.t8 { left:9%;top:14%; }
.tech-node.t9 { left:28%;top:25%; }
.tech-node.t10 { right:25%;bottom:24%; }

@keyframes orbitRotate { to { transform:rotate(360deg); } }
@keyframes orbitRotateReverse { to { transform:rotate(-360deg); } }
@keyframes corePulse {
  0% { transform:scale(.82);opacity:.65; }
  75%,100% { transform:scale(1.25);opacity:0; }
}

/* Professional process */
.professional-process {
  position:relative;
  max-width:1180px;
  margin:0 auto;
  padding:22px 0 10px;
}
.process-progress-track {
  position:absolute;
  left:44px;
  right:44px;
  top:88px;
  height:3px;
  border-radius:99px;
  background:var(--line);
  overflow:hidden;
}
.process-progress-track span {
  display:block;
  width:14.285%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--primary),#38bdf8,#10b981);
  transition:width .5s cubic-bezier(.2,.8,.2,1);
}
.professional-process-list {
  position:relative;
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:12px;
  padding:0;
  margin:0;
  list-style:none;
}
.process-card {
  position:relative;
  min-width:0;
  padding:20px 14px 24px;
  border:1px solid transparent;
  border-radius:20px;
  text-align:center;
  outline:none;
  cursor:pointer;
  transition:background .3s,border-color .3s,transform .3s,box-shadow .3s;
}
.process-card:hover,
.process-card:focus-visible,
.process-card.is-active {
  z-index:3;
  border-color:var(--line);
  background:var(--surface);
  transform:translateY(-7px);
  box-shadow:0 22px 55px rgba(25,20,50,.1);
}
.process-card-number {
  display:inline-block;
  margin-bottom:15px;
  color:var(--muted);
  font-size:8px;
  font-weight:850;
  letter-spacing:.08em;
}
.process-card-icon {
  position:relative;
  z-index:2;
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin:0 auto 18px;
  border:1px solid var(--line-strong);
  border-radius:18px;
  color:var(--muted);
  background:var(--surface);
  box-shadow:0 0 0 8px var(--surface-soft);
  transition:.3s;
}
.process-card-icon svg { width:23px;height:23px; }
.process-card.is-active .process-card-icon,
.process-card:hover .process-card-icon,
.process-card:focus-visible .process-card-icon {
  color:#fff;
  border-color:var(--primary);
  background:linear-gradient(145deg,var(--primary),#5b21b6);
  box-shadow:0 0 0 8px rgba(124,58,237,.11),0 15px 30px rgba(124,58,237,.25);
}
.process-card-copy small {
  display:block;
  margin-bottom:6px;
  color:var(--primary);
  font-size:7px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.process-card-copy h3 {
  margin:0;
  font:750 15px/1.2 var(--font-heading);
}
.process-card-copy p {
  margin:9px 0 0;
  color:var(--muted);
  font-size:7.5px;
  line-height:1.6;
}
.process-card-arrow {
  position:absolute;
  top:72px;
  right:-12px;
  z-index:4;
  width:15px;
  height:15px;
  padding:3px;
  border-radius:50%;
  color:var(--muted);
  background:var(--surface-soft);
}
.process-card-arrow-last {
  color:#10b981;
}

/* Dark mode */
[data-theme="dark"] .tech-node {
  background:rgba(19,13,39,.84);
}
[data-theme="dark"] .process-card:hover,
[data-theme="dark"] .process-card:focus-visible,
[data-theme="dark"] .process-card.is-active {
  background:rgba(255,255,255,.035);
}

/* Tablet */
@media (max-width:1100px) {
  .services-engine-float.float-a { right:8px!important; }
  .services-engine-float.float-b { left:8px!important; }

  .tech-orbit-stage {
    height:620px;
    transform:scale(.94);
    transform-origin:center;
  }
  .professional-process-list {
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
  }
  .process-progress-track { display:none; }
  .process-card-arrow { display:none; }
  .process-card-copy p { font-size:8.5px; }
}

/* Mobile */
@media (max-width:760px) {
  .services-hero-actions {
    display:grid!important;
    grid-template-columns:1fr;
    width:100%;
  }
  .services-hero-actions .btn {
    width:100%;
    min-height:52px;
  }

  .services-engine {
    margin-inline:0;
    overflow:visible!important;
  }
  .services-engine-float {
    display:flex!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    width:max-content;
    max-width:calc(100% - 12px);
    margin:10px auto 0;
    animation:none;
  }

  .service-overview-card {
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
  }
  .service-card-visual {
    display:block!important;
    flex:0 0 255px;
    min-height:255px!important;
    height:255px!important;
    opacity:1!important;
  }
  .service-card-body {
    display:flex!important;
    flex:1 1 auto;
    min-height:340px;
    padding:28px 22px 24px!important;
    background:var(--surface);
  }
  .service-card-body h3 {
    display:block!important;
    font-size:27px!important;
  }
  .service-card-body > p {
    display:block!important;
    font-size:12px!important;
    line-height:1.75!important;
  }
  .service-tags,.service-meta,.service-card-body>strong {
    display:flex!important;
  }
  .service-meta {
    margin-top:25px!important;
  }

  .tech-orbit-stage {
    height:auto;
    min-height:0;
    transform:none;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    padding-top:210px;
  }
  .tech-orbit-backdrop {
    inset:0 0 auto;
    height:205px;
  }
  .tech-orbit-svg {
    top:0;
    height:205px;
  }
  .orbit-path-one { transform:scale(.48);transform-origin:center; }
  .orbit-path-two { transform:scale(.48);transform-origin:center; }
  .orbit-path-three { transform:scale(.48);transform-origin:center; }
  .orbit-connector { display:none; }
  .tech-orbit-core {
    top:94px;
    width:120px;
    height:120px;
  }
  .tech-orbit-core > i { width:23px;height:23px; }
  .tech-node,
  .tech-node.t1,.tech-node.t2,.tech-node.t3,.tech-node.t4,.tech-node.t5,
  .tech-node.t6,.tech-node.t7,.tech-node.t8,.tech-node.t9,.tech-node.t10 {
    position:relative;
    inset:auto;
    min-width:0;
    width:100%;
    padding:11px;
    border-radius:14px;
  }
  .tech-node:hover { transform:translateY(-2px); }
  .tech-node-icon { width:35px;height:35px; }
  .tech-node b { font-size:9px; }

  .professional-process {
    padding:0;
  }
  .professional-process:before {
    content:"";
    position:absolute;
    left:29px;
    top:25px;
    bottom:25px;
    width:2px;
    border-radius:99px;
    background:linear-gradient(var(--primary),#38bdf8,#10b981);
    opacity:.55;
  }
  .professional-process-list {
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
  }
  .process-card {
    display:grid;
    grid-template-columns:58px 1fr;
    column-gap:18px;
    min-height:130px;
    padding:18px;
    text-align:left;
    border-color:var(--line);
    background:var(--surface);
    box-shadow:0 12px 30px rgba(25,20,50,.06);
  }
  .process-card:hover,
  .process-card:focus-visible,
  .process-card.is-active {
    transform:translateX(4px);
  }
  .process-card-number {
    position:absolute;
    right:16px;
    top:14px;
  }
  .process-card-icon {
    grid-row:1;
    width:48px;
    height:48px;
    margin:20px 0 0 -1px;
    border-radius:15px;
    box-shadow:0 0 0 7px var(--surface-soft);
  }
  .process-card-copy {
    grid-column:2;
  }
  .process-card-copy h3 {
    font-size:20px;
  }
  .process-card-copy p {
    max-width:420px;
    font-size:10px;
    line-height:1.65;
  }
}

/* Very small devices */
@media (max-width:390px) {
  .tech-orbit-stage { grid-template-columns:1fr; }
  .service-card-body { min-height:365px; }
}

@media (prefers-reduced-motion:reduce) {
  .services-engine-float,
  .orbit-path,
  .tech-core-pulse {
    animation:none!important;
  }
}