/* ═══════════════════════════════════════════════════════════════
   OneAxis360 v4.0 — Ultra-Premium Theme CSS
   Video hero, magnetic hover, text split, swipe carousel,
   parallax depth layers, scroll reveals, mobile-first
   ═══════════════════════════════════════════════════════════════ */

/* ── VARIABLES ── */
:root{
  --gold:#ffb800;
  --gold-rgb:255,184,0;
  --black:#000;
  --bg:#050505;
  --white:#f5f3ee;
  --white-rgb:245,243,238;
  --gray:#0c0c0c;
  --gray2:#141414;
  --muted:rgba(var(--white-rgb),.55);
  --border:rgba(var(--white-rgb),.08);
  --radius:8px;
  --nav-h:72px;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --ease-smooth:cubic-bezier(.25,.46,.45,.94);
}

/* ── GLOBAL RESET ── */
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;width:100%}
body.oneaxis360-phlox,body.oneaxis360-phlox .site,body.oneaxis360-phlox .aux-wrapper,body.oneaxis360-phlox .elementor{
  background:var(--bg)!important;color:var(--white)!important;
  font-family:'Inter','Lato',system-ui,sans-serif!important;
  font-size:16px;line-height:1.7;overflow-x:hidden;
}
body.oneaxis360-phlox img{max-width:100%;height:auto}
body.oneaxis360-phlox a{text-decoration:none;color:inherit;transition:color .3s}
body.oneaxis360-phlox .site-header-section,body.oneaxis360-phlox footer,body.oneaxis360-phlox .page-title-section{background:var(--bg)!important}
body.oneaxis360-phlox.home .page-title-section{display:none!important}
body.oneaxis360-phlox .elementor-section{background-color:transparent}
body.oneaxis360-phlox h1,body.oneaxis360-phlox h2,body.oneaxis360-phlox h3,body.oneaxis360-phlox .elementor-heading-title{
  font-family:'Lato','Inter',sans-serif;letter-spacing:-.02em;
}

/* ═══════════════════════════════════════
   PRELOADER (cinematic X draw-in)
   ═══════════════════════════════════════ */
.oa-preloader{
  position:fixed;inset:0;z-index:99999;
  background:var(--black);
  display:flex;align-items:center;justify-content:center;
  transition:opacity .8s cubic-bezier(.4,0,.2,1),visibility .8s;
}
.oa-preloader.done{opacity:0;visibility:hidden;pointer-events:none}
.oa-preloader-x{width:60px;height:60px}
.oa-px-l1,.oa-px-l2{
  stroke-dasharray:72;stroke-dashoffset:72;
  animation:oa-draw .8s ease-out forwards;
}
.oa-px-l2{animation-delay:.15s}
@keyframes oa-draw{to{stroke-dashoffset:0}}
.oa-preloader-bar{width:120px;height:2px;background:rgba(var(--white-rgb),.08);border-radius:2px;margin:24px auto 0;overflow:hidden}
.oa-preloader-bar-fill{width:0;height:100%;background:var(--gold);animation:oa-load 1.4s .3s ease-out forwards}
@keyframes oa-load{to{width:100%}}

/* ═══════════════════════════════════════
   PROGRESS BAR
   ═══════════════════════════════════════ */
.oa-progress{position:fixed;top:0;left:0;width:0;height:2px;background:var(--gold);z-index:99998;transition:width .08s linear}

/* ═══════════════════════════════════════
   CUSTOM CURSOR (desktop)
   ═══════════════════════════════════════ */
.oa-cur,.oa-ring{display:none;position:fixed;pointer-events:none;z-index:99997;border-radius:50%;will-change:transform}
@media(hover:hover) and (min-width:901px){
  .oa-cur{display:block;width:6px;height:6px;background:var(--gold);transform:translate(-50%,-50%)}
  .oa-ring{display:block;width:36px;height:36px;border:1.5px solid rgba(var(--gold-rgb),.5);transform:translate(-50%,-50%);transition:width .35s var(--ease-spring),height .35s var(--ease-spring),border-color .3s,opacity .3s}
  .oa-ring.big{width:56px;height:56px;border-color:var(--gold)}
  body.oneaxis360-phlox,body.oneaxis360-phlox a,body.oneaxis360-phlox button{cursor:none!important}
}

/* ═══════════════════════════════════════
   VIDEO HERO
   ═══════════════════════════════════════ */
.oa360-hero-section{
  position:relative;overflow:hidden;min-height:100vh;
  display:flex;align-items:center;
  background:var(--black)!important;
}
.oa360-hero-video{
  position:absolute;inset:0;z-index:0;
  overflow:hidden;
}
.oa360-hero-video video,
.oa360-hero-video .oa360-video-placeholder{
  width:100%;height:100%;
  object-fit:cover;
  opacity:.4;
  filter:brightness(.6) saturate(.8);
}
.oa360-video-placeholder{
  background:radial-gradient(ellipse 80% 70% at 75% 20%,rgba(var(--gold-rgb),.12),transparent 65%),var(--black);
}
/* Animated grid overlay on hero */
.oa360-hero-section::before{
  content:"";position:absolute;inset:0;z-index:1;
  background-image:
    linear-gradient(rgba(var(--gold-rgb),.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(var(--gold-rgb),.03) 1px,transparent 1px);
  background-size:80px 80px;
  animation:oa-grid-drift 30s linear infinite;
  pointer-events:none;
}
@keyframes oa-grid-drift{0%{transform:translate(0,0)}100%{transform:translate(80px,80px)}}
/* Gradient overlay */
.oa360-hero-section::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,.1) 40%,rgba(5,5,5,.9) 100%);
  pointer-events:none;
}
/* Hero content sits above video */
.oa360-hero-section .elementor-container{position:relative;z-index:2}

/* Floating X watermark */
.oa360-hero-x{
  position:absolute;right:-3vw;top:12vh;z-index:1;
  color:rgba(var(--gold-rgb),.03);
  font-family:'Lato',sans-serif;
  font-size:clamp(200px,40vw,650px);
  font-weight:900;line-height:.8;
  pointer-events:none;
  animation:oa-x-float 8s ease-in-out infinite;
}
@keyframes oa-x-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-15px) rotate(1.5deg)}}

/* Particles */
.oa360-hero-section .oa-particles{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.oa-particle{position:absolute;width:3px;height:3px;background:var(--gold);border-radius:50%;opacity:0;animation:oa-float-p var(--dur,6s) var(--delay,0s) ease-in-out infinite}
@keyframes oa-float-p{0%{opacity:0;transform:translateY(0)}20%{opacity:.6}80%{opacity:.3}100%{opacity:0;transform:translateY(calc(-35vh - 40px))}}

/* ═══════════════════════════════════════
   TEXT SPLIT ANIMATION
   ═══════════════════════════════════════ */
.oa360-text-split .elementor-heading-title{
  overflow:hidden;
}
.oa360-split-char{
  display:inline-block;
  opacity:0;
  transform:translateY(100%) rotateX(-80deg);
  transform-origin:bottom center;
  transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);
}
.oa360-split-char.in{
  opacity:1;
  transform:translateY(0) rotateX(0deg);
}
/* Word split variant */
.oa360-split-word{
  display:inline-block;
  opacity:0;
  transform:translateY(40px);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);
}
.oa360-split-word.in{opacity:1;transform:translateY(0)}

/* ═══════════════════════════════════════
   MAGNETIC HOVER
   ═══════════════════════════════════════ */
.oa360-magnetic{
  transition:transform .3s var(--ease-out);
  will-change:transform;
}

/* ═══════════════════════════════════════
   SCROLL REVEAL SYSTEM
   ═══════════════════════════════════════ */
.oa360-reveal{opacity:0;transform:translateY(40px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.oa360-reveal.in{opacity:1;transform:translateY(0)}
.oa360-reveal-d1{transition-delay:.1s}.oa360-reveal-d2{transition-delay:.2s}.oa360-reveal-d3{transition-delay:.3s}.oa360-reveal-d4{transition-delay:.4s}
.oa360-reveal-left{opacity:0;transform:translateX(-50px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.oa360-reveal-left.in{opacity:1;transform:translateX(0)}
.oa360-reveal-right{opacity:0;transform:translateX(50px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.oa360-reveal-right.in{opacity:1;transform:translateX(0)}
.oa360-reveal-scale{opacity:0;transform:scale(.88);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.oa360-reveal-scale.in{opacity:1;transform:scale(1)}

/* ═══════════════════════════════════════
   PARALLAX DEPTH LAYERS
   ═══════════════════════════════════════ */
.oa360-parallax-layer{will-change:transform;transition:transform .1s linear}

/* ═══════════════════════════════════════
   CARDS
   ═══════════════════════════════════════ */
.oa360-card,.oa360-service-card,.oa360-step-card,.oa360-contact-card{
  border:1px solid var(--border);
  background:linear-gradient(180deg,rgba(255,255,255,.02),transparent);
  border-radius:var(--radius);
  transition:transform .5s var(--ease-out),border-color .5s,box-shadow .5s,background .5s;
}
.oa360-card:hover,.oa360-service-card:hover,.oa360-step-card:hover{
  transform:translateY(-6px);
  border-color:rgba(var(--gold-rgb),.35);
  box-shadow:0 24px 60px rgba(0,0,0,.4),0 0 40px rgba(var(--gold-rgb),.06);
  background:linear-gradient(180deg,rgba(var(--gold-rgb),.05),transparent);
}

/* ═══════════════════════════════════════
   SWIPE CAROUSEL (Mobile Services)
   ═══════════════════════════════════════ */
.oa360-carousel{
  display:none; /* hidden on desktop, shown on mobile */
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  padding:0 16px 20px;
  gap:12px;
}
.oa360-carousel::-webkit-scrollbar{display:none}
.oa360-carousel-card{
  flex:0 0 72%;
  scroll-snap-align:start;
  border:1px solid var(--border);
  border-radius:12px;
  padding:24px 20px;
  background:linear-gradient(180deg,rgba(255,255,255,.03),transparent);
  transition:transform .3s,border-color .3s;
}
.oa360-carousel-card:active{transform:scale(.97)}
.oa360-carousel-card .oa360-cc-num{
  color:var(--gold);font-size:12px;font-weight:700;
  letter-spacing:.16em;margin-bottom:10px;
}
.oa360-carousel-card .oa360-cc-title{
  font-family:'Lato',sans-serif;font-size:18px;font-weight:700;
  color:var(--white);margin-bottom:8px;
}
.oa360-carousel-card .oa360-cc-desc{
  font-size:13px;line-height:1.6;color:var(--muted);
}
/* Carousel dots */
.oa360-carousel-dots{
  display:none;
  justify-content:center;gap:6px;padding:12px 0;
}
.oa360-carousel-dot{
  width:6px;height:6px;border-radius:50%;
  background:rgba(var(--white-rgb),.2);
  transition:background .3s,transform .3s;
}
.oa360-carousel-dot.active{background:var(--gold);transform:scale(1.3)}

/* ═══════════════════════════════════════
   TYPOGRAPHY HELPERS
   ═══════════════════════════════════════ */
.oa360-eyebrow .elementor-heading-title,.oa360-eyebrow{
  color:var(--gold)!important;font-size:11px!important;
  font-weight:700!important;letter-spacing:.28em!important;text-transform:uppercase;
}
.oa360-gold,.oa360-gold .elementor-heading-title{color:var(--gold)!important}
.oa360-lead,.oa360-lead p{color:var(--muted);font-size:16px;line-height:1.85}

/* ═══════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════ */
.oa360-button-gold .elementor-button{
  background:var(--gold)!important;color:var(--black)!important;
  border-radius:999px!important;font-weight:700!important;
  padding:16px 40px!important;letter-spacing:.02em;
  transition:transform .4s var(--ease-spring),box-shadow .4s!important;
}
.oa360-button-gold .elementor-button:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 12px 40px rgba(var(--gold-rgb),.35)!important;
}
.oa360-button-outline .elementor-button{
  background:transparent!important;color:var(--white)!important;
  border:1px solid rgba(var(--white-rgb),.2)!important;
  border-radius:999px!important;padding:16px 40px!important;
  transition:border-color .3s,color .3s,transform .3s!important;
}
.oa360-button-outline .elementor-button:hover{
  border-color:var(--gold)!important;color:var(--gold)!important;
  transform:translateY(-2px)!important;
}

/* ═══════════════════════════════════════
   STAT COUNTERS
   ═══════════════════════════════════════ */
.oa360-stat .elementor-counter-number-wrapper{color:var(--gold);font-family:'Lato',sans-serif;font-size:clamp(44px,5vw,74px);font-weight:900}
.oa360-stat .elementor-counter-title{color:rgba(var(--white-rgb),.48);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}

/* ═══════════════════════════════════════
   LOGO ORBIT
   ═══════════════════════════════════════ */
.oa360-logo-orbit{position:relative;display:flex;align-items:center;justify-content:center;min-height:420px}
.oa360-logo-orbit .elementor-widget-container{position:relative;display:flex;align-items:center;justify-content:center}
.oa360-logo-orbit img{max-width:180px;margin:0 auto;position:relative;z-index:3;animation:oa-logo-glow 4s ease-in-out infinite}
@keyframes oa-logo-glow{0%,100%{filter:drop-shadow(0 0 40px rgba(var(--gold-rgb),.15))}50%{filter:drop-shadow(0 0 80px rgba(var(--gold-rgb),.35))}}
.oa360-logo-orbit .elementor-widget-container::before{
  content:"";position:absolute;width:320px;height:320px;
  border:1px solid rgba(var(--gold-rgb),.1);border-radius:50%;
  top:50%;left:50%;transform:translate(-50%,-50%);
  animation:oa-orbit-spin 18s linear infinite;z-index:1;
  background:radial-gradient(circle 5px at 50% 0%,var(--gold) 0%,var(--gold) 40%,transparent 60%);
}
.oa360-logo-orbit .elementor-widget-container::after{
  content:"";position:absolute;width:240px;height:240px;
  border:1px solid rgba(var(--gold-rgb),.07);border-radius:50%;
  top:50%;left:50%;transform:translate(-50%,-50%);
  animation:oa-orbit-spin-r 12s linear infinite;z-index:1;
  background:radial-gradient(circle 4px at 50% 0%,rgba(var(--gold-rgb),.7) 0%,rgba(var(--gold-rgb),.7) 40%,transparent 60%);
}
.oa360-orbit-ring3{position:absolute;width:160px;height:160px;border:1px dashed rgba(var(--gold-rgb),.08);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);animation:oa-orbit-spin 25s linear infinite;z-index:1}
.oa360-orbit-glow{position:absolute;width:380px;height:380px;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(var(--gold-rgb),.06) 0%,transparent 70%);animation:oa-glow-pulse 5s ease-in-out infinite;z-index:0}
@keyframes oa-orbit-spin{0%{transform:translate(-50%,-50%) rotate(0deg)}100%{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes oa-orbit-spin-r{0%{transform:translate(-50%,-50%) rotate(0deg)}100%{transform:translate(-50%,-50%) rotate(-360deg)}}
@keyframes oa-glow-pulse{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.6}50%{transform:translate(-50%,-50%) scale(1.08);opacity:1}}

/* ═══════════════════════════════════════
   TICKER
   ═══════════════════════════════════════ */
.oa360-ticker{overflow:hidden;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.oa360-ticker .elementor-widget-container{white-space:nowrap;color:rgba(var(--white-rgb),.5);font-family:'Lato',sans-serif;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;animation:oa-ticker 12s linear infinite}
@keyframes oa-ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ═══════════════════════════════════════
   CONTACT FORM
   ═══════════════════════════════════════ */
.oa360-contact-form{color:var(--white)}
.oa360-contact-form .oa360-form-row{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.oa360-contact-form label{display:block;margin:0 0 6px;color:var(--muted);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.oa360-contact-form input,.oa360-contact-form textarea,.oa360-contact-form select{
  width:100%;min-height:48px;margin:0 0 16px;padding:12px 14px;
  border:1px solid var(--border);border-radius:6px;
  background:var(--bg);color:var(--white);font-family:inherit;font-size:14px;
  transition:border-color .3s,box-shadow .3s;-webkit-appearance:none;
}
.oa360-contact-form input:focus,.oa360-contact-form textarea:focus,.oa360-contact-form select:focus{
  outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(var(--gold-rgb),.1);
}
.oa360-contact-form textarea{min-height:128px;resize:vertical}
.oa360-contact-form button{
  border:0;border-radius:999px;background:var(--gold);color:var(--black);
  font-weight:800;padding:16px 40px;font-size:14px;letter-spacing:.03em;text-transform:uppercase;
  transition:transform .4s var(--ease-spring),box-shadow .4s;cursor:pointer;
}
.oa360-contact-form button:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(var(--gold-rgb),.3)}

/* ═══════════════════════════════════════
   SCROLLBAR
   ═══════════════════════════════════════ */
body.oneaxis360-phlox::-webkit-scrollbar{width:5px}
body.oneaxis360-phlox::-webkit-scrollbar-track{background:var(--bg)}
body.oneaxis360-phlox::-webkit-scrollbar-thumb{background:rgba(var(--gold-rgb),.25);border-radius:3px}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — TABLET (≤1024px)
   ═══════════════════════════════════════════════════════════════ */
@media(max-width:1024px){
  :root{--nav-h:64px}
  .oa360-hero-x{font-size:clamp(160px,32vw,350px);right:-6vw}
  .oa360-logo-orbit{min-height:340px}
  .oa360-logo-orbit img{max-width:140px}
  .oa360-logo-orbit .elementor-widget-container::before{width:260px;height:260px}
  .oa360-logo-orbit .elementor-widget-container::after{width:190px;height:190px}
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — MOBILE (≤768px)
   ═══════════════════════════════════════════════════════════════ */
@media(max-width:768px){
  :root{--nav-h:60px}
  body.oneaxis360-phlox{font-size:15px}

  /* Compact sections */
  body.oneaxis360-phlox .elementor-section{
    padding-top:48px!important;padding-bottom:48px!important;
  }
  body.oneaxis360-phlox .elementor-section>.elementor-container{
    padding-left:20px!important;padding-right:20px!important;
  }

  /* Hero */
  .oa360-hero-section{min-height:85vh!important}
  .oa360-hero-x{display:none}

  /* Show carousel, hide desktop grid */
  .oa360-carousel{display:flex!important}
  .oa360-carousel-dots{display:flex!important}
  .oa360-services-row{display:none!important}

  /* 2-col grid for pillars/process/stats */
  .oa360-pillars .elementor-container,
  .oa360-process .elementor-container,
  .oa360-stats .elementor-container{
    display:flex!important;flex-wrap:wrap!important;
  }
  .oa360-pillars .elementor-column,
  .oa360-process .elementor-column,
  .oa360-stats .elementor-column{
    width:48%!important;max-width:48%!important;flex:none!important;margin:0 1% 12px!important;
  }

  /* Cards compact */
  .oa360-card,.oa360-service-card,.oa360-step-card{padding:20px 16px!important}

  /* Logo orbit */
  .oa360-logo-orbit{min-height:260px}
  .oa360-logo-orbit img{max-width:100px}
  .oa360-logo-orbit .elementor-widget-container::before{width:200px;height:200px}
  .oa360-logo-orbit .elementor-widget-container::after{width:150px;height:150px}
  .oa360-orbit-glow{width:230px;height:230px}

  /* Form */
  .oa360-contact-form .oa360-form-row{grid-template-columns:1fr}

  /* Smaller reveals */
  .oa360-reveal{transform:translateY(24px)}
  .oa360-reveal-left{transform:translateX(-24px)}
  .oa360-reveal-right{transform:translateX(24px)}

  /* Headings */
  .elementor-heading-title{font-size:clamp(24px,6vw,38px)!important;line-height:1.2!important}
  .oa360-lead,.oa360-lead p{font-size:14px!important;line-height:1.7!important}
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — SMALL PHONES (≤480px)
   ═══════════════════════════════════════════════════════════════ */
@media(max-width:480px){
  body.oneaxis360-phlox{font-size:14px}

  body.oneaxis360-phlox .elementor-section{
    padding-top:36px!important;padding-bottom:36px!important;
  }
  body.oneaxis360-phlox .elementor-section>.elementor-container{
    padding-left:16px!important;padding-right:16px!important;
  }

  .oa360-hero-section{min-height:75vh!important}

  /* Carousel cards slightly wider */
  .oa360-carousel-card{flex:0 0 80%}

  /* Full width buttons */
  .oa360-button-gold .elementor-button,
  .oa360-button-outline .elementor-button{
    width:100%!important;padding:14px 20px!important;text-align:center!important;
  }

  /* Stats */
  .oa360-stat .elementor-counter-number-wrapper{font-size:clamp(32px,9vw,48px)}

  .oa360-logo-orbit{min-height:200px}
  .oa360-logo-orbit img{max-width:80px}
  .oa360-logo-orbit .elementor-widget-container::before{width:160px;height:160px}
  .oa360-logo-orbit .elementor-widget-container::after{width:120px;height:120px}

  .elementor-heading-title{font-size:clamp(20px,5.5vw,30px)!important}

  /* Reduce animation for battery */
  .oa360-reveal{transition-duration:.6s;transform:translateY(16px)}
}

/* ═══════════════════════════════════════
   REDUCED MOTION
   ═══════════════════════════════════════ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .oa360-reveal,.oa360-reveal-left,.oa360-reveal-right,.oa360-reveal-scale{opacity:1!important;transform:none!important}
  .oa-preloader{display:none!important}
  .oa360-ticker .elementor-widget-container{animation:none}
  .oa360-split-char,.oa360-split-word{opacity:1!important;transform:none!important}
}

/* ═══════════════════════════════════════
   PRINT
   ═══════════════════════════════════════ */
@media print{.oa-preloader,.oa-progress,.oa-cur,.oa-ring,.oa-particles,.oa360-hero-video{display:none!important}body.oneaxis360-phlox{background:#fff!important;color:#000!important}}