/* =========================================================
   Zenithora v12 Professional Background + Hero Animation
   Inspired by previous Zenithora site, rebuilt cleaner.
   ========================================================= */
:root{
  --zen-bg:#050810;
  --zen-panel:rgba(8,18,30,.82);
  --zen-blue:#00AAFF;
  --zen-cyan:#00E0FF;
  --zen-deep:#0066CC;
  --zen-purple:#7A2EFF;
  --zen-line:rgba(0,170,255,.26);
  --zen-text-soft:rgba(232,242,255,.78);
}
html{scroll-behavior:smooth;}
body{
  background:#050810!important;
  color:#fff;
  min-height:100vh;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-5;
  background:
    radial-gradient(circle at 18% 18%, rgba(0,170,255,.23), transparent 42%),
    radial-gradient(circle at 82% 26%, rgba(0,224,255,.14), transparent 48%),
    radial-gradient(circle at 50% 82%, rgba(0,100,255,.18), transparent 54%),
    linear-gradient(135deg,#050810 0%,#081221 48%,#050810 100%);
}
body::after{
  content:"";
  position:fixed;
  inset:-45%;
  pointer-events:none;
  z-index:-4;
  background:
    linear-gradient(120deg, transparent 0%, rgba(0,170,255,.075) 45%, rgba(0,224,255,.09) 50%, transparent 58%),
    repeating-linear-gradient(90deg, rgba(0,170,255,.055) 0 1px, transparent 1px 90px),
    repeating-linear-gradient(0deg, rgba(0,170,255,.045) 0 1px, transparent 1px 90px);
  transform:translate3d(-10%,-10%,0);
  animation:zenSweep 18s linear infinite;
  opacity:.85;
}
@keyframes zenSweep{
  0%{transform:translate3d(-15%,-15%,0) rotate(0deg)}
  100%{transform:translate3d(15%,15%,0) rotate(.001deg)}
}
#particles-js{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  opacity:.42!important;
  z-index:-3!important;
  pointer-events:none!important;
}
.animated-bg{display:none!important;}
/* Professional glass navigation */
.glass-nav,.navbar.glass-nav{
  background:linear-gradient(135deg,rgba(0,0,0,.94),rgba(5,10,25,.90))!important;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(0,170,255,.34)!important;
  box-shadow:0 14px 35px rgba(0,0,0,.22);
  min-height:68px;
  padding-top:.55rem!important;
  padding-bottom:.55rem!important;
}
.glass-nav.scrolled{background:rgba(3,7,15,.96)!important;box-shadow:0 14px 42px rgba(0,0,0,.4)}
.navbar-brand img{filter:drop-shadow(0 0 12px rgba(0,170,255,.55));}
.navbar-brand span,.navbar-brand .brand-text{
  background:linear-gradient(135deg,#00AAFF,#00E0FF,#3A6EFF);
  -webkit-background-clip:text;background-clip:text;color:transparent!important;
  font-weight:800!important;
}
.glass-nav .nav-link{border-radius:999px;transition:all .25s ease;}
.glass-nav .nav-link:hover,.glass-nav .nav-link.active{background:rgba(0,170,255,.13);color:#fff!important;}
/* Hero background copied in spirit, improved for CMS */
.hero{
  position:relative;
  overflow:hidden;
  min-height:92vh!important;
  padding-top:92px;
  padding-bottom:42px;
  isolation:isolate;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    linear-gradient(90deg,rgba(5,8,16,.88),rgba(5,8,16,.58),rgba(5,8,16,.86)),
    radial-gradient(circle at 72% 42%, rgba(0,170,255,.28), transparent 42%),
    radial-gradient(circle at 28% 38%, rgba(122,46,255,.15), transparent 45%),
    linear-gradient(135deg,rgba(0,170,255,.10),transparent 55%);
}
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.32;
  background:
    linear-gradient(120deg, transparent 0 44%, rgba(0,170,255,.20) 49%, transparent 55%),
    repeating-linear-gradient(90deg,rgba(0,170,255,.10) 0 1px,transparent 1px 85px),
    repeating-linear-gradient(0deg,rgba(0,170,255,.08) 0 1px,transparent 1px 85px);
  mask-image:linear-gradient(to bottom,black,black 72%,transparent);
  animation:heroMatrix 16s linear infinite;
}
@keyframes heroMatrix{from{transform:translate3d(-5%,-5%,0)}to{transform:translate3d(5%,5%,0)}}
.hero .container{position:relative;z-index:2;}
.hero-bg-layer{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  opacity:.42!important;
  background:
    radial-gradient(circle at 72% 46%,rgba(0,170,255,.28),transparent 34%),
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="900" height="600" viewBox="0 0 900 600"><g fill="none" stroke="%2300AAFF" stroke-opacity="0.18"><path d="M90 440L230 340L350 380L510 210L690 250L820 120"/><path d="M160 130L310 250L480 160L650 340L790 290"/><circle cx="90" cy="440" r="5"/><circle cx="230" cy="340" r="5"/><circle cx="350" cy="380" r="5"/><circle cx="510" cy="210" r="5"/><circle cx="690" cy="250" r="5"/><circle cx="820" cy="120" r="5"/></g></svg>') center/cover no-repeat;
}
.hero-orb{
  position:absolute!important;
  width:min(42vw,440px)!important;
  height:min(42vw,440px)!important;
  right:8%!important;
  top:42%!important;
  left:auto!important;
  bottom:auto!important;
  border-radius:50%;
  background:radial-gradient(circle,rgba(0,170,255,.34),rgba(0,102,204,.18) 42%,transparent 72%)!important;
  filter:blur(72px)!important;
  animation:zenOrbPulse 6.5s ease-in-out infinite!important;
  z-index:1!important;
  opacity:.95!important;
}
@keyframes zenOrbPulse{0%,100%{transform:scale(1);opacity:.56}50%{transform:scale(1.16);opacity:.9}}
.hero .row,.hero .min-vh-100{min-height:calc(92vh - 80px)!important;}
.hero .badge,.hero-kicker{
  display:inline-flex;align-items:center;gap:.45rem;
  width:max-content;
  color:#bfeeff!important;
  background:rgba(0,170,255,.12)!important;
  border:1px solid rgba(0,170,255,.35)!important;
  border-radius:999px;
  padding:.55rem .9rem;
  font-size:.86rem;
  font-weight:700;
  box-shadow:0 12px 35px rgba(0,170,255,.12);
}
.hero-title-pro,.hero h1{
  max-width:980px;
  color:#fff!important;
  background:linear-gradient(135deg,#ffffff 0%,#eaf7ff 42%,#00AAFF 76%,#00E0FF 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  letter-spacing:-.055em;
  line-height:1.03;
  text-shadow:none;
}
.hero-type-line{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.65rem;
  min-height:2.2rem;
  font-size:clamp(1.05rem,2vw,1.4rem);
  color:var(--zen-text-soft);
  font-weight:600;
}
.type-label{color:rgba(255,255,255,.78)}
.typed-headline{
  display:inline-block;
  min-height:1.25em;
  color:#00AAFF!important;
  text-shadow:0 0 22px rgba(0,170,255,.36);
  font-weight:800;
  letter-spacing:-.02em;
  position:relative;
}
.typed-headline::after{
  content:"";
  display:inline-block;
  width:2px;
  height:1.05em;
  margin-left:5px;
  transform:translateY(3px);
  background:#00E0FF;
  box-shadow:0 0 12px rgba(0,224,255,.75);
  animation:zenCaret .85s steps(1) infinite;
}
@keyframes zenCaret{50%{opacity:0}}
.hero-subtitle-pro{font-weight:600;color:rgba(235,246,255,.86)!important;}
.hero-desc-pro{max-width:760px;color:rgba(232,242,255,.75)!important;font-size:1.02rem;}
.hero-image-wrapper{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:28px;
  border-radius:34px;
  background:linear-gradient(145deg,rgba(0,170,255,.15),rgba(255,255,255,.035));
  border:1px solid rgba(0,170,255,.24);
  box-shadow:0 30px 90px rgba(0,0,0,.35), inset 0 0 50px rgba(0,170,255,.08);
  backdrop-filter:blur(14px);
}
.floating-logo{animation:zenLogoFloat 4.4s ease-in-out infinite;filter:drop-shadow(0 0 28px rgba(0,170,255,.45));}
@keyframes zenLogoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.hero-stats-grid{margin-top:2rem!important;}
.hero-stat-card{
  background:rgba(8,18,30,.72)!important;
  border:1px solid rgba(0,170,255,.30)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.20);
  backdrop-filter:blur(12px);
  transition:transform .3s ease,background .3s ease,border-color .3s ease;
}
.hero-stat-card:hover{transform:translateY(-4px);background:rgba(0,100,200,.20)!important;border-color:rgba(0,224,255,.45)!important;}
.hero-stat-card strong{background:linear-gradient(135deg,#00AAFF,#00E0FF);-webkit-background-clip:text;background-clip:text;color:transparent!important;}
/* Keep sections compact and professional */
section.py-5,.services-section,.portfolio-section,.about-section,.team-section,.blog-section,.downloads-section{padding-top:64px!important;padding-bottom:64px!important;}
.service-card,.portfolio-card,.blog-card,.team-card,.testimonial-card,.industry-card,.glass,.glass-card,.stat-box,.contact-card{
  background:rgba(8,18,30,.80)!important;
  border:1px solid rgba(0,170,255,.22)!important;
  box-shadow:0 18px 55px rgba(0,0,0,.18);
  backdrop-filter:blur(13px);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.service-card:hover,.portfolio-card:hover,.blog-card:hover,.team-card:hover,.testimonial-card:hover,.industry-card:hover,.glass-card:hover,.stat-box:hover{
  transform:translateY(-5px);
  border-color:rgba(0,224,255,.44)!important;
  box-shadow:0 24px 70px rgba(0,170,255,.16);
}
.btn-primary,.btn-glow{background:linear-gradient(135deg,#00AAFF,#0066CC)!important;border:none!important;box-shadow:0 0 24px rgba(0,170,255,.28)!important;}
.btn-outline-light{border-color:rgba(0,170,255,.55)!important;background:rgba(0,0,0,.22)!important;}
/* Better reveal animation than random text animation */
.zen-reveal,.zen-fade-up,.zen-text-animated{opacity:0;transform:translateY(22px);filter:none;animation:none!important;}
.zen-reveal.zen-visible,.zen-fade-up.zen-visible,.zen-text-animated.zen-visible{opacity:1;transform:none;transition:opacity .7s ease,transform .7s ease;}
@media(max-width:991px){
  .hero{min-height:auto!important;padding-top:104px;padding-bottom:48px;}
  .hero .row,.hero .min-vh-100{min-height:auto!important;}
  .hero-title-pro,.hero h1{font-size:clamp(2.15rem,7vw,3rem)!important;}
  .hero-type-line{font-size:1.05rem;}
  .hero-image-wrapper{margin-top:2rem;padding:22px;}
  section.py-5,.services-section,.portfolio-section,.about-section,.team-section,.blog-section,.downloads-section{padding-top:46px!important;padding-bottom:46px!important;}
}
@media(max-width:575px){
  .glass-nav,.navbar.glass-nav{min-height:62px;padding-top:.45rem!important;padding-bottom:.45rem!important;}
  .navbar-brand img{height:40px!important;}
  .navbar-brand span{font-size:1rem!important;}
  .hero{padding-top:92px;padding-bottom:36px;}
  .hero-title-pro,.hero h1{font-size:2rem!important;line-height:1.08;}
  .hero-type-line{display:block;min-height:3.1rem;}
  .type-label{display:block;margin-bottom:.15rem;}
  .hero-desc-pro{font-size:.95rem;}
  .hero-stats-grid{grid-template-columns:1fr!important;}
  .hero-stat-card{padding:14px!important;}
  .hero-image-wrapper{padding:18px;border-radius:24px;}
  .floating-logo{max-width:190px!important;}
}

.progress-container{position:fixed;top:0;left:0;width:100%;height:3px;background:transparent;z-index:10000;pointer-events:none}.progress-bar{height:3px;background:linear-gradient(90deg,#00AAFF,#00E0FF,#7A2EFF);width:0%;transition:width .1s ease;box-shadow:0 0 12px rgba(0,170,255,.7)}