:root{
  --text:#0f172a;
  --muted:#64748b;
  --line:rgba(15,23,42,.12);
  --soft:#f6f7fb;
  --shadow: 0 18px 60px rgba(15,23,42,.10);
  --shadow2: 0 10px 30px rgba(15,23,42,.08);
  --radius: 18px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
  background: #ffffff;
}
.hero-bg {
    filter: brightness(.69) grayscale() invert();
}
.rounded-pill {
    border-radius: 5px ! IMPORTANT;
}
/* Navbar */
.site-header {
    position: sticky;
    top: 0;
    z-index: 999;
    background: transparent;
    transition: blur(14px);
    border-bottom: 1px solid rgba(15, 23, 42, .06);
}
.bg-white {
    --bs-bg-opacity: 1;
    background-color: #ffffff30 !IMPORTANT;
    backdrop-filter: blur(7px);

}
.team-slide:hover .team-media img {
    transform: scale(1.1) rotate(-5deg);
}
.team-media img {
    transition: 0.5s;
}
.brand-logo {
    width: 130px;
    height: 40px;
    object-fit: contain;
}

/* HERO */
.hero{
  position: relative;
  min-height: 90vh;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(800px 420px at 50% 10%, rgba(0,0,0,.08), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,1));
  border-bottom: 1px solid rgba(15,23,42,.06);
}

.hero-bg{position:absolute; inset:0; pointer-events:none}
.hero-video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit: cover;
  opacity: .18;
  filter: grayscale(1) contrast(1.1);
}
.hero-overlay {
    position: absolute;
    inset: 0;
   /* background: radial-gradient(50% 50% at 50% 50%, #fff0 0%, var(--token-d4c0a0e6-8fba-45bc-8f6f-215e608cd0df, #fff) 100%); */
}
.hero-content-wrap{position:relative; z-index:2; padding: 80px 0 60px}

/* Onload hero animation */
.hero-animate{
  opacity:0;
  transform: translateY(16px) scale(.98);
  transition: opacity .9s ease, transform .9s ease;
}
body.is-loaded .hero-animate{
  opacity:1;
  transform: translateY(0) scale(1);
}

.pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 8px 14px;
  border-radius:999px;
  border: 1px solid rgba(15,23,42,.12);
  background: rgba(255,255,255,.7);
  color: rgba(15,23,42,.78);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.orb-wrap{
  width: 160px;
  height: 160px;
  margin: 0 auto;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, rgba(0,0,0,.08), transparent 60%);
  display:flex;
  align-items:center;
  justify-content:center;
}
.orb-img {
    width: 340px;
    height: 140px;
    object-fit: contain;
    filter: drop-shadow(0 25px 45px rgba(0, 0, 0, .15));
}
.hero-sub{font-size: 18px}

/* Quote */
.quote-text {
    max-width: 780px;
    font-size: 35px;
    line-height: 1.7;
    color: #000;
}
/* Sections */
.section-soft{
  background: var(--soft);
  border-top: 1px solid rgba(15,23,42,.06);
  border-bottom: 1px solid rgba(15,23,42,.06);
}

.section-kicker{
  display:inline-block;
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(15,23,42,.55);
  margin-bottom: 8px;
}

.section-title{
  font-weight: 800;
  letter-spacing: -0.4px;
}



/* ===== WHY CHOOSE US (Neumorphic section) ===== */

.why-section{
  background: #f6f7fb;
  border-top: 1px solid rgba(15,23,42,.06);
  border-bottom: 1px solid rgba(15,23,42,.06);
}

.why-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 8px 14px;
  border-radius: 999px;
  background: #f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    10px 10px 24px rgba(15,23,42,.08),
    -10px -10px 24px rgba(255,255,255,.9);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(15,23,42,.65);
}
.why-badge .star{font-size: 12px; opacity:.8}

.why-title{
  font-weight: 800;
  letter-spacing: -0.6px;
  font-size: clamp(30px, 4vw, 54px);
  color: rgba(15,23,42,.92);
}
.why-subtitle{
  color: rgba(15,23,42,.55);
  font-size: 15px;
}

/* Neumorphic Card */
.neo-card{
  background: #f6f7fb;
  border-radius: 22px;
  border: 1px solid rgba(15,23,42,.06);
  box-shadow:
    14px 14px 34px rgba(15,23,42,.10),
    -14px -14px 34px rgba(255,255,255,.92);
  overflow:hidden;
}

.neo-figure{
  height: 220px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 18px;
}

.neo-body{
  padding: 18px 20px 22px;
}
.neo-title{
  font-weight: 800;
  letter-spacing: -0.2px;
  margin-bottom: 8px;
}
.neo-text{
  color: rgba(15,23,42,.60);
  line-height: 1.6;
  font-size: 14px;
}

/* Pills row */
.why-pills{
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
}
.pill-chip{
  display:inline-flex;
  align-items:center;
  padding: 10px 14px;
  border-radius: 999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    10px 10px 24px rgba(15,23,42,.08),
    -10px -10px 24px rgba(255,255,255,.92);
  color: rgba(15,23,42,.70);
  font-size: 13px;
  font-weight: 600;
}

/* ===== Card 1: Dial ===== */
.dial{
  width: 170px; height: 170px;
  border-radius: 999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.06);
  box-shadow:
    inset 10px 10px 22px rgba(15,23,42,.08),
    inset -10px -10px 22px rgba(255,255,255,.92),
    14px 14px 34px rgba(15,23,42,.10),
    -14px -14px 34px rgba(255,255,255,.92);
  position: relative;
}
.dial .dot{
  width: 12px; height: 12px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(15,23,42,.06);
  box-shadow: 6px 6px 14px rgba(15,23,42,.10);
  position:absolute;
}
.dial .d1{top:28px; left:44px;}
.dial .d2{top:36px; right:42px;}
.dial .d3{bottom:40px; right:52px;}
.dial .hand{
  position:absolute;
  width: 84px; height: 10px;
  border-radius: 999px;
  background:#fff;
  border:1px solid rgba(15,23,42,.06);
  left: 50%;
  top: 50%;
  transform-origin: 10px 50%;
  transform: translate(-10px, -50%) rotate(-18deg);
  box-shadow: 10px 10px 22px rgba(15,23,42,.10);
}
.dial .hand-cap{
  width: 10px; height: 10px;
  border-radius:999px;
  background: rgba(15,23,42,.90);
  position:absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* ===== Card 2: Chart ===== */
.chart-wrap{
  width: 100%;
  max-width: 340px;
  height: 180px;
  border-radius: 18px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.06);
  box-shadow:
    inset 10px 10px 22px rgba(15,23,42,.08),
    inset -10px -10px 22px rgba(255,255,255,.92);
  position: relative;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding: 18px 18px 16px;
}

.chart-wrap .bars{
  width: 100%;
  display:flex;
  gap:14px;
  align-items:flex-end;
  justify-content:center;
  padding-top: 26px;
}
.chart-wrap .bar{
  width: 42px;
  border-radius: 12px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.06);
  box-shadow:
    10px 10px 22px rgba(15,23,42,.10),
    -10px -10px 22px rgba(255,255,255,.92);
}
.chart-wrap .b1{height:70px}
.chart-wrap .b2{height:92px}
.chart-wrap .b3{height:110px}
.chart-wrap .b4{height:98px}
.chart-wrap .b5{height:140px}

.chart-wrap .tag{
  position:absolute;
  padding: 8px 12px;
  border-radius: 999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    10px 10px 24px rgba(15,23,42,.08),
    -10px -10px 24px rgba(255,255,255,.92);
  font-size: 12px;
  color: rgba(15,23,42,.70);
  font-weight: 600;
}
.chart-wrap .tag.top.left{top: 10px; left: 50%; transform: translateX(-50%);}
.chart-wrap .tag.top.right{top: -10px; right: 14px;}
.chart-wrap .tag.side{
  left: -12px;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: left center;
  padding: 7px 10px;
  font-size: 11px;
  letter-spacing: .12em;
}

/* ===== Card 3: Sync ===== */
.sync-wrap{
  width: 100%;
  max-width: 340px;
  height: 180px;
  position: relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.sync-core{
  width: 110px; height: 110px;
  border-radius: 999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.06);
  box-shadow:
    inset 10px 10px 22px rgba(15,23,42,.08),
    inset -10px -10px 22px rgba(255,255,255,.92),
    14px 14px 34px rgba(15,23,42,.10),
    -14px -14px 34px rgba(255,255,255,.92);
  display:flex;
  align-items:center;
  justify-content:center;
}
.sync-mark{
  width: 42px; height: 42px;
  border-radius: 14px;
  background: rgba(15,23,42,.92);
  transform: rotate(45deg);
  box-shadow: 10px 10px 22px rgba(15,23,42,.12);
}
.user{
  width: 54px; height: 44px;
  border-radius: 14px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    10px 10px 24px rgba(15,23,42,.10),
    -10px -10px 24px rgba(255,255,255,.92);
  position:absolute;
}
.user::after{
  content:"";
  position:absolute;
  width: 14px; height: 14px;
  border-radius: 999px;
  background: rgba(15,23,42,.92);
  top: 12px; left: 50%;
  transform: translateX(-50%);
}
.user::before{
  content:"";
  position:absolute;
  width: 22px; height: 10px;
  border-radius: 999px;
  background: rgba(15,23,42,.92);
  bottom: 10px; left: 50%;
  transform: translateX(-50%);
}
.user.u1{left: 18px; top: 68px;}
.user.u2{left: 50%; bottom: 18px; transform: translateX(-50%);}
.user.u3{right: 18px; top: 78px;}

/* ===== Moving Pills (Marquee) with side fade shade ===== */

.why-marquee-wrap{
  position: relative;
  overflow: hidden;
  padding: 6px 0;
  /* same background as section for seamless fade */
  background: #f6f7fb;
}

/* Side fade shade (overlay) */
.why-marquee-wrap::before,
.why-marquee-wrap::after{
  content:"";
  position:absolute;
  top:0; bottom:0;
  width: 110px;
  z-index: 3;
  pointer-events:none;
}
.why-marquee-wrap::before{
  left:0;
  background: linear-gradient(90deg, #f6f7fb 0%, rgba(246,247,251,0) 100%);
}
.why-marquee-wrap::after{
  right:0;
  background: linear-gradient(270deg, #f6f7fb 0%, rgba(246,247,251,0) 100%);
}

.why-marquee {
    display: flex;
    width: 100%;
    gap: 18px;
    overflow: hidden;
    padding: 30px 0px;
}

/* Each track moves left continuously */
.why-track{
  display:flex;
  align-items:center;
  gap: 14px;
  white-space: nowrap;
  will-change: transform;
  animation: why-marquee-move 28s linear infinite;
}
section#features .row.g-4.justify-content-center.mt-4 {
    padding-bottom: 20px;
}
/* make 2nd track start after first (seamless loop) */
.why-track[aria-hidden="true"]{
  animation-delay: -14s; /* half of duration */
}

/* Smooth move */
@keyframes why-marquee-move{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

/* Pills style (keeps your neumorphic look) */
.pill-chip{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: 999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    10px 10px 24px rgba(15,23,42,.08),
    -10px -10px 24px rgba(255,255,255,.92);
  color: rgba(15,23,42,.70);
  font-size: 13px;
  font-weight: 600;
}

/* Icon look (bigger + neumorph bubble) */
.pill-ico{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    inset 6px 6px 12px rgba(15,23,42,.08),
    inset -6px -6px 12px rgba(255,255,255,.92);
  font-size: 14px;
  line-height: 1;
}

/* Optional: pause on hover */
.why-marquee-wrap:hover .why-track{
  animation-play-state: paused;
}

/* Responsive fade width */
@media (max-width: 768px){
  .why-marquee-wrap::before,
  .why-marquee-wrap::after{ width: 70px; }
  .pill-chip{ padding: 9px 14px; font-size: 12px; }
  .pill-ico{ width: 26px; height: 26px; }
}

/* Footer */
.site-footer{
  background: #fff;
  border-top: 1px solid rgba(15,23,42,.08);
}
.footer-link{
  display:block;
  color: rgba(15,23,42,.65);
  text-decoration: none;
  margin: 6px 0;
}
.footer-link:hover{color: rgba(15,23,42,.95)}

/* Responsive */
@media (max-width: 991px){
  .hero-content-wrap{padding: 70px 0 50px}
  .orb-wrap{width: 140px; height: 140px}
  .orb-img{width: 120px; height: 120px}
}

/* ===== All Features Section ===== */
.features-section{
  background: #ffffff;
}

/* small top pill like screenshot */
.section-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 8px 14px;
  border-radius: 999px;
  background: #f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 10px 10px 24px rgba(15,23,42,.08), -10px -10px 24px rgba(255,255,255,.92);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(15,23,42,.65);
}
.pill-dot{
  width: 8px; height: 8px;
  border-radius: 999px;
  background: rgba(15,23,42,.55);
}

/* Cards */
.feature-card{
  border-radius: 22px;
  background: #f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  overflow:hidden;
  height:100%;
}

.feature-card--split{
  display:grid;
  grid-template-columns: 320px 1fr;
}

.feature-card--reverse{
  grid-template-columns: 1fr 320px;
}
.feature-card--reverse .feature-media{order:2}
.feature-card--reverse .feature-content{order:1}

.feature-media{
  padding: 18px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.feature-media img{
  width: 100%;
  height: 210px;
  object-fit: cover;
  border-radius: 18px;
  box-shadow: 10px 10px 24px rgba(15,23,42,.10);
}

.feature-content{
  padding: 26px 26px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap: 10px;
}

/* icon box like screenshot */
.feature-icon{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: #111827;
  color: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow: 10px 10px 24px rgba(15,23,42,.18);
}
.feature-icon span{
  font-size: 16px;
  line-height: 1;
}

/* micro hover (premium feel) */
.feature-card{
  transition: transform .25s ease, box-shadow .25s ease;
}
.feature-card:hover{
  transform: translateY(-4px);
  box-shadow: 18px 18px 50px rgba(15,23,42,.12), -18px -18px 50px rgba(255,255,255,.96);
}

/* responsive */
@media (max-width: 991px){
  .feature-card--split,
  .feature-card--reverse{
    grid-template-columns: 1fr;
  }
  .feature-media{padding-bottom: 0}
  .feature-media img{height: 230px}
  .feature-card--reverse .feature-media{order:0}
  .feature-card--reverse .feature-content{order:0}
}

/* =======================================================================
   OUR AI-DRIVEN SERVICES (FULL CSS) + ALWAYS-ON ANIMATIONS
   Replace your services-section CSS with this complete block.
   (Works with the HTML I shared for the Services section)
   ======================================================================= */

/* Section wrapper */
.services-section{
  background:#ffffff;
}

/* Card shell (neumorphic) */
.svc-card{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow:
    14px 14px 34px rgba(15,23,42,.10),
    -14px -14px 34px rgba(255,255,255,.92);
  overflow:hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}
.svc-card:hover{
  transform: translateY(-4px);
  box-shadow:
    18px 18px 55px rgba(15,23,42,.12),
    -18px -18px 55px rgba(255,255,255,.96);
}

/* Mock area + body */
.svc-mock{
  height: 210px;
  padding: 18px;
  position: relative;
}
.svc-body{
  padding: 18px 20px 22px;
}
.svc-body p{ line-height:1.6; }

/* =======================================================================
   MOCK 1: AI Strategy (nodes + dots + lines)
   ======================================================================= */
.svc-mock--nodes{
  display:flex;
  align-items:center;
  justify-content:center;
}

/* Nodes */
.node{
  width: 74px;
  height: 74px;
  border-radius: 999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    12px 12px 26px rgba(15,23,42,.10),
    -12px -12px 26px rgba(255,255,255,.92);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
}
.node span{
  font-size:22px;
  color: rgba(15,23,42,.92);
}
.node-a{ position:absolute; left: 34px; top: 28px; }
.node-b{
  position:absolute; right: 54px; top: 72px;
  width: 92px; height: 92px;
}

/* Small dots */
.dot{
  width: 22px;
  height: 22px;
  border-radius:999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    10px 10px 22px rgba(15,23,42,.10),
    -10px -10px 22px rgba(255,255,255,.92);
  position:absolute;
}
.d1{ left: 110px; top: 58px; }
.d2{ left: 84px; top: 108px; }
.d3{ left: 160px; top: 124px; }

/* Connection lines */
.link{
  position:absolute;
  height: 4px;
  background: rgba(15,23,42,.10);
  border-radius: 999px;
  box-shadow: inset 2px 2px 6px rgba(15,23,42,.10);
}
.l1{ left: 88px; top: 82px; width: 140px; transform: rotate(18deg); }
.l2{ left: 98px; top: 122px; width: 110px; transform: rotate(-18deg); }

/* =======================================================================
   MOCK 2: Content Generation (input + dropdown + button)
   ======================================================================= */
.svc-mock--generate{
  display:flex;
  flex-direction:column;
  gap: 12px;
}

/* top row */
.gen-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
}

/* input */
.gen-input{
  flex: 1;
  height: 44px;
  border-radius: 14px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    inset 10px 10px 22px rgba(15,23,42,.08),
    inset -10px -10px 22px rgba(255,255,255,.92);
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 0 14px;
}
.gen-dot{
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 2px solid rgba(15,23,42,.28);
}
.gen-line{
  width: 120px;
  height: 8px;
  border-radius: 999px;
  background: rgba(15,23,42,.12);
}

/* generate button */
.gen-btn{
  border: 0;
  height: 38px;
  padding: 0 18px;
  border-radius: 999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    10px 10px 22px rgba(15,23,42,.10),
    -10px -10px 22px rgba(255,255,255,.92);
  font-weight: 700;
  color: rgba(15,23,42,.85);
  cursor: default;
}
.gen-btn:active{ transform: translateY(1px); }

/* dropdown menu */
.gen-menu{
  width: min(520px, 100%);
  border-radius: 18px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    12px 12px 26px rgba(15,23,42,.10),
    -12px -12px 26px rgba(255,255,255,.92);
  padding: 10px 0;
}
.gen-item{
  padding: 10px 14px;
  color: rgba(15,23,42,.55);
  font-size: 13px;
}
.gen-item + .gen-item{
  border-top: 1px solid rgba(15,23,42,.06);
}

/* =======================================================================
   MOCK 3: Chatbots (bubble + input)
   ======================================================================= */
.svc-mock--chat{
  display:flex;
  align-items:flex-end;
  justify-content:center;
}

/* top bubble */
.chat-bubble{
  position:absolute;
  top: 22px;
  width: min(560px, 92%);
  padding: 12px 14px;
  border-radius: 14px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    12px 12px 26px rgba(15,23,42,.10),
    -12px -12px 26px rgba(255,255,255,.92);
  font-size: 12.5px;
  color: rgba(15,23,42,.60);
}

/* user square */
.chat-user{
  position:absolute;
  right: 10px;
  top: 10px;
  width: 24px;
  height: 24px;
  border-radius: 10px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    8px 8px 16px rgba(15,23,42,.10),
    -8px -8px 16px rgba(255,255,255,.92);
}

/* input at bottom */
.chat-input{
  width: min(560px, 92%);
  height: 46px;
  border-radius: 999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    inset 10px 10px 22px rgba(15,23,42,.08),
    inset -10px -10px 22px rgba(255,255,255,.92);
  display:flex;
  align-items:center;
  padding: 0 18px;
}
.chat-placeholder{
  color: rgba(15,23,42,.40);
  font-size: 13px;
}

/* =======================================================================
   MOCK 4: Workflows (hub + mini icons)
   ======================================================================= */
.svc-mock--workflow{
  display:flex;
  align-items:center;
  justify-content:center;
}

/* hub center */
.hub{
  width: 92px;
  height: 92px;
  border-radius: 22px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    12px 12px 26px rgba(15,23,42,.10),
    -12px -12px 26px rgba(255,255,255,.92);
  display:flex;
  align-items:center;
  justify-content:center;
}
.hub-mark{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: rgba(15,23,42,.92);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
}

/* mini icons around */
.mini{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow:
    10px 10px 22px rgba(15,23,42,.10),
    -10px -10px 22px rgba(255,255,255,.92);
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(15,23,42,.75);
  font-weight: 800;
}
.mini-1{ left: 24px; top: 28px; }
.mini-2{ left: 70px; bottom: 26px; }
.mini-3{ right: 28px; top: 32px; }
.mini-4{ right: 74px; bottom: 28px; }

/* =======================================================================
   ALWAYS-ON ANIMATIONS (keep running forever)
   ======================================================================= */

/* 1) Floating movement */
@keyframes floatY{
  0%{ transform: translateY(0px); }
  50%{ transform: translateY(-8px); }
  100%{ transform: translateY(0px); }
}

/* Nodes float */
.node-a{ animation: floatY 6s ease-in-out infinite; }
.node-b{ animation: floatY 7s ease-in-out infinite; }

/* Dots float lightly (different timing for natural feel) */
.d1{ animation: floatY 5.5s ease-in-out infinite; }
.d2{ animation: floatY 6.5s ease-in-out infinite; }
.d3{ animation: floatY 7.5s ease-in-out infinite; }

/* Mini workflow icons float */
.mini-1{ animation: floatY 5s ease-in-out infinite; }
.mini-2{ animation: floatY 6s ease-in-out infinite; }
.mini-3{ animation: floatY 7s ease-in-out infinite; }
.mini-4{ animation: floatY 5.5s ease-in-out infinite; }

/* 2) Line pulse (subtle) */
@keyframes pulseLine{
  0%{ opacity:.35; }
  50%{ opacity:.9; }
  100%{ opacity:.35; }
}
.link{ animation: pulseLine 4s ease-in-out infinite; }

/* 3) Generate button soft pulse */
@keyframes softPulse{
  0%{
    box-shadow: 10px 10px 22px rgba(15,23,42,.10),
               -10px -10px 22px rgba(255,255,255,.92);
  }
  50%{
    box-shadow: 14px 14px 35px rgba(15,23,42,.15),
               -14px -14px 35px rgba(255,255,255,.98);
  }
  100%{
    box-shadow: 10px 10px 22px rgba(15,23,42,.10),
               -10px -10px 22px rgba(255,255,255,.92);
  }
}
.gen-btn{ animation: softPulse 4s ease-in-out infinite; }

/* 4) Chat input breathing effect */
@keyframes breathe{
  0%{
    box-shadow: inset 10px 10px 22px rgba(15,23,42,.08),
               inset -10px -10px 22px rgba(255,255,255,.92);
  }
  50%{
    box-shadow: inset 14px 14px 30px rgba(15,23,42,.12),
               inset -14px -14px 30px rgba(255,255,255,.98);
  }
  100%{
    box-shadow: inset 10px 10px 22px rgba(15,23,42,.08),
               inset -10px -10px 22px rgba(255,255,255,.92);
  }
}
.chat-input{ animation: breathe 5s ease-in-out infinite; }

/* 5) Hub mark slow rotation */
@keyframes slowRotate{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}
.hub-mark{ animation: slowRotate 12s linear infinite; }

/* =======================================================================
   RESPONSIVE
   ======================================================================= */
@media (max-width: 991px){
  .svc-mock{ height: 200px; }
}

/* Accessibility: Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  *{ animation: none !important; transition: none !important; }
}


/* ===== Simple & Scalable (Process) ===== */
.process-section{
  background: #f6f7fb;
  border-top: 1px solid rgba(15,23,42,.06);
  border-bottom: 1px solid rgba(15,23,42,.06);
}

/* Card style (same neumorphic premium) */
.proc-card{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  overflow:hidden;
  padding: 18px;
  height: 100%;
  transition: transform .25s ease, box-shadow .25s ease;
}
.proc-card:hover{
  transform: translateY(-4px);
  box-shadow: 18px 18px 55px rgba(15,23,42,.12), -18px -18px 55px rgba(255,255,255,.96);
}

/* top header */
.proc-top{
  display:flex;
  gap: 14px;
  align-items:flex-start;
}
.proc-ic{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: rgba(15,23,42,.92);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow: 10px 10px 24px rgba(15,23,42,.18);
  flex: 0 0 auto;
}
.proc-ic span{font-size: 16px; line-height:1}

.proc-toptext p{
  line-height: 1.55;
}

/* divider line */
.proc-line{
  border:0;
  height: 1px;
  background: rgba(15,23,42,.08);
  margin: 14px 0;
}

/* number row */
.proc-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.proc-num{
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.4px;
  color: rgba(15,23,42,.92);
}
.proc-dots{
  display:flex;
  gap: 6px;
  align-items:center;
}
.proc-dots span{
  width: 5px; height: 5px;
  border-radius: 999px;
  background: rgba(15,23,42,.55);
  opacity: .7;
}

/* media */
.proc-media{
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 10px 10px 24px rgba(15,23,42,.10);
}
.proc-media img {
    width: 100%;
    height: 650px;
    object-fit: cover;
    display: block;
}
.proc-media--short img{
  height: 220px;
}

/* responsive */
@media (max-width: 991px){
  .proc-media img{ height: 320px; }
  .proc-media--short img{ height: 240px; }
}

/* ===== Projects / Proven Impact ===== */
.projects-section{
  background:#ffffff;
}

.projects-shell{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 26px;
  box-shadow: 18px 18px 60px rgba(15,23,42,.10), -18px -18px 60px rgba(255,255,255,.95);
  padding: 18px;
}

/* Tabs bar */
.project-tabs{
  gap: 14px;
  justify-content: space-between;
  flex-wrap: nowrap;
}
.project-tabs .nav-item{
  flex: 1 1 0;
}
.project-tabs .nav-link{
  width: 100%;
  border: 0;
  background: #f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 14px;
  padding: 12px 10px;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(15,23,42,.55);
  box-shadow: 12px 12px 26px rgba(15,23,42,.10), -12px -12px 26px rgba(255,255,255,.92);
  transition: transform .2s ease, box-shadow .2s ease, color .2s ease;
}
.project-tabs .nav-link:hover{
  transform: translateY(-2px);
  color: rgba(15,23,42,.75);
}
.project-tabs .nav-link.active{
  background: #ffffff;
  color: rgba(15,23,42,.92);
  box-shadow: 16px 16px 34px rgba(15,23,42,.12), -16px -16px 34px rgba(255,255,255,.96);
}

/* Inner content spacing */
.project-tabcontent{
  padding: 10px 6px 6px;
}

/* Media */
.project-media{
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 16px 16px 40px rgba(15,23,42,.12);
  background:#fff;
}
.project-media img{
  width:100%;
  height: 360px;
  object-fit: cover;
  display:block;
}

/* Info */
.project-info{
  padding: 10px 6px;
}
.project-no{
  font-weight: 800;
  color: rgba(15,23,42,.70);
  margin-bottom: 10px;
}

/* Metrics */
.metric-card{
  background:#ffffff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  padding: 16px 14px;
  text-align:center;
  box-shadow: 14px 14px 32px rgba(15,23,42,.10), -14px -14px 32px rgba(255,255,255,.96);
}
.metric-val{
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -0.4px;
  color: rgba(15,23,42,.92);
}
.metric-lbl{
  font-size: 13px;
  color: rgba(15,23,42,.55);
}

/* Responsive tabs */
@media (max-width: 991px){
  .project-tabs{
    flex-wrap: wrap;
  }
  .project-tabs .nav-item{
    flex: 1 1 calc(50% - 14px);
  }
  .project-media img{
    height: 280px;
  }
}

/* Mobile */
@media (max-width: 575px){
  .project-tabs .nav-item{
    flex: 1 1 100%;
  }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce){
  .project-tabs .nav-link{ transition:none !important; }
}


/* ===== Testimonials Section ===== */
.testi-section{
  background:#ffffff;
}

/* Top big quote card */
.testi-hero-card{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  padding: 34px 28px;
  position: relative;
  overflow:hidden;
}

.testi-hero-text{
  font-size: 20px;
  line-height: 1.65;
  color: rgba(15,23,42,.92);
  text-align: center;
  max-width: 520px;
  margin: 0 auto;
}
.testi-hero-text .muted{
  color: rgba(15,23,42,.45);
  font-weight: 700;
}

.testi-quote-mark{
  position:absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  font-size: 46px;
  font-weight: 900;
  color: rgba(15,23,42,.90);
  opacity: .95;
}

/* Media card */
.testi-media-card{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  padding: 14px;
  overflow:hidden;
}
.testi-media-card img{
  width: 100%;
  height: 100%;
  max-height: 260px;
  object-fit: cover;
  border-radius: 18px;
  display:block;
}

/* Small testimonial cards */
.testi-card{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  padding: 22px 20px;
  transition: transform .25s ease, box-shadow .25s ease;
}
.testi-card:hover{
  transform: translateY(-4px);
  box-shadow: 18px 18px 55px rgba(15,23,42,.12), -18px -18px 55px rgba(255,255,255,.96);
}

/* stars */
.stars{
  font-size: 14px;
  letter-spacing: 2px;
  margin-bottom: 12px;
  color: rgba(15,23,42,.92);
}
.star-off{
  color: rgba(15,23,42,.25);
}

/* user row */
.testi-user{
  display:flex;
  gap: 12px;
  align-items:center;
}
.testi-user img{
  width: 44px;
  height: 44px;
  border-radius: 12px;
  object-fit: cover;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 10px 10px 22px rgba(15,23,42,.10), -10px -10px 22px rgba(255,255,255,.92);
}

/* bottom stats row */
.stats-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 18px;
  padding: 10px 6px 0;
}
.stat-item{
  flex: 1;
  text-align:center;
}
.stat-val{
  font-size: 34px;
  font-weight: 900;
  letter-spacing: -0.6px;
  color: rgba(15,23,42,.92);
}
.stat-lbl{
  font-size: 13px;
  color: rgba(15,23,42,.55);
}
.stat-sep{
  width: 1px;
  height: 48px;
  background: rgba(15,23,42,.12);
}

/* responsive */
@media (max-width: 991px){
  .testi-hero-text{ font-size: 18px; }
  .stats-row{ flex-direction: column; }
  .stat-sep{ display:none; }
}

/* ===== Pricing Section ===== */
.pricing-section{
  background:#ffffff;
}

/* Toggle */
.bill-toggle{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 10px;
  border-radius: 999px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
}
.bill-btn{
  border:0;
  background: transparent;
  padding: 10px 16px;
  border-radius: 999px;
  font-weight: 700;
  color: rgba(15,23,42,.55);
  position: relative;
  cursor: pointer;
}
.bill-btn.active{
  background:#ffffff;
  color: rgba(15,23,42,.92);
  box-shadow: 10px 10px 22px rgba(15,23,42,.10), -10px -10px 22px rgba(255,255,255,.92);
}
.bill-off{
  padding: 8px 12px;
  border-radius: 999px;
  background:#ffffff;
  border: 1px solid rgba(15,23,42,.08);
  color: rgba(15,23,42,.70);
  font-weight: 800;
  font-size: 12px;
  box-shadow: 10px 10px 22px rgba(15,23,42,.10), -10px -10px 22px rgba(255,255,255,.92);
}

/* Cards */
.price-card2{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  overflow:hidden;
  padding: 22px 20px;
  transition: transform .25s ease, box-shadow .25s ease;
}
.price-card2:hover{
  transform: translateY(-4px);
  box-shadow: 18px 18px 55px rgba(15,23,42,.12), -18px -18px 55px rgba(255,255,255,.96);
}
.price-card2--featured{
  background:#ffffff;
  transform: translateY(-6px);
  box-shadow: 18px 18px 60px rgba(15,23,42,.14), -18px -18px 60px rgba(255,255,255,.98);
  border-color: rgba(15,23,42,.12);
}
.price-head p{line-height:1.6}

/* Price row */
.price-line{
  display:flex;
  align-items:baseline;
  gap: 8px;
  margin: 10px 0 12px;
}
.price-val{
  font-size: 44px;
  font-weight: 900;
  letter-spacing: -0.8px;
  color: rgba(15,23,42,.92);
}
.price-per{
  color: rgba(15,23,42,.55);
  font-weight: 600;
}

/* Buttons */
.price-btn{
  padding: 12px 16px;
  font-weight: 800;
  border: 1px solid rgba(15,23,42,.12);
  box-shadow: 12px 12px 26px rgba(15,23,42,.10), -12px -12px 26px rgba(255,255,255,.92);
}
.price-btn .arrow{ margin-left: 8px; font-weight: 900; }
.price-btn--light{
  background:#ffffff;
  color: rgba(15,23,42,.92);
}
.price-btn--dark{
  background:#0b0f1a;
  color:#fff;
  border-color: rgba(0,0,0,.25);
  box-shadow: 14px 14px 34px rgba(0,0,0,.20);
}
.price-btn--dark:hover{ color:#fff; }

/* separator */
.price-sep{
  border:0;
  height: 1px;
  background: rgba(15,23,42,.10);
  margin: 18px 0;
}

/* list */
.price-list{
  list-style: none;
  padding: 0;
  margin: 0;
  display:flex;
  flex-direction:column;
  gap: 12px;
}
.price-list li{
  position: relative;
  padding-left: 26px;
  color: rgba(15,23,42,.70);
  font-weight: 600;
}
.price-list li::before{
  content: "✓";
  position:absolute;
  left: 0;
  top: 0;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 12px;
  background:#ffffff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 8px 8px 18px rgba(15,23,42,.10), -8px -8px 18px rgba(255,255,255,.92);
}

/* popular badge */
.popular-badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background:#0b0f1a;
  color:#fff;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 12px 12px 26px rgba(0,0,0,.20);
}

/* donation strip */
.donate-strip{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 14px;
  padding: 12px 14px;
  color: rgba(15,23,42,.70);
  font-weight: 600;
  box-shadow: 12px 12px 26px rgba(15,23,42,.10), -12px -12px 26px rgba(255,255,255,.92);
}
.donate-ico{
  width: 30px;
  height: 30px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#ffffff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 8px 8px 18px rgba(15,23,42,.10), -8px -8px 18px rgba(255,255,255,.92);
}

/* Responsive */
@media (max-width: 991px){
  .price-card2--featured{ transform: none; }
  .price-val{ font-size: 38px; }
  .donate-strip{ text-align:center; }
}

/* ===== Precision vs Basic ===== */
.compare-section{
  background:#ffffff;
}

/* Card base */
.compare-card{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  padding: 26px 22px;
  overflow:hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}
.compare-card:hover{
  transform: translateY(-4px);
  box-shadow: 18px 18px 55px rgba(15,23,42,.12), -18px -18px 55px rgba(255,255,255,.96);
}

/* ORB AI featured */
.compare-card--featured{
  background:#ffffff;
  border-color: rgba(15,23,42,.12);
}

/* Header */
.compare-head{
  text-align:center;
  padding: 6px 0 2px;
}
.compare-title{
  font-weight: 900;
  letter-spacing: -0.6px;
  font-size: 34px;
  margin: 6px 0 0;
  color: rgba(15,23,42,.92);
}

/* separator */
.compare-sep{
  border:0;
  height: 1px;
  background: rgba(15,23,42,.12);
  margin: 18px 0 18px;
}

/* List */
.compare-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap: 12px;
}
.compare-list li{
  position:relative;
  padding-left: 26px;
  color: rgba(15,23,42,.70);
  font-weight: 600;
}
.compare-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top: 1px;
  width: 18px;
  height: 18px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 12px;
  background:#ffffff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 8px 8px 18px rgba(15,23,42,.10), -8px -8px 18px rgba(255,255,255,.92);
}

/* Button (only in ORB AI) */
.compare-btn{
  margin-top: 18px;
  padding: 12px 16px;
  font-weight: 900;
  background:#0b0f1a;
  color:#fff;
  border: 1px solid rgba(0,0,0,.25);
  box-shadow: 14px 14px 34px rgba(0,0,0,.20);
}
.compare-btn:hover{
  color:#fff;
}
.compare-btn .arrow{
  margin-left: 8px;
  font-weight: 900;
}

/* Responsive */
@media (max-width: 991px){
  .compare-title{ font-size: 30px; }
}

/* ===== Team Section ===== */
.team-section{
  background:#ffffff;
}

.team-card{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  overflow:hidden;
  padding: 20px;
  transition: transform .25s ease, box-shadow .25s ease;
}
.team-card:hover{
  transform: translateY(-4px);
  box-shadow: 18px 18px 55px rgba(15,23,42,.12), -18px -18px 55px rgba(255,255,255,.96);
}

/* top area */
.team-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 14px;
}

/* socials */
.team-social{
  display:flex;
  gap: 10px;
  align-items:center;
}
.social-btn{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color: rgba(15,23,42,.85);
  background:#ffffff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 10px 10px 22px rgba(15,23,42,.10), -10px -10px 22px rgba(255,255,255,.92);
  font-weight: 900;
  font-size: 13px;
  transition: transform .2s ease;
}
.social-btn:hover{
  transform: translateY(-2px);
  color: rgba(15,23,42,.92);
}

/* image */
.team-media{
  position:relative;
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 12px 12px 30px rgba(15,23,42,.10);
}
.team-media img{
  width:100%;
  height: 340px;
  object-fit: cover;
  display:block;
  border-radius: 18px;
}

/* arrows overlay */
.nav-dot{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 0;
  background: rgba(15,23,42,.75);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 20px;
  box-shadow: 14px 14px 34px rgba(0,0,0,.22);
  opacity: .85;
}
.nav-left{ left: 10px; }
.nav-right{ right: 10px; }

/* responsive */
@media (max-width: 991px){
  .team-media img{ height: 320px; }
}

@keyframes teamPop {
  from{ opacity:0; transform: translateY(10px) scale(.98); }
  to{ opacity:1; transform: translateY(0) scale(1); }
}
.team-card{
  animation: teamPop .45s ease both;
}

/* ===== Team Section (Slick) ===== */
.team-section{
  background:#ffffff;
}

.team-slick-wrap{
  position: relative;
}

/* Slick spacing between slides */
.team-slick .team-slide{
  padding: 0 12px;           /* gap like screenshot */
}
.team-slick{
  margin: 0 -12px;           /* cancel outer padding */
}

/* Card */
.team-card{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  overflow:hidden;
  padding: 20px;
  height: 100%;
  transition: transform .25s ease, box-shadow .25s ease;
}
.team-card:hover{
  transform: translateY(-4px);
  box-shadow: 18px 18px 55px rgba(15,23,42,.12), -18px -18px 55px rgba(255,255,255,.96);
}

/* top row */
.team-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 14px;
}

/* socials */
.team-social{
  display:flex;
  gap: 10px;
  align-items:center;
}
.social-btn{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color: rgba(15,23,42,.85);
  background:#ffffff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 10px 10px 22px rgba(15,23,42,.10), -10px -10px 22px rgba(255,255,255,.92);
  font-weight: 900;
  font-size: 13px;
  transition: transform .2s ease;
}
.social-btn:hover{
  transform: translateY(-2px);
  color: rgba(15,23,42,.92);
}

/* image */
.team-media{
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 12px 12px 30px rgba(15,23,42,.10);
  background:#fff;
}
.team-media img{
  width:100%;
  height: 340px;
  object-fit: cover;
  display:block;
}

/* ===== Slick arrows (custom) ===== */
.team-slick .slick-prev,
.team-slick .slick-next{
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: rgba(15,23,42,.72) !important;
  box-shadow: 14px 14px 34px rgba(0,0,0,.22);
  z-index: 5;
}
.team-slick .slick-prev{ left: -6px; }
.team-slick .slick-next{ right: -6px; }

.team-slick .slick-prev:before,
.team-slick .slick-next:before{
  font-size: 22px;
  line-height: 1;
  opacity: 1;
  color: #fff;
}
.team-slick {
    column-count: 3;
}

/* dots */
.team-slick .slick-dots{
  bottom: -34px;
}
.team-slick .slick-dots li button:before{
  font-size: 8px;
  opacity: .35;
  color: rgba(15,23,42,.70);
}
.team-slick .slick-dots li.slick-active button:before{
  opacity: 1;
  color: rgba(15,23,42,.90);
}

/* Responsive image height */
@media (max-width: 991px){
  .team-media img{ height: 320px; }
  .team-slick .slick-prev{ left: 6px; }
  .team-slick .slick-next{ right: 6px; }
}

/* ===== FAQ Section ===== */
.faq-section{
  background:#ffffff;
}

.faq-acc{
  border-radius: 18px;
}

.faq-item{
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 14px;
  box-shadow: 14px 14px 34px rgba(15,23,42,.10), -14px -14px 34px rgba(255,255,255,.92);
  overflow:hidden;
  margin-bottom: 14px;
}
.faq-item:last-child{ margin-bottom: 0; }

.faq-btn{
  background: transparent !important;
  border: 0;
  box-shadow: none !important;
  font-weight: 800;
  color: rgba(15,23,42,.88);
  padding: 16px 18px;
}
.faq-btn.collapsed{
  color: rgba(15,23,42,.78);
}

/* body */
.faq-body{
  padding: 0 18px 16px;
  color: rgba(15,23,42,.60);
  line-height: 1.6;
  font-weight: 600;
}

/* remove default accordion borders */
.accordion-item{
  border: none;
}

/* Custom arrow look */
.accordion-button::after{
  background-size: 14px;
  opacity: .9;
  transform: rotate(-90deg);
}
.accordion-button:not(.collapsed)::after{
  transform: rotate(0deg);
}

/* mail line */
.faq-mail{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  flex-wrap: wrap;
}
.mail-ico{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f6f7fb;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 10px 10px 22px rgba(15,23,42,.10), -10px -10px 22px rgba(255,255,255,.92);
}
.faq-email{
  color: rgba(15,23,42,.92);
  font-weight: 800;
  text-decoration: underline;
}
.faq-btn.collapsed {
    color: #000;
    background: #f7f7f7 ! IMPORTANT;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0.706592px 0.706592px -0.666667px, rgba(0, 0, 0, 0.08) 0px 1.80656px 1.80656px -1.33333px, rgba(0, 0, 0, 0.07) 0px 3.62176px 3.62176px -2px, rgba(0, 0, 0, 0.07) 0px 6.8656px 6.8656px -2.66667px, rgba(0, 0, 0, 0.05) 0px 13.6468px 13.6468px -3.33333px, rgba(0, 0, 0, 0.02) 0px 30px 30px -4px, rgb(255, 255, 255) 0px 3px 1px 0px inset ! IMPORTANT;
}

/* ===== Orb Footer with Video ===== */
.orb-footer{
  position: relative;
  overflow: hidden;
  padding: 90px 0 70px;
  background: #ffffff;
}

.orb-footer-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  z-index: 0;
  filter: saturate(0.2) contrast(1.05) brightness(1.1);
}

.orb-footer-overlay{
  position:absolute;
  inset:0;
  background: radial-gradient(circle at center, rgba(255,255,255,.30), rgba(255,255,255,.72) 55%, rgba(255,255,255,.92));
  z-index: 1;
}

.orb-footer-inner{
  position: relative;
  z-index: 2;
  display:flex;
  justify-content:center;
}



/* Social buttons */
.orb-social{
  display:flex;
  justify-content:center;
  gap: 12px;
  margin-bottom: 18px;
}
.orb-social-btn{
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  font-weight: 900;
  color: rgba(15,23,42,.85);
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 10px 10px 24px rgba(15,23,42,.10), -10px -10px 24px rgba(255,255,255,.95);
  transition: transform .2s ease, box-shadow .2s ease;
}
.orb-social-btn:hover{
  transform: translateY(-2px);
  box-shadow: 14px 14px 30px rgba(15,23,42,.12), -14px -14px 30px rgba(255,255,255,.98);
}

/* Brand */
.orb-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 18px;
  margin-top: 10px;
}
.orb-mark{
  width: 78px;
  height: 78px;
  border-radius: 999px;
  background: rgba(15,23,42,.92);
  box-shadow: 0 18px 40px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.15);
  display:flex;
  align-items:center;
  justify-content:center;
}
.orb-mark-inner{
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight: 900;
  letter-spacing: -2px;
  font-size: 22px;
}
.orb-name{
  font-size: 58px;
  font-weight: 900;
  letter-spacing: -1.4px;
  color: rgba(15,23,42,.92);
  line-height: 1;
}
.orb-name span{
  color: rgba(15,23,42,.40);
}

/* Text */
.orb-tagline{
  margin: 14px auto 20px;
  max-width: 520px;
  color: rgba(15,23,42,.70);
  font-weight: 600;
}

/* CTA */
.orb-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  padding: 12px 22px;
  border-radius: 14px;
  background: #0b0f1a;
  color: #fff;
  font-weight: 900;
  border: 1px solid rgba(0,0,0,.25);
  box-shadow: 0 16px 40px rgba(0,0,0,.22);
  text-decoration:none;
}
.orb-cta:hover{ color:#fff; }
.orb-cta .arrow{ font-weight: 900; }

/* Footer links */
.orb-links{
  display:flex;
  justify-content:center;
  gap: 44px;
  flex-wrap: wrap;
  margin: 26px 0 18px;
}
.orb-links a{
  color: rgba(15,23,42,.78);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.orb-links a:hover{
  color: rgba(15,23,42,.92);
}

/* Copy */
.orb-copy{
  color: rgba(15,23,42,.70);
  font-weight: 600;
}
.orb-copy-link{
  color: rgba(15,23,42,.92);
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Responsive */
@media (max-width: 991px){
  .orb-footer{ padding: 70px 0 60px; }
  .orb-sphere{ border-radius: 40px; padding: 34px 20px 22px; }
  .orb-name{ font-size: 44px; }
  .orb-mark{ width: 64px; height: 64px; }
  .orb-mark-inner{ width: 46px; height: 46px; font-size: 18px; }
  .orb-links{ gap: 22px; }
}

.orb-footer-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    filter: brightness(0.69) grayscale(1) invert(1);
}

.orb-sphere {
    text-align: center;
}
.orb-brand img.brand-logo {
    width: 400px;
    object-fit: cover;
    height: 114px;
}