* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    overflow-x: hidden;
    background: #ffffff;
    color: #082f35;
}

::selection {
    background: #78FFD6;
    color: #062F35;
}

/* =========================
   GLOBAL
========================== */
.gradient {
    background: linear-gradient(135deg, #007991 0%, #0b9fac 45%, #78FFD6 100%);
}

.gradient-text {
    background: linear-gradient(135deg, #007991, #00a6a6, #38d9c5);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.glass {
    background: rgba(255,255,255,.70);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,.65);
}

.glass-dark {
    background: rgba(5,35,40,.72);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,.12);
}

.grid-pattern {
    background-image:
        linear-gradient(rgba(0,121,145,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0,121,145,.045) 1px, transparent 1px);
    background-size: 42px 42px;
}

.dark-grid {
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 45px 45px;
}

.blob {
    position: absolute;
    border-radius: 999px;
    filter: blur(80px);
    pointer-events: none;
}

/* =========================
   NAVBAR
========================== */
.nav-scrolled {
    background: rgba(255,255,255,.88);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 10px 40px rgba(0,0,0,.07);
}
/* Active nav link */
#navbar .nav-link.is-active {
    color: #78FFD6;
}
#navbar .nav-link.is-active::after {
    right: 0;
}

#navbar.nav-scrolled .nav-link.is-active {
    color: #007991;
}

/* =========================
   GLOW BORDER
========================== */
.glow-border {
    position: relative;
}

.glow-border::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    background: linear-gradient(135deg, #007991, #78FFD6, transparent, #007991);
    z-index: -1;
    opacity: 0;
    transition: .4s;
}

.glow-border:hover::before {
    opacity: 1;
}

/* =========================
   CUSTOM CURSOR
========================== */
#cursor {
    position: fixed;
    width: 15px;
    height: 15px;
    border: 2px solid #78FFD6;
    border-radius: 50%;
    pointer-events: none;
    z-index: 99999;
    transform: translate(-50%, -50%);
    transition: width .2s, height .2s;
    mix-blend-mode: difference;
}

@media(max-width:768px) {
    #cursor { display: none; }
}

/* =========================================================
   VSPAZE PREMIUM MOTION SYSTEM
   ========================================================= */
:root{
  --ease-premium:cubic-bezier(.16,1,.3,1);
  --ease-smooth:cubic-bezier(.2,.8,.2,1);
}

section{position:relative;isolation:isolate}

section:not(#home)::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 15% 20%, rgba(120,255,214,.055), transparent 28%),
    radial-gradient(circle at 85% 80%, rgba(0,121,145,.045), transparent 30%);
  animation:ambientDrift 14s ease-in-out infinite alternate;
}
@keyframes ambientDrift{
  from{transform:translate3d(-1%,0,0) scale(1)}
  to{transform:translate3d(1%,1%,0) scale(1.035)}
}

.reveal{
  opacity:0;
  transform:translate3d(0,55px,0) scale(.985);
  filter:blur(4px);
  transition:
    opacity .9s var(--ease-premium),
    transform 1s var(--ease-premium),
    filter .9s var(--ease-premium);
  will-change:transform,opacity,filter;
}
.reveal.show{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  filter:blur(0);
}
.reveal:nth-child(2){transition-delay:.08s}
.reveal:nth-child(3){transition-delay:.16s}
.reveal:nth-child(4){transition-delay:.24s}
.reveal:nth-child(5){transition-delay:.32s}
.reveal:nth-child(6){transition-delay:.40s}

h1,h2,h3,h4,p,a,button{transition-timing-function:var(--ease-premium)}
h2{letter-spacing:-.035em}
.gradient-text{
  background-size:200% 200%;
  animation:gradientFlow 7s ease infinite;
}
@keyframes gradientFlow{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}

a[class*="rounded-full"], button{
  position:relative;
  overflow:hidden;
}
a[class*="rounded-full"]::after, button::after{
  content:"";
  position:absolute;
  top:-120%;
  left:-80%;
  width:45%;
  height:340%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  transform:rotate(22deg);
  transition:left .8s var(--ease-premium);
  pointer-events:none;
}
a[class*="rounded-full"]:hover::after, button:hover::after{left:140%}

nav a, #mobileMenu a{
  position:relative;
}
nav a:not(.gradient)::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:-7px;
  height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,#007991,#78FFD6);
  transition:right .45s var(--ease-premium);
}
nav a:not(.gradient):hover::after{right:0}

.service-card{
  transform-style:preserve-3d;
  will-change:transform;
  transition:
    transform .65s var(--ease-premium),
    box-shadow .65s var(--ease-premium),
    border-color .4s ease;
}
.service-card:hover{
  box-shadow:0 35px 90px rgba(0,121,145,.18);
}
.service-card > div:first-child{
  transition:transform .6s var(--ease-premium), box-shadow .5s ease;
}
.service-card:hover > div:first-child{
  transform:translate3d(0,-5px,20px) rotate(-4deg) scale(1.08);
  box-shadow:0 15px 35px rgba(0,121,145,.16);
}

#why .group,
#capabilities .group,
#about .glass-dark,
#capabilities .grid > div,
section:not(#home) .glass-dark{
  transition:
    transform .65s var(--ease-premium),
    box-shadow .65s ease,
    background-color .45s ease,
    border-color .45s ease;
  will-change:transform;
}
#why .group:hover,
#capabilities .group:hover,
#about .glass-dark:hover{
  transform:translateY(-8px);
  box-shadow:0 28px 70px rgba(0,121,145,.13);
}

[data-lucide]{
  transition:transform .55s var(--ease-premium);
}
.group:hover [data-lucide],
.glass-dark:hover [data-lucide],
.service-card:hover [data-lucide]{
  transform:scale(1.12) rotate(-6deg);
}

section.bg-slate-950 .glass-dark{
  position:relative;
  overflow:hidden;
}
section.bg-slate-950 .glass-dark::before{
  content:"";
  position:absolute;
  width:130px;height:130px;
  border-radius:50%;
  background:rgba(120,255,214,.10);
  filter:blur(30px);
  top:-65px;right:-65px;
  opacity:0;
  transition:opacity .6s ease,transform .8s var(--ease-premium);
}
section.bg-slate-950 .glass-dark:hover::before{
  opacity:1;
  transform:scale(1.4);
}

#process .grid{position:relative}
@media(min-width:768px){
  #process .grid::before{
    content:"";
    position:absolute;
    left:8%;
    right:8%;
    top:43px;
    height:1px;
    background:linear-gradient(90deg,transparent,#78FFD6,#007991,transparent);
    background-size:200% 100%;
    animation:lineFlow 4s linear infinite;
    opacity:.35;
  }
}
@keyframes lineFlow{
  from{background-position:0% 0}
  to{background-position:200% 0}
}
#process .grid > div{z-index:1}
#process .grid > div > div:first-child{
  transition:transform .7s var(--ease-premium),color .4s ease;
}
#process .grid > div:hover > div:first-child{
  transform:translateY(-8px) scale(1.04);
  color:rgba(0,121,145,.18);
}

#capabilities .grid > div span:last-child{
  transition:transform .7s var(--ease-premium),opacity .5s ease;
}
#capabilities .grid > div:hover span:last-child{
  transform:translate(-6px,-8px) scale(1.12);
}

#home .inline-flex{
  animation:heroBadge 1.1s var(--ease-premium) both;
}
#home h1{
  animation:heroTitle 1.1s .12s var(--ease-premium) both;
}
#home p{
  animation:heroCopy 1s .25s var(--ease-premium) both;
}
#home .flex.flex-wrap{
  animation:heroCopy 1s .38s var(--ease-premium) both;
}
#home .flex.gap-10{
  animation:heroCopy 1s .52s var(--ease-premium) both;
}
@keyframes heroBadge{
  from{opacity:0;transform:translateY(20px) scale(.94);filter:blur(5px)}
  to{opacity:1;transform:none;filter:blur(0)}
}
@keyframes heroTitle{
  from{opacity:0;transform:translateY(35px);filter:blur(8px)}
  to{opacity:1;transform:none;filter:blur(0)}
}
@keyframes heroCopy{
  from{opacity:0;transform:translateY(22px)}
  to{opacity:1;transform:none}
}

#home .glass-dark{
  transform-style:preserve-3d;
  animation:dashboardFloat 7s ease-in-out infinite;
}
@keyframes dashboardFloat{
  0%,100%{transform:translateY(0) rotateX(0deg)}
  50%{transform:translateY(-10px) rotateX(1deg)}
}
#home .flex.items-end.gap-2 span{
  transform-origin:bottom;
  animation:barRise 1.4s var(--ease-premium) both;
}
#home .flex.items-end.gap-2 span:nth-child(1){animation-delay:.35s}
#home .flex.items-end.gap-2 span:nth-child(2){animation-delay:.45s}
#home .flex.items-end.gap-2 span:nth-child(3){animation-delay:.55s}
#home .flex.items-end.gap-2 span:nth-child(4){animation-delay:.65s}
#home .flex.items-end.gap-2 span:nth-child(5){animation-delay:.75s}
#home .flex.items-end.gap-2 span:nth-child(6){animation-delay:.85s}
@keyframes barRise{
  from{transform:scaleY(0);opacity:.2}
  to{transform:scaleY(1);opacity:1}
}

#home .absolute.top-16,
#home .absolute.bottom-20{
  transition:transform .5s var(--ease-premium);
}
#home .absolute.top-16:hover{transform:translateY(-8px) rotate(1deg)}
#home .absolute.bottom-20:hover{transform:translateY(-8px) rotate(-1deg)}

#contact > div{
  transform:translateZ(0);
  transition:box-shadow .8s ease,transform .8s var(--ease-premium);
  box-shadow:0 25px 90px rgba(0,121,145,.16);
}
#contact > div:hover{
  transform:translateY(-5px);
  box-shadow:0 40px 110px rgba(0,121,145,.24);
}
#contact h2{animation:ctaBreath 5s ease-in-out infinite}
@keyframes ctaBreath{
  0%,100%{text-shadow:0 0 0 rgba(120,255,214,0)}
  50%{text-shadow:0 0 30px rgba(120,255,214,.18)}
}

footer a{
  transition:transform .4s var(--ease-premium),background .4s ease,color .4s ease,border-color .4s ease;
}
footer .footer-social:hover{transform:translateY(-4px)}

#topBtn{
  transition:
    opacity .35s ease,
    transform .45s var(--ease-premium),
    box-shadow .45s ease;
}
#topBtn:hover{
  transform:translateY(-5px) scale(1.08);
}

#scrollProgress{
  position:fixed;
  top:0;left:0;
  height:3px;
  width:0;
  background:linear-gradient(90deg,#007991,#78FFD6);
  z-index:100000;
  box-shadow:0 0 14px rgba(120,255,214,.6);
  pointer-events:none;
}

.motion-particle{
  position:absolute;
  width:4px;height:4px;
  border-radius:50%;
  background:#78FFD6;
  opacity:.35;
  pointer-events:none;
  animation:particleFloat var(--duration,8s) ease-in-out infinite;
}
@keyframes particleFloat{
  0%,100%{transform:translate3d(0,20px,0);opacity:.1}
  50%{transform:translate3d(var(--x,30px),-50px,0);opacity:.65}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
  .reveal{opacity:1!important;transform:none!important;filter:none!important}
}
@media(max-width:768px){
  section:not(#home)::before{animation:none}
  .reveal{transform:translateY(30px);filter:none}
}

/* =========================================================
   INDUSTRIES — PROFESSIONAL VISUAL BACKGROUND
   ========================================================= */
#industries{
  position:relative;
  background:
    linear-gradient(90deg, rgba(2,25,30,.97) 0%, rgba(3,39,45,.91) 48%, rgba(2,25,30,.96) 100%),
    url("https://images.unsplash.com/photo-1550751827-4bd374c3f58b?auto=format&fit=crop&w=2400&q=85")
    center/cover no-repeat;
  background-attachment:fixed;
}
#industries::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 78% 20%, rgba(120,255,214,.13), transparent 27%),
    linear-gradient(180deg, rgba(2,25,30,.15), rgba(2,25,30,.72));
  pointer-events:none;
  z-index:0;
}
#industries > *{
  position:relative;
  z-index:1;
}
#industries .glass-dark{
  background:rgba(4,30,35,.60);
  border:1px solid rgba(120,255,214,.12);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
#industries .glass-dark:hover{
  background:rgba(5,43,49,.78);
  border-color:rgba(120,255,214,.30);
  box-shadow:0 25px 65px rgba(0,0,0,.28);
}
@media(max-width:768px){
  #industries{
    background-attachment:scroll;
    background-position:center;
  }
}

/* =========================================================
   FINAL RESPONSIVE NAVIGATION SYSTEM
   ========================================================= */
#navbar{ color:#082f35; }

#navbar.nav-scrolled{
    background:rgba(255,255,255,.90);
    backdrop-filter:blur(22px);
    -webkit-backdrop-filter:blur(22px);
    box-shadow:0 12px 40px rgba(0,45,55,.10);
}

#menuBtn{
    border:1px solid rgba(0,121,145,.15);
    background:rgba(255,255,255,.92);
    box-shadow:0 8px 25px rgba(0,60,70,.12);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    transition:.4s var(--ease-premium);
}
#menuBtn:hover{
    transform:scale(1.04);
    box-shadow:0 12px 32px rgba(0,121,145,.18);
}

.menu-line{
    position:absolute;
    width:21px;
    height:2px;
    border-radius:99px;
    background:#062F35;
    transition:transform .4s var(--ease-premium),opacity .25s ease,width .3s ease;
}
.line-one{transform:translateY(-7px)}
.line-two{transform:translateY(0)}
.line-three{transform:translateY(7px)}

#menuBtn.is-open .line-one{transform:rotate(45deg);}
#menuBtn.is-open .line-two{opacity:0;width:0;}
#menuBtn.is-open .line-three{transform:rotate(-45deg);}

#mobileMenu{
    position:absolute;
    left:10px;
    right:10px;
    top:calc(100% + 8px);
    max-height:0;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    overflow:hidden;
    transform:translateY(-12px) scale(.985);
    transform-origin:top center;
    border:1px solid rgba(0,121,145,.13);
    border-radius:24px;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(25px);
    -webkit-backdrop-filter:blur(25px);
    box-shadow:0 28px 80px rgba(0,42,52,.20);
    transition:
        max-height .55s var(--ease-premium),
        opacity .3s ease,
        visibility .3s ease,
        transform .45s var(--ease-premium);
}

#mobileMenu::before{
    content:"";
    display:block;
    height:3px;
    background:linear-gradient(90deg,#007991,#78FFD6,#007991);
    background-size:200% 100%;
    animation:mobileNavFlow 4s linear infinite;
}
@keyframes mobileNavFlow{
    to{background-position:200% 0}
}

#mobileMenu.is-open{
    max-height:calc(100vh - 92px);
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0) scale(1);
    overflow-y:auto;
}

.mobile-menu-inner{padding:15px;}

.mobile-menu-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:7px 10px 13px;
    margin-bottom:3px;
}

.mobile-menu-heading span:first-child{
    display:block;
    color:#007991;
    font-size:10px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.2em;
}

.mobile-menu-heading strong{
    display:block;
    color:#062F35;
    font-family:"Space Grotesk",sans-serif;
    font-size:17px;
    margin-top:3px;
}

.mobile-menu-dot{
    width:9px;
    height:9px;
    border-radius:50%;
    background:#78FFD6;
    box-shadow:0 0 0 6px rgba(120,255,214,.12),0 0 20px rgba(120,255,214,.55);
}

.mobile-nav-link{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:48px;
    padding:0 13px;
    margin:3px 0;
    border-radius:14px;
    color:#143d43;
    font-weight:700;
    text-decoration:none;
    transition:
        background .3s ease,
        color .3s ease,
        transform .35s var(--ease-premium);
}

.mobile-nav-link span{
    display:flex;
    align-items:center;
    gap:11px;
}

.mobile-nav-link small{
    color:#007991;
    font-size:9px;
    font-weight:800;
    opacity:.5;
}

.mobile-nav-link svg{
    width:16px;
    opacity:.28;
    transition:transform .35s var(--ease-premium),opacity .3s ease;
}

.mobile-nav-link:hover,
.mobile-nav-link:active{
    background:linear-gradient(90deg,rgba(0,121,145,.08),rgba(120,255,214,.14));
    color:#007991;
    transform:translateX(4px);
}

.mobile-nav-link:hover svg{
    opacity:1;
    transform:translate(2px,-2px);
}

.mobile-menu-cta{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:51px;
    margin-top:9px;
    border-radius:16px;
    background:linear-gradient(135deg,#007991,#0b9fac,#78FFD6);
    color:white;
    font-weight:800;
    text-decoration:none;
    box-shadow:0 14px 32px rgba(0,121,145,.22);
    transition:transform .35s var(--ease-premium),box-shadow .35s ease;
}
.mobile-menu-cta:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 40px rgba(0,121,145,.28);
}

@media(min-width:1024px){
    #mobileMenu{display:none!important}
}
@media(max-width:1023px){
    #navbar .max-w-7xl{width:100%;}
}
@media(max-width:480px){
    #mobileMenu{left:7px;right:7px;}
    .mobile-menu-inner{padding:12px;}
    .mobile-nav-link{min-height:46px;}
}

/* =========================================================
   GLOBAL RESPONSIVE POLISH
   ========================================================= */
img,svg{max-width:100%;}
button,a{-webkit-tap-highlight-color:transparent;}

@media(max-width:640px){
    h1{font-size:clamp(2.35rem,12vw,3.7rem)!important;}
    h2{font-size:clamp(2rem,9vw,3rem)!important;}
    section{overflow:hidden;}
    .service-card,
    #why .group,
    #capabilities .group{border-radius:24px;}
}

@media(min-width:641px) and (max-width:1023px){
    .max-w-7xl{max-width:92%;}
}

@media(max-width:1023px){
    #home .grid{gap:2.5rem;}
    #services,
    #about,
    #why,
    #industries,
    #process,
    #capabilities{
        padding-top:5.5rem;
        padding-bottom:5.5rem;
    }
}

@media(max-width:767px){
    #contact{padding-top:2rem;padding-bottom:2rem;}
    #contact > div{border-radius:28px;}
    footer .grid{grid-template-columns:1fr!important;}
    footer .footer-contact-card{width:100%;}
    .footer-social{width:40px;height:40px;}
}

/* =========================================================
   FOOTER NEWSLETTER
   ========================================================= */
.footer-newsletter{
    position:relative;
    padding:26px 28px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:26px;
    background:linear-gradient(135deg,rgba(255,255,255,.065),rgba(120,255,214,.025));
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    overflow:hidden;
}

.footer-newsletter::after{
    content:"";
    position:absolute;
    width:180px;
    height:180px;
    right:-80px;
    top:-100px;
    border-radius:50%;
    background:rgba(120,255,214,.10);
    filter:blur(45px);
    pointer-events:none;
}

.footer-email-input{
    width:100%;
    min-width:260px;
    height:50px;
    padding:0 16px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.12);
    outline:none;
    background:rgba(255,255,255,.07);
    color:white;
    font-size:14px;
    transition:border-color .3s ease,background .3s ease,box-shadow .3s ease;
}

.footer-email-input::placeholder{color:rgba(255,255,255,.35);}

.footer-email-input:focus{
    border-color:rgba(120,255,214,.55);
    background:rgba(255,255,255,.10);
    box-shadow:0 0 0 4px rgba(120,255,214,.07);
}

.footer-subscribe-btn{
    height:50px;
    padding:0 20px;
    border:0;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    background:#78FFD6;
    color:#062F35;
    font-weight:800;
    cursor:pointer;
    white-space:nowrap;
    transition:transform .35s var(--ease-premium),box-shadow .35s ease;
}

.footer-subscribe-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 32px rgba(120,255,214,.20);
}

@media(max-width:640px){
    .footer-newsletter{padding:22px 18px;border-radius:22px;}
    .footer-email-input{min-width:0;}
    .footer-subscribe-btn{width:100%;}
}

/* =========================================================
   NAVBAR — CONTRAST-AWARE COLORS
   ========================================================= */
#navbar .nav-link{color:rgba(255,255,255,.94);}
#navbar .nav-link:hover{color:#78FFD6;}
#navbar .nav-link::after{background:linear-gradient(90deg,#78FFD6,#ffffff);}
#navbar .navbar-brand-name{color:#ffffff;}
#navbar .navbar-brand-sub{color:rgba(255,255,255,.72);}
#navbar #navCta{
    box-shadow:0 0 0 1px rgba(255,255,255,.45),0 14px 34px rgba(0,0,0,.20);
}

#navbar.nav-scrolled .nav-link{color:#143d43;}
#navbar.nav-scrolled .nav-link:hover{color:#007991;}
#navbar.nav-scrolled .nav-link::after{background:linear-gradient(90deg,#007991,#78FFD6);}
#navbar.nav-scrolled .navbar-brand-name{color:#062F35;}
#navbar.nav-scrolled .navbar-brand-sub{color:#007991;}
#navbar.nav-scrolled #navCta{
    box-shadow:0 0 0 1px rgba(255,255,255,0),0 14px 34px rgba(0,121,145,.28);
}

/* =========================================================
   FOOTER — OFFICIAL EXTRAS
   ========================================================= */
.footer-contact-row{
    display:flex;
    align-items:flex-start;
    gap:12px;
    text-decoration:none;
}

.footer-contact-icon{
    width:36px;
    height:36px;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    background:rgba(120,255,214,.10);
    color:#78FFD6;
    transition:background .35s ease,color .35s ease,transform .45s var(--ease-premium);
}

.footer-contact-row:hover .footer-contact-icon{
    background:#78FFD6;
    color:#062F35;
    transform:translateY(-2px);
}

.footer-link{
    color:rgba(255,255,255,.50);
    text-decoration:none;
    display:inline-block;
    transition:color .3s ease,transform .35s var(--ease-premium);
}
.footer-link:hover{
    color:#78FFD6;
    transform:translateX(3px);
}

.footer-heading{
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.22em;
    color:rgba(255,255,255,.38);
    margin-bottom:20px;
}

.footer-bottom-bar{border-top:1px solid rgba(255,255,255,.10);}

@media(max-width:1023px){
    .footer-heading{margin-bottom:16px;}
}

@media (max-width: 1023px){
    #navbar{overflow:visible;}
    #mobileMenu{display:block;}
}
@media (min-width: 1024px){
    #mobileMenu{display:none!important;}
}

/* =========================================================
   PREMIUM ANIMATION ENHANCEMENT LAYER
   ========================================================= */
.gradient{
    background-size:220% 220%;
    animation:gradientSweep 9s ease-in-out infinite;
}
@keyframes gradientSweep{
    0%,100%{background-position:0% 50%}
    50%{background-position:100% 50%}
}

.shadow-glow{animation:glowBreath 4s ease-in-out infinite;}
@keyframes glowBreath{
    0%,100%{box-shadow:0 0 32px rgba(120,255,214,.22)}
    50%{box-shadow:0 0 58px rgba(120,255,214,.42)}
}

.grid-pattern,
.dark-grid{animation:gridDrift 22s linear infinite;}
@keyframes gridDrift{
    from{background-position:0 0,0 0}
    to{background-position:42px 42px,42px 42px}
}
.dark-grid{animation-duration:28s;}
@keyframes gridDriftDark{
    from{background-position:0 0,0 0}
    to{background-position:45px 45px,45px 45px}
}
.dark-grid{animation-name:gridDriftDark;}

body{animation:bodyAmbient 18s ease-in-out infinite;}
@keyframes bodyAmbient{
    0%,100%{background-color:#ffffff}
    50%{background-color:#fbfefd}
}

#scrollProgress{animation:progressPulse 2.4s ease-in-out infinite;}
@keyframes progressPulse{
    0%,100%{box-shadow:0 0 14px rgba(120,255,214,.5)}
    50%{box-shadow:0 0 26px rgba(120,255,214,.9)}
}

#cursor{animation:cursorPulse 1.6s ease-in-out infinite;}
@keyframes cursorPulse{
    0%,100%{box-shadow:0 0 0 0 rgba(120,255,214,.35)}
    50%{box-shadow:0 0 0 6px rgba(120,255,214,0)}
}

#navbar .navbar-brand-name{
    transition:letter-spacing .6s var(--ease-premium),color .4s ease;
}
#navbar a:hover .navbar-brand-name{letter-spacing:.05em;}

#navbar a > div:first-child{animation:logoFloat 4.5s ease-in-out infinite;}
@keyframes logoFloat{
    0%,100%{transform:translateY(0) rotate(0)}
    50%{transform:translateY(-3px) rotate(-3deg)}
}

#navbar .nav-link{transition:color .35s ease,transform .35s var(--ease-premium);}
#navbar .nav-link:hover{transform:translateY(-2px);}

#navbar #navCta{animation:ctaGlow 3.5s ease-in-out infinite;}
@keyframes ctaGlow{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-2px)}
}

#menuBtn:hover .menu-line{width:26px;}
#menuBtn .menu-line{
    transition:transform .4s var(--ease-premium),opacity .25s ease,width .35s ease;
}

#mobileMenu.is-open .mobile-nav-link{animation:menuItemIn .55s var(--ease-premium) both;}
#mobileMenu.is-open .mobile-nav-link:nth-child(2){animation-delay:.04s}
#mobileMenu.is-open .mobile-nav-link:nth-child(3){animation-delay:.08s}
#mobileMenu.is-open .mobile-nav-link:nth-child(4){animation-delay:.12s}
#mobileMenu.is-open .mobile-nav-link:nth-child(5){animation-delay:.16s}
#mobileMenu.is-open .mobile-nav-link:nth-child(6){animation-delay:.20s}
#mobileMenu.is-open .mobile-nav-link:nth-child(7){animation-delay:.24s}
#mobileMenu.is-open .mobile-nav-link:nth-child(8){animation-delay:.28s}
#mobileMenu.is-open .mobile-menu-cta{animation:menuItemIn .55s .32s var(--ease-premium) both}
@keyframes menuItemIn{
    from{opacity:0;transform:translateX(-14px)}
    to{opacity:1;transform:none}
}

#home .blob{animation:blobDrift 16s ease-in-out infinite alternate;}
#home .blob:nth-of-type(2){animation-duration:20s;animation-direction:alternate-reverse;}
@keyframes blobDrift{
    from{transform:translate3d(0,0,0) scale(1)}
    to{transform:translate3d(30px,-40px,0) scale(1.15)}
}

#home .inline-flex span:first-child{animation:badgePulse 2s ease-in-out infinite;}
@keyframes badgePulse{
    0%,100%{box-shadow:0 0 0 0 rgba(120,255,214,.55)}
    50%{box-shadow:0 0 0 6px rgba(120,255,214,0)}
}

#home h1 .text-mint{animation:mintGlow 4s ease-in-out infinite;}
@keyframes mintGlow{
    0%,100%{text-shadow:0 0 0 rgba(120,255,214,0)}
    50%{text-shadow:0 0 24px rgba(120,255,214,.55)}
}

#home .flex.gap-10 strong{display:inline-block;animation:statPop 3s ease-in-out infinite;}
#home .flex.gap-10 div:nth-child(2) strong{animation-delay:.5s}
#home .flex.gap-10 div:nth-child(3) strong{animation-delay:1s}
@keyframes statPop{
    0%,100%{transform:translateY(0) scale(1)}
    50%{transform:translateY(-4px) scale(1.05)}
}

#home .animate-spinSlow{animation:spin 22s linear infinite, ringGlow 5s ease-in-out infinite;}
@keyframes ringGlow{
    0%,100%{border-color:rgba(255,255,255,.15)}
    50%{border-color:rgba(120,255,214,.45)}
}

#home .absolute.top-16,
#home .absolute.bottom-20{animation:floatCard 6s ease-in-out infinite;}
#home .absolute.bottom-20{animation-duration:7.5s;animation-delay:.8s;}
@keyframes floatCard{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-12px)}
}

#home .glass-dark strong{transition:color .4s ease,text-shadow .4s ease;}
#home .glass-dark:hover strong{
    color:#78FFD6;
    text-shadow:0 0 16px rgba(120,255,214,.55);
}

.service-card{
    transition:transform .7s var(--ease-premium),box-shadow .7s var(--ease-premium),border-color .4s ease;
}
.service-card:hover{border-color:rgba(0,121,145,.25);}

.service-card > div:first-child{animation:iconIdle 5s ease-in-out infinite;}
.service-card:nth-child(2) > div:first-child{animation-delay:.4s}
.service-card:nth-child(3) > div:first-child{animation-delay:.8s}
.service-card:nth-child(4) > div:first-child{animation-delay:1.2s}
.service-card:nth-child(5) > div:first-child{animation-delay:1.6s}
.service-card:nth-child(6) > div:first-child{animation-delay:2s}
@keyframes iconIdle{
    0%,100%{transform:translateY(0) rotate(0)}
    50%{transform:translateY(-4px) rotate(-3deg)}
}

.service-card > div:last-child{
    transition:transform .5s var(--ease-premium),letter-spacing .5s var(--ease-premium);
}
.service-card:hover > div:last-child{
    transform:translateX(6px);
    letter-spacing:.02em;
}

#services a[class*="rounded-full"]{animation:softPulse 3s ease-in-out infinite;}
@keyframes softPulse{
    0%,100%{box-shadow:0 0 0 0 rgba(0,121,145,.20)}
    50%{box-shadow:0 0 0 12px rgba(0,121,145,0)}
}

#about .absolute.-inset-5{animation:haloBreath 7s ease-in-out infinite;}
@keyframes haloBreath{
    0%,100%{opacity:.18;transform:scale(1)}
    50%{opacity:.35;transform:scale(1.05)}
}

#about .bg-slate-950{animation:cardFloat 8s ease-in-out infinite;}
@keyframes cardFloat{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-6px)}
}

#about .bg-primary\/10{animation:checkPulse 3.2s ease-in-out infinite;}
#about .space-y-5 > div:nth-child(2) .bg-primary\/10{animation-delay:.4s}
#about .space-y-5 > div:nth-child(3) .bg-primary\/10{animation-delay:.8s}
@keyframes checkPulse{
    0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(0,121,145,.18)}
    50%{transform:scale(1.08);box-shadow:0 0 0 8px rgba(0,121,145,0)}
}

#about a[class*="rounded-full"]{
    transition:transform .5s var(--ease-premium),box-shadow .5s ease;
}
#about a[class*="rounded-full"]:hover{
    box-shadow:0 20px 45px rgba(0,121,145,.30);
}

#why .group > div:last-child span:first-child{
    display:inline-block;
    animation:numPulse 4s ease-in-out infinite;
}
@keyframes numPulse{
    0%,100%{transform:translateY(0) scale(1)}
    50%{transform:translateY(-6px) scale(1.06)}
}

#why .group{transition:transform .7s var(--ease-premium),box-shadow .7s ease;}
#why .group:hover{box-shadow:0 35px 80px rgba(0,0,0,.22);}
#why .group:nth-child(1):hover{transform:translateY(-10px) rotate(-.8deg)}
#why .group:nth-child(2):hover{transform:translateY(-10px) rotate(.6deg)}
#why .group:nth-child(3):hover{transform:translateY(-10px) rotate(-.5deg)}

#why .blur-3xl{animation:blurBreath 6s ease-in-out infinite;}
@keyframes blurBreath{
    0%,100%{transform:scale(1);opacity:.5}
    50%{transform:scale(1.2);opacity:.85}
}

#industries .grid.grid-cols-3 > div{
    transition:transform 1s var(--ease-premium),filter .6s ease;
}
#industries .grid.grid-cols-3 > div:hover{
    transform:scale(1.08);
    filter:brightness(1.1) saturate(1.15);
}

#industries .glass-dark{
    transition:transform .6s var(--ease-premium),background .5s ease,border-color .5s ease,box-shadow .6s ease;
}
#industries .glass-dark:hover{transform:translateY(-8px);}
#industries .glass-dark:hover [data-lucide]{animation:iconBounce .8s var(--ease-premium);}
@keyframes iconBounce{
    0%{transform:translateY(0) scale(1)}
    35%{transform:translateY(-8px) scale(1.18)}
    70%{transform:translateY(2px) scale(.98)}
    100%{transform:translateY(0) scale(1)}
}

#industries .bg-mint\/10{animation:badgeGlow 3.5s ease-in-out infinite;}
@keyframes badgeGlow{
    0%,100%{box-shadow:0 0 0 0 rgba(120,255,214,0)}
    50%{box-shadow:0 0 22px rgba(120,255,214,.22)}
}

#industries a[class*="rounded-full"]{animation:softPulseWhite 3.4s ease-in-out infinite;}
@keyframes softPulseWhite{
    0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.25)}
    50%{box-shadow:0 0 0 14px rgba(255,255,255,0)}
}

#process .grid > div > div:first-child{animation:stepFloat 5s ease-in-out infinite;}
#process .grid > div:nth-child(2) > div:first-child{animation-delay:.3s}
#process .grid > div:nth-child(3) > div:first-child{animation-delay:.6s}
#process .grid > div:nth-child(4) > div:first-child{animation-delay:.9s}
@keyframes stepFloat{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-6px)}
}

#process .grid > div:hover > div:first-child{
    color:rgba(0,121,145,.28);
    text-shadow:0 0 22px rgba(0,121,145,.18);
}

#process .grid > div h3{position:relative;display:inline-block;}
#process .grid > div h3::after{
    content:"";
    position:absolute;
    left:0;bottom:-6px;
    width:0;height:2px;
    border-radius:99px;
    background:linear-gradient(90deg,#007991,#78FFD6);
    transition:width .5s var(--ease-premium);
}
#process .grid > div:hover h3::after{width:100%;}

#capabilities .group{transition:transform .7s var(--ease-premium),box-shadow .7s ease;}
#capabilities .group:hover{box-shadow:0 40px 90px rgba(0,121,145,.20);}

#capabilities .group > div:first-child{animation:capIconFloat 5.5s ease-in-out infinite;}
#capabilities .group:nth-child(2) > div:first-child{animation-delay:.35s}
#capabilities .group:nth-child(3) > div:first-child{animation-delay:.7s}
#capabilities .group:nth-child(4) > div:first-child{animation-delay:1.05s}
@keyframes capIconFloat{
    0%,100%{transform:translateY(0) rotate(0)}
    50%{transform:translateY(-4px) rotate(4deg)}
}

#capabilities .group:hover span:last-child{opacity:.16;}

#capabilities h2{position:relative;}

#capabilities a[class*="rounded-full"]:hover{
    box-shadow:0 22px 50px rgba(0,121,145,.35);
}

#contact a[class*="rounded-full"]{
    transition:transform .5s var(--ease-premium),box-shadow .5s ease,background .5s ease;
}
#contact a[class*="rounded-full"]:hover{
    box-shadow:0 22px 55px rgba(0,0,0,.22);
}

#contact h2 .text-mint{animation:ctaMintGlow 4s ease-in-out infinite;}
@keyframes ctaMintGlow{
    0%,100%{text-shadow:0 0 0 rgba(120,255,214,0)}
    50%{text-shadow:0 0 30px rgba(120,255,214,.55)}
}

#contact .blob{animation:blobDrift 12s ease-in-out infinite alternate;}

.footer-newsletter{
    background-size:180% 180%;
    animation:newsletterFlow 8s ease-in-out infinite;
}
@keyframes newsletterFlow{
    0%,100%{background-position:0% 50%}
    50%{background-position:100% 50%}
}

.footer-newsletter::after{animation:newsletterOrb 9s ease-in-out infinite alternate;}
@keyframes newsletterOrb{
    from{transform:translate(0,0) scale(1)}
    to{transform:translate(-30px,20px) scale(1.2)}
}

.footer-email-input:focus{animation:inputGlow 2s ease-in-out infinite;}
@keyframes inputGlow{
    0%,100%{box-shadow:0 0 0 4px rgba(120,255,214,.07)}
    50%{box-shadow:0 0 0 8px rgba(120,255,214,.12)}
}

.footer-subscribe-btn:hover{
    box-shadow:0 16px 40px rgba(120,255,214,.35);
}

footer .gradient.w-12{animation:footerLogoFloat 5s ease-in-out infinite;}
@keyframes footerLogoFloat{
    0%,100%{transform:translateY(0) rotate(0)}
    50%{transform:translateY(-4px) rotate(-3deg)}
}

.footer-social:hover [data-lucide]{animation:socialSpin .7s var(--ease-premium);}
@keyframes socialSpin{
    0%{transform:rotate(0) scale(1)}
    60%{transform:rotate(360deg) scale(1.15)}
    100%{transform:rotate(360deg) scale(1)}
}

.footer-contact-row{transition:transform .45s var(--ease-premium);}
.footer-contact-row:hover{transform:translateX(4px);}

footer nav a{position:relative;}
footer nav a::after{
    content:"";
    position:absolute;
    left:0;right:100%;
    bottom:-4px;
    height:1px;
    background:linear-gradient(90deg,#78FFD6,#007991);
    transition:right .45s var(--ease-premium);
}
footer nav a:hover::after{right:0;}

.footer-contact-card a:last-child:hover{
    box-shadow:0 20px 44px rgba(120,255,214,.32);
}

#topBtn{animation:topBtnFloat 3.6s ease-in-out infinite;}
#topBtn:hover{animation-play-state:paused;}
@keyframes topBtnFloat{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-6px)}
}

section > div > span:first-child,
section .max-w-3xl > span:first-child{
    position:relative;
    display:inline-block;
    padding-left:16px;
}
section > div > span:first-child::before,
section .max-w-3xl > span:first-child::before{
    content:"";
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
    width:6px;height:6px;
    border-radius:50%;
    background:#78FFD6;
    box-shadow:0 0 12px rgba(120,255,214,.8);
    animation:dotBlink 2s ease-in-out infinite;
}
@keyframes dotBlink{
    0%,100%{opacity:.4;transform:translateY(-50%) scale(.8)}
    50%{opacity:1;transform:translateY(-50%) scale(1.2)}
}

.service-card,
#why .group,
#capabilities .group,
#industries .glass-dark{
    background-clip:padding-box;
}

footer p a:hover{
    text-shadow:0 0 14px rgba(120,255,214,.55);
}

#industries .bg-cover{animation:imgPulse 12s ease-in-out infinite;}
@keyframes imgPulse{
    0%,100%{filter:saturate(1) brightness(1)}
    50%{filter:saturate(1.15) brightness(1.05)}
}

button,
a{
    transition:transform .4s var(--ease-premium),box-shadow .4s ease,color .4s ease,background .4s ease,border-color .4s ease;
}

::selection{
    background:#78FFD6;
    color:#062F35;
}

a[class*="rounded-full"]:hover{
    transform:translateY(-2px);
}

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