/*  for main heading */
.gradient-heading{
    background: linear-gradient(
        90deg,
        #9b8cff 0%,
        #7f5cff 30%,
        #8a3cff 60%,
        #ff00c8 100%
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

/*  for Home Page */
/* testemonial section */

/*For Container Height*/
.slider-container-up {
  height: 750px;
  overflow: hidden;
  position: relative;
}

/*Control Animation Speed*/
.slider-up {
  animation: scrollUp 50s linear infinite;
}

/*It Creates The Animation*/
@keyframes scrollUp {
  0% {
    transform: translate3d(0, 0%, 0);
  }
  100% {
    transform: translate3d(0, -100%, 0);
  }
}

/*Responsive Adjustments*/
@media (max-width: 1024px) {
  .slider-container-up,
  .slider-container {
    height: 517px;
  }
}

@media (max-width: 767px) {

  .slider-up {
    animation: scrollUpMobile 8s linear infinite;
  }

  .slider {
    animation: scrollDownMobile 8s linear infinite;
  }

  .slider-container-up,
  .slider-container {
    height: 520px !important;
  }
}

/* Mobile animation for upward slider */
@keyframes scrollUpMobile {
  0% {
    transform: translate3d(0, 0%, 0);
  }
  100% {
    transform: translate3d(0, -44%, 0);
  }
}

/*For Container Height*/
.slider-container {
  height: 750px;
  overflow: hidden;
  position: relative;
}

/*Control Animation Speed*/
.slider {
  animation: scrollDown 50s linear infinite;
}

/*It Creates The Animation*/
@keyframes scrollDown {
  0% {
    transform: translate3d(0, -100%, 0); /* Start above */
  }
  100% {
    transform: translate3d(0, 0%, 0); /* Move down */
  }
}

/* Mobile animation for downward slider */
@keyframes scrollDownMobile {
  0% {
    transform: translate3d(0, -44%, 0);
  }
  100% {
    transform: translate3d(0, 0%, 0);
  }
}

/*Responsive Adjustments*/

/* end of testemoial sec-css */

/* end Home Page css */
.icon-inline {
	display: inline-block !important;
margin: 0 8px;
}

.carosal-salider {
    overflow: hidden !important;
}

.carosal-salider .swiper-wrapper {
    display: flex !important;
    width: max-content !important;
    transition: none !important;
    animation: carosal-marquee 30s linear infinite !important;
    will-change: transform;
}

.carosal-salider .swiper-slide {
    flex-shrink: 0 !important;
}

@keyframes carosal-marquee {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(-50%, 0, 0);
    }
}
/* For Center Alignment */
.custom-text-align {
    text-align: center;
}

/* For Justified Alignment */
.custom-text-align {
    text-align: justify;
}

/*  for team section  */
.elementor-3052 .elementor-element:is(
    .elementor-element-697bcc1,
    .elementor-element-6a649df,
    .elementor-element-27f4a4a
) .elementskit-accordion .elementskit-card-body p {
    text-align: justify !important;
}



.ekit-wid-con .number::before
{
	display:none;
}

/* abouth page hero img  */
/* Smooth Image Animation */
/* Smooth Image Animation */
.mbl-img-sec .mbl-img {
  animation: smoothFloat 5s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  will-change: transform;
}

/* Smooth Floating Animation */
@keyframes smoothFloat {
  0% {
    transform: translate3d(0, 0, 0);
  }

  50% {
    transform: translate3d(0, -20px, 0);
  }

  100% {
    transform: translate3d(0, 0, 0);
  }
}

/* for image border animation */

.hero-heading-wrapper {
    min-height: 3.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
}
.gradient-heading {
    background: linear-gradient(90deg, #9b8cff 0%, #7f5cff 30%, #8a3cff 60%, #ff00c8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    display: inline-block;
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: 3rem;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
    min-height: 1.2em;
    min-width: 1px;
    margin: 0;
}
.cursor {
    display: inline-block;
    width: 3px;
    background: #ff00c8;
    margin-left: 4px;
    height: 1em;
    vertical-align: middle;
    animation: blink 0.75s step-end infinite;
}
@keyframes blink {
    from, to { opacity: 1; }
    50% { opacity: 0; }
}

.gradient-heading {
    background: linear-gradient(
        90deg,
        #8B7CFF 0%,
        #7A4CFF 45%,
        #FF00A8 100%
    );

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;

    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    max-width: 100% !important;
    box-sizing: border-box;
}


/*  Hero sec LOCAL SEO & AI VISIBILITY section */
/* ============================================================
   Animated Card Border
   ============================================================ */

.example-2 {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
}


/* Card Content */
.example-2 .inner {
  position: relative;
  z-index: 2;
  width: 100%;
  margin: 2px;
  border-radius: 12px;
}


/* ============================================================
   Moving Light
   ============================================================ */

.example-2::before {
  content: "";
  position: absolute;
  z-index: 0;

  width: 80px;
  height: 80px;

  background: rgba(255, 255, 255, 0.9);

  filter: blur(12px);

  border-radius: 50%;

  animation: travelBorder 5s linear infinite;
}


/* ============================================================
   Border Animation
   Top → Right → Bottom → Left
   ============================================================ */

@keyframes travelBorder {

  /* TOP */
  0% {
    top: -40px;
    left: -40px;
  }

  25% {
    top: -40px;
    left: calc(100% - 40px);
  }


  /* RIGHT */
  50% {
    top: calc(100% - 40px);
    left: calc(100% - 40px);
  }


  /* BOTTOM */
  75% {
    top: calc(100% - 40px);
    left: -40px;
  }


  /* LEFT */
  100% {
    top: -40px;
    left: -40px;
  }
}

/* border animation */
.animated-image-border{
    position: relative;
    display: inline-block;
    padding: 3px;
    border-radius: 20px; /* adjust as needed */
    overflow: hidden;
}

.animated-image-border::before{
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: conic-gradient(
        from 0deg,
        #3B0B63 0deg 55deg,
        transparent 55deg 180deg,
        #b84dff 180deg 235deg,
        transparent 235deg 360deg
    );
    animation: imageBorderMove 2s ease-in-out infinite alternate;
}

.animated-image-border::after{
    content: "";
    position: absolute;
    inset: 2px;
    background: #000; /* match your page background */
    border-radius: inherit;
}

.animated-image-border .elementor-widget-image,
.animated-image-border img{
    position: relative;
    z-index: 2;
    display: block;
    border-radius: 18px;
}

@keyframes imageBorderMove{
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(180deg);
    }
}

/*  service page  */
.moving-text {
    width: 100%;
    overflow: hidden;
    display: flex;
    white-space: nowrap;
    color:#fff;
    font-size: 18px;
}

.moving-track {
    display: flex;
    flex-shrink: 0;
    animation: marquee 20s linear infinite;
}

.moving-track span {
    padding-right: 60px;
}

@keyframes marquee {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-100%);
    }
} 

    .myaio-pipe-graphic {
  width: 100%;
  height: 300px;
  overflow: hidden;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, "Noto Sans", sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
    "Noto Color Emoji";
  font-size: 16px;
  line-height: 24px;
  color: #8730B4;
  transition: all;
  cursor: crosshair;
}

.myaio-pipe-graphic svg {
  display: block;
  width: 100%;
  height: 230px;
  overflow: hidden;
  fill: rgb(1, 1, 1);
  transition: all;
  cursor: crosshair;
}

/* Pipe outer casing */
.myaio-pipe-graphic .pipe-casing {
  fill: none;
  stroke: #8730B4;
  stroke-width: 16;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Pipe inner section */
.myaio-pipe-graphic .pipe-inner {
  fill: none;
  stroke: #333;
  stroke-width: 10;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Animated flow */
.myaio-pipe-graphic .pipe-flow {
  fill: none;
  stroke: #fff;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;

  stroke-dasharray: 12 14;
  animation: myaioPipeFlow 1.2s linear infinite;
}

@keyframes myaioPipeFlow {
  to {
    stroke-dashoffset: -52;
  }
}

@media (max-width: 767px) {
  .myaio-pipe-graphic,
  .myaio-pipe-graphic svg {
    height: 230px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .myaio-pipe-graphic .pipe-flow {
    animation: none;
  }
}

/*  contact us  */
.animated-container {
    position: relative;
    padding: 45px;
    border-radius: 25px;
    overflow: hidden;
}

.animated-container::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: conic-gradient(
        from 0deg,
        #3B0B63 0deg 55deg,
        transparent 55deg 180deg,
        #B84DFF 180deg 235deg,
        transparent 235deg 360deg
    );
    animation: borderRotate 2s ease-in-out infinite alternate;
    z-index: 0;
}

.animated-container::after {
    content: "";
    position: absolute;
    inset: 2px; /* Border thickness */
    background: #0B0B0B;
    border-radius: calc(25px - 2px);
    z-index: 1;
}

.animated-container > * {
    position: relative;
    z-index: 2;
}

@keyframes borderRotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(180deg);
    }
}

/* HVAC */
  .rdg-widget, .rdg-widget * {
    box-sizing: border-box;
  }
  .rdg-widget {
    --rdg-bg: #0b0e14;
    --rdg-card-bg: #10141d;
    --rdg-panel-bg: #0d1119;
    --rdg-border: #1f2530;
    --rdg-text: #e8ebf1;
    --rdg-sub-text: #8b93a3;
    --rdg-blue: #3b82f6;
    --rdg-green: #22c55e;
    --rdg-bubble-bg: #171c28;
    --rdg-purple-1: #8b5cf6;
    --rdg-purple-2: #d946ef;

    max-width: 460px;
    width: 100%;
    margin: 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  }

  .rdg-card {
    background: var(--rdg-card-bg);
    border: 1px solid var(--rdg-border);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.35);
  }

  /* Header */
  .rdg-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 18px;
    border-bottom: 1px solid var(--rdg-border);
  }
  .rdg-header-left { display: flex; align-items: center; gap: 12px; }
  .rdg-avatar {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--rdg-purple-1), var(--rdg-purple-2));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
  }
  .rdg-name {
    color: var(--rdg-text);
    font-weight: 600;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .rdg-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--rdg-green);
    display: inline-block;
  }
  .rdg-sub {
    color: var(--rdg-sub-text);
    font-size: 12.5px;
    margin-top: 2px;
  }
  .rdg-status {
    color: var(--rdg-sub-text);
    font-size: 13px;
  }

  /* Tabs */
  .rdg-tabs {
    display: flex;
    gap: 8px;
    padding: 14px 18px 0 18px;
  }
  .rdg-tab {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border-radius: 10px;
    border: 1px solid var(--rdg-border);
    background: transparent;
    color: var(--rdg-sub-text);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
  }
  .rdg-tab svg { width: 16px; height: 16px; }
  .rdg-tab--active {
    background: var(--rdg-blue);
    border-color: var(--rdg-blue);
    color: #fff;
  }
  .rdg-tab:not(.rdg-tab--active):hover {
    color: var(--rdg-text);
    border-color: #333c4d;
  }

  /* Panels */
  .rdg-panel {
    display: none;
    padding: 18px;
    min-height: 320px;
  }
  .rdg-panel--active { display: flex; flex-direction: column; }

  /* Chat panel */
  #rdgChatPanel {
    justify-content: space-between;
  }
  .rdg-messages {
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow-y: auto;
    max-height: 360px;
    padding-right: 4px;
  }
  .rdg-msg-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rdg-sub-text);
    margin-bottom: 6px;
  }
  .rdg-bubble {
    background: var(--rdg-bubble-bg);
    border: 1px solid var(--rdg-border);
    color: var(--rdg-text);
    padding: 12px 14px;
    border-radius: 12px;
    font-size: 14.5px;
    line-height: 1.5;
    display: inline-block;
  }
  .rdg-msg--agent .rdg-bubble { max-width: 90%; }
  .rdg-msg--user .rdg-bubble { max-width: 90%; }

  .rdg-input-row {
    display: flex;
    gap: 8px;
    margin-top: 16px;
  }
  .rdg-input {
    flex: 1;
    background: var(--rdg-panel-bg) !important;
    border: 1px solid var(--rdg-border);
    color: var(--rdg-text);
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 14px;
    outline: none;
  }
  .rdg-input::placeholder { color: #555f70; }
  .rdg-input:focus { border-color: var(--rdg-blue) !important; }
  .rdg-send {
    
    border: none;
    color: #fff !important;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
  }
 .rdg-send svg {
  width: 18px;
  height: 18px;
  stroke: #ffffff !important;
  fill: #ffffff !important;
  color: #ffffff !important;
}

.rdg-send svg path,
.rdg-send svg line,
.rdg-send svg polyline,
.rdg-send svg circle {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}

.rdg-send:hover {
  opacity: 0.9;
}

  /* Voice panel */
  .rdg-voice-stage {
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 18px;
    padding: 20px 8px;
  }
  .rdg-orb-ring {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(139,92,246,0.18) 0%, rgba(139,92,246,0) 70%);
    display: flex;
    align-items: center;
    justify-content: center;
    animation: rdg-pulse 2.2s ease-in-out infinite;
  }
  @keyframes rdg-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.06); }
  }
  .rdg-orb {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--rdg-purple-1), var(--rdg-purple-2));
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 40px rgba(139,92,246,0.5);
  }
  .rdg-orb svg { width: 34px; height: 34px; }

  .rdg-wave {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    height: 20px;
  }
  .rdg-wave span {
    width: 3px;
    background: var(--rdg-purple-1);
    border-radius: 2px;
    animation: rdg-bar 1.1s ease-in-out infinite;
  }
  .rdg-wave span:nth-child(1) { height: 6px;  animation-delay: 0s; }
  .rdg-wave span:nth-child(2) { height: 14px; animation-delay: 0.1s; }
  .rdg-wave span:nth-child(3) { height: 20px; animation-delay: 0.2s; }
  .rdg-wave span:nth-child(4) { height: 10px; animation-delay: 0.3s; }
  .rdg-wave span:nth-child(5) { height: 18px; animation-delay: 0.4s; }
  .rdg-wave span:nth-child(6) { height: 8px;  animation-delay: 0.5s; }
  .rdg-wave span:nth-child(7) { height: 14px; animation-delay: 0.6s; }
  @keyframes rdg-bar {
    0%, 100% { transform: scaleY(0.4); }
    50% { transform: scaleY(1); }
  }

  .rdg-speaking-label {
    color: var(--rdg-blue);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
  }
  .rdg-voice-text {
    color: var(--rdg-text);
    font-size: 15px;
    line-height: 1.5;
    max-width: 320px;
  }

  @media (prefers-reduced-motion: reduce) {
    .rdg-orb-ring, .rdg-wave span { animation: none; }
  }

/*  Charrterentaa page svg */

.charter-chart {
    width: 100%;
    max-width: 570.41px;
    height: 224.08px;
    position: relative;
    overflow: hidden;
  }

  #charterSvg {
    display: inline;
    width: 100%;
    height: 100%;

    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 16px;
    line-height: 24px;

    color: #333333;
    background: transparent;
    fill: #000000;

    overflow: hidden;
    cursor: crosshair;

    transition: all;
  }

  .grid-line {
    stroke: rgba(0, 0, 0, 0.08);
    stroke-width: 1;
  }

  .axis-line {
    stroke: rgba(0, 0, 0, 0.18);
    stroke-width: 1;
  }

  .axis-label {
    fill: #fff;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.02em;
  }

  .text-center {
    text-anchor: middle;
  }

  .text-end {
    text-anchor: end;
  }

  .curve-demand {
    fill: none;
    stroke: #fff;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .curve-availability {
    fill: none;
    stroke: #8730B4;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: 0.9;
  }

  #trackerLine {
    stroke: rgba(6, 187, 242, 0.25);
    stroke-width: 1.5;
    stroke-dasharray: 3 3;
    pointer-events: none;
  }

  #trackerDot {
    fill: #000;
    stroke: #ffffff;
    stroke-width: 2;
    pointer-events: none;
    filter: url(#glow);
  }

  #tooltipGroup {
    pointer-events: none;
  }

  @media (max-width: 600px) {
    .charter-chart {
      max-width: 100%;
      height: auto;
      aspect-ratio: 560 / 220;
    }

    .axis-label {
      font-size: 10px;
    }
  }

/* Autorepair Page Code */
 .dash-embed{
    --bg-top:#0d1420;
    --bg-bot:#080c13;
    --border:rgba(90,140,220,0.18);
    --blue:#3f8cff;
    --blue-light:#7ec1ff;
    --text-dim:#7d8ba0;
    width:100%;
    max-width:760px;
    margin:0 auto;
    font-family:'Segoe UI', system-ui, -apple-system, sans-serif;
  }
  .dash-embed, .dash-embed *{ box-sizing:border-box; }

  .dash-card{
    position:relative;
    background:linear-gradient(160deg, var(--bg-top), var(--bg-bot));
    border:1px solid var(--border);
    border-radius:28px;
    padding:36px 40px 30px;
    overflow:visible;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03), 0 20px 50px rgba(0,0,0,0.5);
  }
  .dash-shimmer-mask{
    position:absolute;
    inset:0;
    border-radius:28px;
    overflow:hidden;
    pointer-events:none;
    z-index:1;
  }
  .dash-shimmer-mask::before{
    content:"";
    position:absolute;
    top:0;
    left:-60%;
    width:40%;
    height:100%;
    background:linear-gradient(75deg,
      transparent 0%,
      rgba(255,255,255,0.05) 45%,
      rgba(255,255,255,0.09) 50%,
      rgba(255,255,255,0.05) 55%,
      transparent 100%);
    transform:skewX(-18deg);
    animation: dash-shimmer 5s ease-in-out infinite;
    animation-delay:1.2s;
  }
  @keyframes dash-shimmer{
    0%{ left:-60%; }
    35%{ left:130%; }
    100%{ left:130%; }
  }
  .dash-card > *:not(.dash-shimmer-mask){ position:relative; z-index:2; }

  .dash-header{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
  }
  .dash-dot{
    width:8px; height:8px;
    border-radius:50%;
    background:var(--blue);
    box-shadow:0 0 8px 2px rgba(63,140,255,0.7);
    flex-shrink:0;
    animation: dash-blink 1.8s ease-in-out infinite;
  }
  @keyframes dash-blink{ 0%,100%{opacity:1;} 50%{opacity:0.4;} }
  .dash-label{
    color:var(--text-dim);
    font-size:13px;
    letter-spacing:0.08em;
    font-weight:600;
  }

  .dash-stat-row{
    display:flex;
    align-items:baseline;
    gap:10px;
    flex-wrap:wrap;
    margin-bottom:22px;
  }
  .dash-stat{
    color:#fff;
    font-size:56px;
    font-weight:800;
    letter-spacing:-0.02em;
    line-height:1;
    animation: dash-fade-up 0.7s ease-out both;
  }
  .dash-unit{
    color:var(--blue-light);
    font-size:20px;
    font-weight:600;
    animation: dash-fade-up 0.7s ease-out 0.1s both;
  }
  .dash-badge{
    display:inline-flex;
    align-items:center;
    gap:5px;
    color:var(--blue-light);
    background:rgba(63,140,255,0.08);
    border:1px solid rgba(63,140,255,0.4);
    border-radius:999px;
    padding:6px 12px;
    font-size:13px;
    font-weight:700;
    margin-left:6px;
    animation: dash-fade-up 0.7s ease-out 0.2s both;
  }
  @keyframes dash-fade-up{
    from{ opacity:0; transform:translateY(10px); }
    to{ opacity:1; transform:translateY(0); }
  }
  .dash-badge-arrow{
    animation: dash-arrow-bounce 1.8s ease-in-out 1s infinite;
  }
  @keyframes dash-arrow-bounce{
    0%,100%{ transform:translate(0,0); }
    50%{ transform:translate(2px,-2px); }
  }

  .dash-divider{
    height:1px;
    background:linear-gradient(90deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02));
    margin-bottom:34px;
  }

  .dash-chart-wrap{ position:relative; }
  .dash-chart{
    display:flex;
    align-items:flex-end;
    gap:14px;
    height:180px;
    padding:0 4px;
  }
  .dash-bar{
    flex:1;
    height:var(--h);
    border-radius:8px 8px 4px 4px;
    background:linear-gradient(180deg, #1b3a68, #16294a);
    position:relative;
    overflow:hidden;
    transform:scaleY(0);
    transform-origin:bottom;
    animation: dash-grow 0.6s cubic-bezier(.2,.8,.2,1) var(--delay) both,
               dash-breathe 3.6s ease-in-out calc(var(--delay) + 0.8s) infinite;
  }
  @keyframes dash-breathe{
    0%,100%{ transform:scaleY(1); }
    50%{ transform:scaleY(0.94); }
  }
  .dash-bar-fill{
    position:absolute;
    inset:0;
    background:inherit;
  }
  @keyframes dash-grow{
    from{ transform:scaleY(0); opacity:0; }
    to{ transform:scaleY(1); opacity:1; }
  }
  .dash-bar--active{
    background:linear-gradient(180deg, #8fceff, #3f8cff);
    box-shadow:0 0 24px 4px rgba(94,179,255,0.55);
    animation: dash-grow 0.6s cubic-bezier(.2,.8,.2,1) var(--delay) both,
               dash-glow-pulse 2.4s ease-in-out 0.8s infinite;
  }
  @keyframes dash-glow-pulse{
    0%,100%{ box-shadow:0 0 24px 4px rgba(94,179,255,0.55); }
    50%{ box-shadow:0 0 34px 8px rgba(94,179,255,0.85); }
  }

  .dash-xaxis{
    display:flex;
    gap:14px;
    padding:0 4px;
    margin-top:12px;
  }
  .dash-xaxis span{
    flex:1;
    text-align:center;
    color:var(--text-dim);
    font-size:12px;
    letter-spacing:0.02em;
  }
  .dash-xaxis span.active{
    color:var(--blue-light);
    font-weight:700;
  }

  /* ============ NEW: bottom tile row ============ */
  .dash-tiles-row{
    display:flex;
    gap:14px;
    margin-top:28px;
    flex-wrap:wrap;
  }
  .dash-tile{
    flex:1 1 150px;
    display:flex;
    align-items:center;
    gap:12px;
    background:rgba(10,16,26,0.9);
    border:1px solid rgba(90,140,220,0.25);
    border-radius:16px;
    padding:12px 16px 12px 12px;
    box-shadow:0 12px 30px rgba(0,0,0,0.35);
    animation: dash-tile-in 0.7s cubic-bezier(.2,.8,.2,1) both;
  }
  .dash-tile:nth-child(1){ animation-delay:0.6s; }
  .dash-tile:nth-child(2){ animation-delay:0.7s; }
  .dash-tile:nth-child(3){ animation-delay:0.8s; }
  .dash-tile:nth-child(4){ animation-delay:0.9s; }
  @keyframes dash-tile-in{
    from{ opacity:0; transform:translateY(14px); }
    to{ opacity:1; transform:translateY(0); }
  }
  .dash-tile-icon{
    width:36px; height:36px;
    border-radius:10px;
    background:rgba(63,140,255,0.15);
    border:1px solid rgba(63,140,255,0.35);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
  }
  .dash-tile-icon--pulse{
    animation: dash-icon-pulse 2.2s ease-in-out 1.6s infinite;
  }
  @keyframes dash-icon-pulse{
    0%,100%{ box-shadow:0 0 0 0 rgba(63,140,255,0); }
    50%{ box-shadow:0 0 0 6px rgba(63,140,255,0.18); }
  }
  .dash-tile-icon--flicker{
    animation: dash-icon-flicker 3.2s ease-in-out 1.3s infinite;
  }
  @keyframes dash-icon-flicker{
    0%,100%{ opacity:1; }
    46%{ opacity:1; }
    48%{ opacity:0.4; }
    50%{ opacity:1; }
    52%{ opacity:0.6; }
    54%{ opacity:1; }
  }
  .dash-tile-text{ min-width:0; }
  .dash-tile-label{
    font-size:11px;
    letter-spacing:0.08em;
    color:var(--text-dim);
    font-weight:600;
    margin-bottom:2px;
    white-space:nowrap;
  }
  .dash-tile-value{
    font-size:15px;
    font-weight:700;
    color:#fff;
    white-space:nowrap;
  }

  @media (max-width:640px){
    .dash-card{ padding:28px 20px 24px; border-radius:22px; }
    .dash-stat{ font-size:42px; }
    .dash-chart{ height:130px; gap:8px; }
    .dash-xaxis{ gap:8px; font-size:10px; }
    .dash-tiles-row{ flex-wrap:wrap; }
    .dash-tile{ flex:1 1 45%; }
  }

/* for ai chat  */
.rdg-widget, .rdg-widget * {
    box-sizing: border-box;
  }
  .rdg-widget {
    --rdg-bg: #0b0e14;
    --rdg-card-bg: #10141d;
    --rdg-panel-bg: #0d1119;
    --rdg-border: #1f2530;
    --rdg-text: #e8ebf1;
    --rdg-sub-text: #8b93a3;
    --rdg-blue: #3b82f6;
    --rdg-green: #22c55e;
    --rdg-bubble-bg: #171c28;
    --rdg-purple-1: #8b5cf6;
    --rdg-purple-2: #d946ef;

    max-width: 460px;
    width: 100%;
    margin: 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  }

  .rdg-card {
    background: var(--rdg-card-bg);
    border: 1px solid var(--rdg-border);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.35);
  }

  /* Header */
  .rdg-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 18px;
    border-bottom: 1px solid var(--rdg-border);
  }
  .rdg-header-left { display: flex; align-items: center; gap: 12px; }
  .rdg-avatar {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--rdg-purple-1), var(--rdg-purple-2));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
  }
  .rdg-name {
    color: var(--rdg-text);
    font-weight: 600;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .rdg-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--rdg-green);
    display: inline-block;
  }
  .rdg-sub {
    color: var(--rdg-sub-text);
    font-size: 12.5px;
    margin-top: 2px;
  }
  .rdg-status {
    color: var(--rdg-sub-text);
    font-size: 13px;
  }

  /* Tabs */
  .rdg-tabs {
    display: flex;
    gap: 8px;
    padding: 14px 18px 0 18px;
  }
  .rdg-tab {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border-radius: 10px;
    border: 1px solid var(--rdg-border);
    background: transparent;
    color: var(--rdg-sub-text);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
  }
  .rdg-tab svg { width: 16px; height: 16px; }
  .rdg-tab--active {
    background: var(--rdg-blue);
    border-color: var(--rdg-blue);
    color: #fff;
  }
  .rdg-tab:not(.rdg-tab--active):hover {
    color: var(--rdg-text);
    border-color: #333c4d;
  }

  /* Panels */
  .rdg-panel {
    display: none;
    padding: 18px;
    min-height: 320px;
  }
  .rdg-panel--active { display: flex; flex-direction: column; }

  /* Chat panel */
  #rdgChatPanel {
    justify-content: space-between;
  }
  .rdg-messages {
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow-y: auto;
    max-height: 360px;
    padding-right: 4px;
  }
  .rdg-msg-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rdg-sub-text);
    margin-bottom: 6px;
  }
  .rdg-bubble {
    background: var(--rdg-bubble-bg);
    border: 1px solid var(--rdg-border);
    color: var(--rdg-text);
    padding: 12px 14px;
    border-radius: 12px;
    font-size: 14.5px;
    line-height: 1.5;
    display: inline-block;
  }
  .rdg-msg--agent .rdg-bubble { max-width: 90%; }
  .rdg-msg--user .rdg-bubble { max-width: 90%; }

  .rdg-input-row {
    display: flex;
    gap: 8px;
    margin-top: 16px;
  }
  .rdg-input {
    flex: 1;
    background: var(--rdg-panel-bg) !important;
    border: 1px solid var(--rdg-border);
    color: var(--rdg-text);
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 14px;
    outline: none;
  }
  .rdg-input::placeholder { color: #555f70; }
  .rdg-input:focus { border-color: var(--rdg-blue) !important; }
  .rdg-send {
    
    border: none;
    color: #fff !important;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
  }
 .rdg-send svg {
  width: 18px;
  height: 18px;
  stroke: #ffffff !important;
  fill: #ffffff !important;
  color: #ffffff !important;
}

.rdg-send svg path,
.rdg-send svg line,
.rdg-send svg polyline,
.rdg-send svg circle {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}

.rdg-send:hover {
  opacity: 0.9;
}

  /* Voice panel */
  .rdg-voice-stage {
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 18px;
    padding: 20px 8px;
  }
  .rdg-orb-ring {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(139,92,246,0.18) 0%, rgba(139,92,246,0) 70%);
    display: flex;
    align-items: center;
    justify-content: center;
    animation: rdg-pulse 2.2s ease-in-out infinite;
  }
  @keyframes rdg-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.06); }
  }
  .rdg-orb {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--rdg-purple-1), var(--rdg-purple-2));
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 40px rgba(139,92,246,0.5);
  }
  .rdg-orb svg { width: 34px; height: 34px; }

  .rdg-wave {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    height: 20px;
  }
  .rdg-wave span {
    width: 3px;
    background: var(--rdg-purple-1);
    border-radius: 2px;
    animation: rdg-bar 1.1s ease-in-out infinite;
  }
  .rdg-wave span:nth-child(1) { height: 6px;  animation-delay: 0s; }
  .rdg-wave span:nth-child(2) { height: 14px; animation-delay: 0.1s; }
  .rdg-wave span:nth-child(3) { height: 20px; animation-delay: 0.2s; }
  .rdg-wave span:nth-child(4) { height: 10px; animation-delay: 0.3s; }
  .rdg-wave span:nth-child(5) { height: 18px; animation-delay: 0.4s; }
  .rdg-wave span:nth-child(6) { height: 8px;  animation-delay: 0.5s; }
  .rdg-wave span:nth-child(7) { height: 14px; animation-delay: 0.6s; }
  @keyframes rdg-bar {
    0%, 100% { transform: scaleY(0.4); }
    50% { transform: scaleY(1); }
  }

  .rdg-speaking-label {
    color: var(--rdg-blue);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
  }
  .rdg-voice-text {
    color: var(--rdg-text);
    font-size: 15px;
    line-height: 1.5;
    max-width: 320px;
  }

  @media (prefers-reduced-motion: reduce) {
    .rdg-orb-ring, .rdg-wave span { animation: none; }
  }


/* btn heading  */

.animated-heading{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 30px;
    border-radius: 50px;
    overflow: hidden;
    z-index: 1;
}

.animated-heading::before{
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: conic-gradient(
        from 0deg,
        #fff 0deg 55deg,
        transparent 55deg 180deg,
        #fff 180deg 235deg,
        transparent 235deg 360deg
    );
    animation: borderRotate 2s ease-in-out infinite alternate;
    z-index: -2;
}

.animated-heading::after{
    content: "";
    position: absolute;
    inset: 2px; /* Border thickness */
    background: #030303; /* Match your page background */
    border-radius: inherit;
    z-index: -1;
}

.animated-heading h1,
.animated-heading h2,
.animated-heading h3,
.animated-heading h4,
.animated-heading h5,
.animated-heading h6{
    margin: 0;
    line-height: 1.2;
    color: #000;
}

@keyframes borderRotate{
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(180deg);
    }
}

/* for card  */
.gradient-card{
    position:relative;
    background:#171717;
    border-radius:22px;
    overflow:hidden;
    padding:40px;
}

.gradient-card::before{
    content:"";
    position:absolute;
    inset:0;
    padding:2px;
    border-radius:inherit;

    background: linear-gradient(
    to bottom,
    #8730B4 0%,
    #7A35A8 15%,
    #5A2C7F 35%,
    #32203F 60%,
    #1A1A1A 85%,
    transparent 100%
    );

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor;
            mask-composite:exclude;

    pointer-events:none;
}

/* footr animation txt */
.hover-text{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:0;
    font-size:200px;
    font-weight:800;
    line-height:1;
    text-transform:uppercase;
    cursor:pointer;
}

.hover-text span{
    display:inline-block;
    transition:transform .35s cubic-bezier(.175,.885,.32,1.275);

    background: linear-gradient(
        180deg,
    #111111 0%,
    #1A1A1A 20%,
    #2C2C2C 65%,
    #4D4D4D 100%
    );

    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
}

.hover-text span:hover{
    transform:translateY(-20px);
}

