

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Inter', sans-serif;
    background-color: #fff;
    color: #000;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Poppins', sans-serif;
    color: #000;
    margin-bottom: 20px;
}
p {
    margin-bottom: 1rem;
    color: #555;
    line-height: 1.5;
}

::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #08080a; 
}
::-webkit-scrollbar-thumb {
    background: #333; 
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #1ab8b8; 
}
html {
    scroll-behavior: smooth;
}
::selection {
    background: #1ab8b8;
    color: #fff;
}
.text-stroke {
    -webkit-text-stroke: 1px rgba(255,255,255,0.1);
    color: transparent;
}
.text-stroke-teal {
        -webkit-text-stroke: 1px rgba(26, 184, 184, 0.3);
        color: transparent;
}
.hover-reveal-card:hover .reveal-content {
    opacity: 1;
    transform: translateY(0);
}
.code-anim span {
    opacity: 0;
    animation: fadeIn 0.05s forwards;
}
@keyframes fadeIn {
    to { opacity: 1; }
}
.broken-grid-img {
    z-index: 10;
}@keyframes float-up {
    0% { transform: translateY(100px); opacity: 0; }
    100% { transform: translateY(0); opacity: 1; }
}
.widget-enter {
    animation: float-up 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    animation-delay: 2s;
    opacity: 0; 
}

:root {
  --teal: #1ab8b8;
  --bg: #08080a;
  --surface: #111114;
  --teal: #1ab8b8;
  --purple: #8b5cf6;
  --muted: #424548;
}

/* Glass Navbar */
.glass-nav {
  background: #fff;
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  transition: all 0.3s ease;
}

/* Logo box */
.logo-box {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #1ab8b8, #0f766e);
  border-radius: 6px;
  box-shadow: 0 0 15px rgba(26, 184, 184, 0.4);
  transition: box-shadow 0.3s ease;
}

.logo-box:hover {
  box-shadow: 0 0 25px rgba(26, 184, 184, 0.6);
}

/* Brand text */
.brand-text {
  color: #fff;
  font-size: 1.25rem;
  letter-spacing: -0.02em;
}

.brand-dot {
  color: var(--teal);
}
.btn-teal .material-symbols-outlined {
    font-size: 24px !important;
}
/* Teal button */
.btn-teal {
  background: var(--teal);
  color: #fff;
  font-weight: 700;
  padding: 0.6rem 1.4rem;
  border-radius: 0.375rem;
  box-shadow: 0 0 20px rgba(26, 184, 184, 0.25);
  transition: all 0.3s ease;
}

.btn-teal:hover {
  box-shadow: 0 0 30px rgba(26, 184, 184, 0.45);
  transform: translateY(-2px);
  background: #f8f9fa;
    color: #000;
}
.btn-outline-light {
    background: #f8f9fa;
    color: #000;
    padding: 0.6rem 1.4rem;
}
.btn-outline-light:hover {
    background: var(--teal);
    color: #fff;
}

.hero-section {
  /* background: var(--bg); */
  padding-top: 8rem;
  /* padding-bottom: 6rem; */
}

/* Container for the lines */
.hamburger-icon {
    width: 30px;
    height: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
}

/* The three lines */
.hamburger-icon span {
    display: block;
    height: 3px;
    width: 100%;
    background-color: white; /* Change color if needed */
    border-radius: 3px;
    transition: all 0.3s ease-in-out;
}

/* Animation to Cross (X) */
/* When the button DOES NOT have the class 'collapsed', it means the menu is OPEN */
.navbar-toggler:not(.collapsed) .hamburger-icon span:nth-child(1) {
    transform: translateY(8.5px) rotate(45deg);
}

.navbar-toggler:not(.collapsed) .hamburger-icon span:nth-child(2) {
    opacity: 0;
    transform: translateX(-20px);
}

.navbar-toggler:not(.collapsed) .hamburger-icon span:nth-child(3) {
    transform: translateY(-8.5px) rotate(-45deg);
}

/* Remove default Bootstrap border/outline */
.navbar-toggler:focus {
    box-shadow: none;
    outline: none;
}

@media (max-width: 992px) {
  .navbar-collapse {
    align-items: center;
    width: 280px;
    background: #fff;
    height: 100vh;
    position: absolute;
    top: 86px;
    transition: 0.5s all;
    z-index: 99;
    left: -100%;
}
.navbar-collapse.show {
    left: 0;
}
.menu-list {
    align-items: baseline;
    gap: 5px !important;
    padding: 10px;
    height: 500px;
    overflow: auto;
}
.menu-item {
    width: 100%;
    align-items: baseline;
    text-align: left;
}
.section-title {
    font-size: 34px !important;
}
.neon-card {
    margin-left: 0 !important;
}
.neon-card.text-end {
    margin-right: 0 !important;
    text-align: left !important;
}
.contact-image {
    margin-right: 0px !important;
    margin-bottom: 22px;
}

}
@media (max-width: 576px) {
  .audit-title {
    font-size: clamp(1.5rem, 5vw, 3rem) !important;
}
.app-title {
    font-size: 2rem !important;
}
.app-card.text-end {
    margin-right: 0 !important;
    text-align: left !important;
}
.app-card {
    margin-left: 0 !important;
}
.data-title {
    font-size: 2rem !important;
}
.dm-title {
    font-size: 2rem !important;
}
.dm-card {
    margin-left: 0px !important;
}
.dm-card {
    margin-left: 0 !important;
    padding: 1rem !important;
}
.dm-bottom {
    padding: 4rem 1rem !important;
}
.btn-outline-light.menu-item {
    width: fit-content;
}
.dm-card.text-end {
    margin-right: 0 !important;
    text-align: left !important;
}
.work-title {
    font-size: 2rem !important;
}
.insights-title {
    font-size: 2rem !important;
}
.faq-title {
    font-size: 1.5rem !important;
}
.footer-title {
    font-size: 1.5rem !important;
}
.lead-title {
    font-size: clamp(2rem,6vw,4.5rem) !important;
}
.hero-title {
    font-size: clamp(2rem, 6vw, 5rem) !important;
}
.logo {
    width: 155px !important;
    height: 65px !important;
}
.web-img {
    height: 356px !important;
}
.brand-name {
color: #000 !important;
}
.align-end li {
    justify-content: left !important;
}
.d-flex.justify-content-end.mb-3 {
    justify-content: left !important;
}
.d-flex.justify-content-end.gap-2.flex-wrap {
    justify-content: left !important;
}

}
@media (min-width: 992px) and (max-width: 1200px) {
 .menu-item {
    padding: 4px 10px !important;
}
.mega-menu {
    left: 142% !important;
    transform: translateX(-50%);
}
}
@media (min-width: 992px) {
  .hero-section {
    padding-top: 6rem;
    /* padding-bottom: 8rem; */
  }
}

/* grid overlay */
.grid-overlay {
  position: absolute;
  inset: 0;
 background-image: linear-gradient(to right, #1f2937 1px, transparent 1px), linear-gradient(to bottom, #1f2937 1px, transparent 1px);
  background-size: 60px 60px;
  opacity: .07;
}

/* blur orbs */
.orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(100px);
}
.orb-teal {
  width: 600px;
  height: 600px;
  background: rgba(26,184,184,0.1);
  top: 25%;
  right: 0;
}
.orb-purple {
  width: 500px;
  height: 500px;
  background: rgba(139,92,246,0.05);
  bottom: 0;
  left: 0;
}

/* status pill */
.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 14px;
  background: #e0e0e5;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 999px;
}
.status-text {
    font-size: 13px;
    /* letter-spacing: .15em; */
    text-transform: uppercase;
    color: var(--teal);
    font-weight: 600;
}
.pulse-dot {
  width: 10px;
  height: 10px;
  background: var(--teal);
  border-radius: 50%;
  animation: pulse 1.5s infinite;
}
.navigation-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
}
.navbar-toggler {
    background: var(--teal);
    padding: 10px 10px;
}
/* text */
.hero-title {
  font-size: clamp(3rem, 6vw, 3rem);
  font-weight: 800;
  color: #000;
  line-height: 1.3;
}
.gradient-text {
  background: linear-gradient(90deg, var(--teal), #22d3ee, var(--teal));
  background-size: 200% auto;
  -webkit-background-clip: text;
  color: transparent;
  animation: gradient 3s linear infinite;
}
.hero-desc {
  color: var(--muted);
  border-left: 3px solid rgba(26,184,184,0.5);
  padding-left: 1rem;
  max-width: 600px;
}
.btn-glow .material-symbols-outlined {
    font-size: 24px !important;
}
/* buttons */
.btn-glow {
    background: var(--teal);
    color: #fff;
    font-weight: 700;
    padding: .8rem 1.8rem;
    box-shadow: 0 0 20px rgba(26,184,184,.3);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
}
.btn-glow:hover {
  box-shadow: 0 0 30px rgba(26,184,184,.5);
}
.btn-outline-glow {
    border: 1px solid rgb(205 200 200);
    /* color: #fff; */
    display: flex;
    align-items: center;
    justify-content: center;
}
.btn-outline-glow:hover {
  border-color: var(--teal);
  color: var(--teal);
}

/* image */
.image-frame {
  position: relative;
  padding: 10px;
  background: var(--surface);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 16px;
  transform: rotate(3deg);
  transition: .4s;
}
.image-frame:hover { transform: rotate(0); }
.image-glow {
  position: absolute;
  inset: -10px;
  background: linear-gradient(90deg, var(--teal), transparent);
  filter: blur(20px);
  opacity: .3;
}
.hero-img {
    opacity: .85;
    transition: .4s;
    width: 100%;
    height: 400px;
    object-fit: cover;
}
.image-frame:hover .hero-img { opacity: 1; }

/* animations */
@keyframes gradient {
  to { background-position: 200% center; }
}
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(26,184,184,.7); }
  70% { box-shadow: 0 0 0 10px rgba(26,184,184,0); }
  100% { box-shadow: 0 0 0 0 rgba(26,184,184,0); }
}

.brands-section {
  padding: 3rem 0;
  /* background: #111114; */
  border-top: 1px solid rgba(255,255,255,.05);
  border-bottom: 1px solid rgba(255,255,255,.05);
}

.brands-title {
  font-size: 12px;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: #1ab8b8;
  font-weight: 600;
}

.brand-box {
  height: 96px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* background: #e7e7eb; */
  border: 1px solid rgba(255,255,255,.08);
  transition: .3s ease;
}

.brand-box span.material-symbols-outlined {
  font-size: 36px;
  color: #6b7280;
  margin-bottom: 6px;
  transition: .3s;
}

.brand-name {
  font-size: 11px;
  letter-spacing: .15em;
  text-transform: uppercase;
  font-weight: 700;
  color: #6b7280;
  transition: .3s;
}

.brand-box:hover {
  border-color: #1ab8b8;
  box-shadow: 0 0 15px rgba(26,184,184,.15);
}

.brand-box:hover span,
.brand-box:hover .brand-name {
  color: #000;
}

.web-section { background:#f8f8f8; padding:8rem 0; }

.web-gradient {
  position:absolute; inset:0;
  background: linear-gradient(to left, rgba(26,184,184,.05), transparent);
}

.web-stroke {
  position:absolute; top:-40px; left:0;
  font-size:clamp(6rem,15vw,10rem);
  font-weight:800;
  color:transparent;
  -webkit-text-stroke:1px rgba(26,184,184,.4);
  opacity:1;
}

.border-teal {
    border-color: #1ab8b8 !important;
    border: 0;
}
.text-teal { color:#1ab8b8; }

.section-code {
  color:#1ab8b8; font-family:monospace;
  text-transform:uppercase; letter-spacing:.2em;
  font-size:13px; display:block;
}

.section-title {
    font-size: clamp(2.5rem,5vw,3.5rem);
    color: #000;
    font-weight: 700;
    font-size: 68px;
}
.section-desc {
    color: #9ca3af;
    max-width: 500px;
    font-size: 17px;
}

.image-glow-box {
  position:relative;
}
.image-glow-box::before {
  content:""; position:absolute; inset:-6px;
  background:#1ab8b8; opacity:.2; filter:blur(12px);
  transition:.5s;
}
.image-glow-box.white::before { background:#fff; opacity:.1; }
.image-glow-box:hover::before { opacity:.5; }
.web-img {
  max-height:500px; width:100%; object-fit:cover;
  filter:grayscale(100%); transition:.6s;
  border:1px solid rgba(255,255,255,.1);
}
.image-glow-box:hover .web-img { filter:grayscale(0); }

.neon-card {
    background: #fff;
    backdrop-filter: blur(10px);
    padding: 2.5rem;
    border: 1px solid rgba(26,184,184,.3);
    box-shadow: 0 0 20px rgba(26,184,184,.3);
    margin-left: -120px;
}
.neon-list li {
    display: flex;
    align-items: center;
    padding-bottom: 8px;
    gap: 10px;
}
.neon-card.text-end {
    margin-right: 100px;
    margin-left: 0;
}
.card-title {
    color: #000;
    font-weight: 700;
    font-size: 25px;
    margin-bottom: 15px;
}
.card-text { color:#9ca3af; }

.neon-list {
  list-style:none; padding:0; margin:0;
  color:#1ab8b8; font-family:monospace;
}
.neon-list li::before {
  content:""; width:6px; height:6px; background:#1ab8b8;
  display:inline-block; margin-right:10px;
  box-shadow:0 0 6px #1ab8b8;
}

.align-end li { justify-content:flex-end; }

.ops-box {
  margin-top:5rem;
  background:rgb(209 204 204 / 40%);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:2rem;
  position:relative;
}
.ops-box::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(26,184,184,.05);
    z-index: -1;
}

.ops-title {
    color: #000;
    font-weight: 700;
    margin-bottom: 0;
}
.ops-desc { color:#000; font-size:14px; }

.ops-card {
  background:#111114;
  border-left:3px solid #1ab8b8;
  padding:1.5rem;
  transition:.3s;
}
.ops-card:hover { background:rgba(255,255,255,.05); }

.ops-value {
  color:#1ab8b8;
  font-family:monospace;
  font-size:1.8rem;
  font-weight:700;
}
.ops-label {
  color:#6b7280;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:14px;
}

.audit-section {
  padding: 6rem 0;
  border-top: 1px solid rgba(255,255,255,.05);
}

.icon-pill {
  display: inline-flex;
  padding: 12px;
  border-radius: 999px;
  background: rgba(26,184,184,.1);
}
.icon-pill span {
  font-size: 32px;
  color: #1ab8b8;
}

.audit-title {
  font-size: clamp(2.5rem, 5vw, 3rem);
  font-weight: 800;
  color: #000;
}

.audit-desc {
  max-width: 700px;
  margin: auto;
  color: #9ca3af;
  font-size: 1.1rem;
}

.audit-form {
  max-width: 520px;
}

.audit-input {
  background: #111114;
  border: 1px solid rgba(255,255,255,.15);
  color: #000;
  padding: 14px 20px;
}
.audit-input::placeholder { color:#6b7280; }
.audit-input:focus {
  border-color:#1ab8b8;
  box-shadow:0 0 0 .15rem rgba(26,184,184,.25);
}

.audit-btn {
  background:#6b7280;
  color:#fff;
  font-weight:700;
  /* text-transform:uppercase; */
  /* letter-spacing:.15em; */
  padding:14px 30px;
  box-shadow:0 0 20px rgba(255,255,255,.2);
  transition:.3s;
}
.audit-btn:hover {
  background:#1ab8b8;
  color:#000;
  box-shadow:0 0 30px rgba(26,184,184,.4);
}

.audit-note {
  color:#6b7280;
  font-size:12px;
}

.future-section {
  background:#111114;
  border-top:1px solid rgba(255,255,255,.05);
  padding:8rem 0;
}

.future-code {
  display:block;
  color:#1ab8b8;
  font-family:monospace;
  letter-spacing:.2em;
  margin-bottom:1rem;
  text-transform:uppercase;
}

.future-title {
  font-size:clamp(2.5rem,5vw,3.5rem);
  font-weight:800;
  color:#fff;
  margin-bottom:2rem;
}

.future-text p {
  color:#9ca3af;
  font-size:1.1rem;
  line-height:1.7;
  margin-bottom:1rem;
}

.future-tags {
    margin-top: 1.5rem;
    display: flex;
    gap: 1.5rem;
    color: #1ab8b8;
    font-family: monospace;
    flex-wrap: wrap;
}
.future-tags i {
  width:8px; height:8px;
  background:#1ab8b8;
  border-radius:50%;
  display:inline-block;
  margin-right:6px;
}

.future-glow {
  position:absolute;
  inset:-20px;
  background:rgba(26,184,184,.2);
  filter:blur(60px);
  border-radius:50%;
  opacity:.4;
}

.future-img {
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.1);
    box-shadow: 0 0 30px rgba(0,0,0,.6);
    filter: grayscale(100%);
    transition: .6s;
    width: 100%;
}
.future-img:hover { filter:grayscale(0); }

.lead-section {
  /* background: linear-gradient(to bottom, #000, #111827, #000); */
  padding: 6rem 0;
  color: #000;
}

.lead-texture {
  position: absolute;
  inset: 0;
  background: url("https://www.transparenttextures.com/patterns/carbon-fibre.png");
  opacity: .1;
}

.lead-badge {
  display: inline-block;
  padding: 6px 14px;
  border: 1px solid #1ab8b8;
  color: #1ab8b8;
  font-family: monospace;
  font-size: 12px;
  box-shadow: 0 0 15px rgba(26,184,184,.3);
  margin-bottom: 1.5rem;
}

.lead-title {
  font-size: clamp(3rem,6vw,4.5rem);
  font-weight: 800;
  margin-bottom: 1.5rem;
}

.lead-gradient {
  background: linear-gradient(to right, #1ab8b8, #3bd162);
  -webkit-background-clip: text;
  color: transparent;
}

.lead-desc {
  color: #9ca3af;
  max-width: 600px;
  margin: auto;
  font-size: 1.1rem;
  margin-bottom: 3rem;
}

.lead-form {
  max-width: 575px;
  z-index: 0;
}

.form-glow {
    position: absolute;
    inset: -6px;
    background: linear-gradient(to right, #1ab8b8, #fff);
    filter: blur(12px);
    opacity: .25;
    transition: .5s;
    z-index: -1;
}
.lead-form:hover .form-glow { opacity: .7; }

.lead-btn {
    background: #fff;
    color: #000;
    font-weight: 700;
    text-transform: uppercase;
    padding: 8px 18px;
    transition: .3s;
    white-space: nowrap;
    border: 1px solid #ccc;
}
.lead-btn:hover { background:#1ab8b8; color:#000; }

.app-section{
  background:#fff;
  padding:6rem 0;
  border-top:1px solid rgba(255,255,255,.05);
  color:#fff;
}
.app-card h3 {
    color: #000;
    margin-bottom: 7px;
}
.app-card p {
    color: #9ca3af;
}
.app-card.text-end {
    margin-right: 100px;
    margin-left: 0;
}

.app-left-glow{
  position:absolute;
  top:0;left:0;
  width:35%;height:100%;
  background:linear-gradient(to right, rgba(26,184,184,.08), transparent);
}

.app-heading{margin-bottom:6rem}
.app-bg-text{
  position:absolute;
  right:0;top:-60px;
  font-size:10rem;
  color:transparent;
  -webkit-text-stroke:2px #1ab8b8;
  opacity:.2;
}
.app-heading-box{
  border-right:4px solid #1ab8b8;
  padding-right:2rem;
  display:inline-block;
}
.app-tag{color:#1ab8b8;font-family:monospace}
.app-title{font-size:3rem;font-weight:800}
.app-title span{color:#1ab8b8}
.app-sub{color:#9ca3af;max-width:450px;margin-left:auto}

.app-card {
    background: #f8f8f8;
    backdrop-filter: blur(10px);
    padding: 2.5rem;
    border: 1px solid rgba(26,184,184,.3);
    box-shadow: 0 0 30px rgba(26,184,184,.15);
    transition: .3s;
    margin-left: -100px;
}
.app-card:hover{box-shadow:0 0 45px rgba(26,184,184,.35)}

.app-icon{font-size:3rem;color:#1ab8b8}

.tech-badge{
  border:1px solid rgba(26,184,184,.3);
  color:#1ab8b8;
  font-size:11px;
  padding:4px 10px;
  text-transform:uppercase;
}

.app-img{
  max-height:500px;
  width:100%;
  object-fit:cover;
  filter:grayscale(1);
  transition:.7s;
  border:1px solid rgba(255,255,255,.1);
}
.app-img:hover{filter:grayscale(0)}

.img-glow{
  position:absolute;
  inset:-6px;
  background:#1ab8b8;
  filter:blur(12px);
  opacity:.2;
}
.img-glow.white{background:#fff;opacity:.1}

.app-list{list-style:none;padding:0;color:#1ab8b8;font-family:monospace}
.app-list li{margin-bottom:10px}

.mini-card{
  background:#0b0f18;
  border:1px solid rgba(255,255,255,.05);
  padding:2rem;
  transition:.3s;
}
.mini-card:hover{
  border-color:#1ab8b8;
  box-shadow:0 0 30px rgba(26,184,184,.2);
}
.mini-card span{
  font-size:2.5rem;
  color:#9ca3af;
}
.mini-card:hover span{color:#1ab8b8}


.data-section {
    padding: 8rem 0;
    background: rgba(26,184,184,.05);
    border-top: 1px solid rgba(26,184,184,.1);
    border-bottom: 1px solid rgba(26,184,184,.1);
    overflow: hidden;
    position: relative;
    z-index: 0;
}

/* background overlay */
.data-bg{
  background:url("https://lh3.googleusercontent.com/aida-public/AB6AXuA0OI1PU6mVls9D9laS754F1-JfZtR6oAzGW2nBp3DFarb3YJGivI8m9A-my9ezS_8EG9gq39REsHciYg8ol6g6Q2AlBmgmHo6nIAc5oUygf_g1QgnwXkoLo6pJytWR2h7i_3e252Odh4hOx6YTLrHq_i9JhLZlVHS_I8rg5jr_AqrCtGM2aCdzkkyD-pcY5fYV_RVw4c3UBKc4jLkYA-bVqxzwu4oqyzAhzGO8fgLwzUFTZZAAutlmd02DabtezUONaSx76C1wbSw")
    center/cover no-repeat;
  filter:grayscale(1);
  mix-blend-mode:overlay;
  opacity:.2;
  z-index:0;
}

.data-title{
  font-size:3rem;
  font-weight:800;
  color:#000;
  margin-bottom:1rem;
}

.data-sub{
  color:#9ca3af;
  font-size:1.1rem;
  max-width:520px;
}

.data-card{
  color:#9ca3af;
}

.data-card span{
  font-size:2.5rem;
  color:#1ab8b8;
  margin-bottom:1rem;
  display:block;
}

.data-card h3{
  color:#000;
  font-size:1.25rem;
  margin-bottom:.5rem;
}

.data-card p{
  font-size:.9rem;
  line-height:1.6;
}

.dm-section{
  padding:8rem 0;
  background:#0f0f12;
  border-top:1px solid rgba(255,255,255,.05);
  position:relative;
  overflow:hidden;
}

.dm-glow{
  width:35%;
  height:100%;
  background:linear-gradient(to top, rgba(26,184,184,.15), transparent);
  pointer-events:none;
}

.dm-watermark {
    position: absolute;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 7rem;
    font-weight: 800;
    color: transparent;
    -webkit-text-stroke: 2px #1ab8b8;
    opacity: .2;
    z-index: -1;
}

.dm-tag{
  color:#1ab8b8;
  font-family:monospace;
  letter-spacing:3px;
  font-size:.8rem;
}

.dm-title{
  font-size:3rem;
  font-weight:800;
  color:#fff;
}
.dm-title span{color:#1ab8b8;}

.dm-sub{color:#9ca3af;max-width:520px;margin:auto;}

.dm-img {
    mx-height: 500px;
    object-fit: cover;
    filter: grayscale(1);
    border: 1px solid rgba(255,255,255,.1);
    transition: .6s;
    width: 100%;
}
.dm-img:hover{filter:grayscale(0);}

.img-glow{
  position:absolute;
  inset:-6px;
  background:#1ab8b8;
  opacity:.2;
  filter:blur(20px);
}
.img-glow.white{background:#fff;opacity:.1;}

.dm-card {
    background: rgba(20,20,25,.95);
    padding: 3rem;
    border: 1px solid rgba(26,184,184,.3);
    box-shadow: 0 0 20px rgba(26,184,184,.25);
    margin-left: -64px;
    z-index: 999;
    position: relative;
}
.dm-card.text-end {
    margin-left: 0;
    margin-right: 80px;
}

.dm-card span.material-symbols-outlined{
  font-size:3rem;
  color:#1ab8b8;
  margin-bottom:1rem;
}

.dm-card h3{color:#fff;font-size:1.8rem;}
.dm-card p{color:#9ca3af;}

.dm-bar{
  width:100%;
  height:8px;
  background:rgba(0,0,0,.5);
  border-radius:10px;
  margin:1.5rem 0;
  overflow:hidden;
}
.dm-bar span{
  display:block;
  width:75%;
  height:100%;
  background:#1ab8b8;
  animation:pulse 2s infinite;
}
.dm-bar.reverse span{width:80%;float:right;}

@keyframes pulse{
  0%{opacity:.4}
  50%{opacity:1}
  100%{opacity:.4}
}

.dm-live{
  background:rgba(0,0,0,.5);
  padding:1rem;
  border-left:3px solid #1ab8b8;
  color:#fff;
  opacity:.8;
}
.item-card {
  transition:.3s;
}
.dm-bottom{
  background:#111;
  border:1px solid rgba(255,255,255,.05);
  padding:4rem 2rem;
  transition:.3s;
}
.dm-live {
 transition:.3s;
}
.dm-card:hover .dm-live {
transform: translateY(-10px);
}
.dm-bottom:hover .item-card {
    transform: translateY(-10px);
}
.dm-bottom h3{color:#fff;font-size:2.2rem;}
.dm-bottom p{color:#9ca3af;max-width:700px;margin:auto;}

.dm-bottom h4 {
    color: #fff;
    font-size: 2rem;
    margin-bottom: 0;
}
.dm-bottom span{
  color:#1ab8b8;
  font-size:.75rem;
  letter-spacing:2px;
}

.work-section{
  padding:6rem 0;
  background:#f8f8f8;
  border-top:1px solid rgba(255,255,255,.05);
  position:relative;
  overflow:hidden;
}

.work-glow{
  right:0;
  top:25%;
  width:400px;
  height:400px;
  background:rgba(26,184,184,.1);
  border-radius:50%;
  filter:blur(100px);
}

.work-tag{
  color:#1ab8b8;
  font-family:monospace;
  letter-spacing:3px;
  font-size:.8rem;
}

.work-title {
    font-size: 2rem;
    font-weight: 800;
    color: #000;
    margin-bottom: 0;
}
.work-title span{color:#1ab8b8;}

.work-view{
  display:flex;
  align-items:center;
  gap:.4rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:.8rem;
  color:#000;
  text-decoration:none;
  transition:.3s;
}
.work-view:hover{color:#1ab8b8;}

.work-card{
  background:#fff;
  border:1px solid rgba(255,255,255,.1);
  overflow:hidden;
  transition:.4s;
}
.work-card:hover{border-color:rgba(26,184,184,.6);}

.work-img-wrap {
    aspect-ratio: 7/5;
    overflow: hidden;
    position: relative;
}

.work-img-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:grayscale(1);
  transition:.7s;
}
.work-card:hover img{
  filter:grayscale(0);
  transform:scale(1.05);
}

.work-overlay{
  position:absolute;
  inset:0;
  background:rgba(26,184,184,.25);
  opacity:0;
  transition:.5s;
  mix-blend-mode:overlay;
}
.work-card:hover .work-overlay{opacity:1;}

.work-card h3 {
    color: #000;
    font-weight: 700;
    margin-bottom: 5px;
}
.work-card p {
    color: #9ca3af;
    font-size: .85rem;
    /* margin-bottom: 0; */
}

.work-desc{margin-bottom:1.5rem;}

.work-arrow {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgb(223 216 216);
    display: flex;
    align-items: center;
    justify-content: center;
    /* color: #fff; */
    transition: .4s;
}
.work-card:hover .work-arrow{
  background:#1ab8b8;
  border-color:#1ab8b8;
  color:#000;
}

.work-stats {
    border-top: 1px solid rgb(14 13 13 / 10%);
    padding-top: 1.5rem;
    display: flex;
    justify-content: space-between;
}

.work-stats span{
  font-size:.7rem;
  color:#6b7280;
  text-transform:uppercase;
  letter-spacing:2px;
}

.work-stats strong{
  display:block;
  font-family:monospace;
  font-size:1.6rem;
  color:#1ab8b8;
}
.insights-section{
  padding:6rem 0;
  background:#fff;
  border-top:1px solid rgba(255,255,255,.05);
  position:relative;
  overflow:hidden;
}

.insights-tag{
  color:#1ab8b8;
  font-family:monospace;
  letter-spacing:3px;
  font-size:.8rem;
}

.insights-title{
  font-size:3rem;
  font-weight:800;
  color:#000;
}
.insights-title span{color:#1ab8b8;}

.insight-card{
  background:#fff;
  border:1px solid rgba(26,184,184,.3);
  padding:4px;
  position:relative;
  overflow:hidden;
  transition:.4s;
  height:100%;
}
.insight-card:hover{
  border-color:#1ab8b8;
  box-shadow:0 0 25px rgba(26,184,184,.35);
}

.insight-glow{
  position:absolute;
  top:-40px;
  right:-40px;
  width:80px;
  height:80px;
  background:rgba(26,184,184,.3);
  filter:blur(30px);
  transition:.4s;
}
.insight-card:hover .insight-glow{
  background:rgba(26,184,184,.5);
}

.insight-thumb{
  height:190px;
  background:#15151c;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.05);
}

.thumb-overlay{
  position:absolute;
  inset:0;
  background:rgba(26,184,184,.08);
  transition:.4s;
}
.insight-card:hover .thumb-overlay{
  background:rgba(26,184,184,.15);
}

.thumb-tag{
  position:absolute;
  top:10px;
  left:10px;
  background:#1ab8b8;
  color:#000;
  font-size:.7rem;
  font-weight:700;
  padding:2px 6px;
  letter-spacing:1px;
}

.thumb-icon{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.thumb-icon span{
  font-size:3.5rem;
  color:rgba(255,255,255,.1);
  transition:.5s;
}
.insight-card:hover .thumb-icon span{
  color:rgba(26,184,184,.5);
}

.insight-meta{
  color:#1ab8b8;
  font-family:monospace;
  font-size:.7rem;
  margin-bottom:.8rem;
}
.insight-meta i{color:#555;padding:0 6px;}

.insight-card h3{
  color:#000;
  font-size:1.2rem;
  font-weight:700;
  margin-bottom:.6rem;
  transition:.3s;
}
.insight-card:hover h3{color:#1ab8b8;}

.insight-card p{
  color:#9ca3af;
  font-size:.85rem;
  line-height:1.5;
  margin-bottom:1.2rem;
}

.insight-link {
    text-transform: uppercase;
    font-weight: 800;
    /* letter-spacing: 2px; */
    font-size: .7rem;
    color: #000;
    display: flex;
    align-items: center;
    gap: .4rem;
    text-decoration: none;
    transition: .3s;
    margin: 0 !important;
    font-size: 16px;
}
.insight-link .material-symbols-outlined {
    font-size: 20px !important;
}

.insight-card:hover .insight-link{gap:.8rem;color:#1ab8b8;}

.faq-section{
  padding:6rem 0;
  background:#f8f8f8;
  border-top:1px solid rgba(255,255,255,.05);
}

.faq-tag{
  color:#1ab8b8;
  font-family:monospace;
  letter-spacing:3px;
  font-size:.8rem;
  display:block;
  margin-bottom:.5rem;
}

.faq-title{
  color:#000;
  font-size:2.5rem;
  font-weight:800;
  margin-bottom:1rem;
}
.faq-title span{color:#1ab8b8;}

.faq-desc{
  color:#9ca3af;
  font-size:.9rem;
  line-height:1.6;
  margin-bottom:2rem;
}

.faq-link {
    color: #000;
    text-transform: uppercase;
    font-weight: 700;
    /* letter-spacing: 2px; */
    font-size: .75rem;
    text-decoration: none;
    border-bottom: 1px solid #1ab8b8;
    padding-bottom: 4px;
    transition: .3s;
    font-size: 16px;
}
.faq-link:hover{color:#1ab8b8;}

.faq-card{
  background:#fff;
  padding:1.5rem;
  border:1px solid rgba(255,255,255,.05);
  transition:.3s;
}
.faq-card:hover{border-color:rgba(26,184,184,.4);}

.faq-card h3{
  color:#000;
  font-size:1rem;
  font-weight:700;
  display:flex;
  gap:.6rem;
  margin-bottom:.7rem;
}
.faq-card h3 span{
  color:#1ab8b8;
  font-family:monospace;
  opacity:.5;
  transition:.3s;
}
.faq-card:hover h4 span{opacity:1;}

.faq-card p{
  color:#9ca3af;
  font-size:.85rem;
  line-height:1.6;
  padding-left:10px;
  border-left:2px solid rgba(26,184,184,.2);
  transition:.3s;
}
.faq-card:hover p{border-color:#1ab8b8;}

/* .footer{background:#0b0b0f;color:#fff;border-top:1px solid rgba(255,255,255,.05)} */

.footer-cta {
    padding: 6rem 0;
    background: #fff;
    position: relative;
    overflow: hidden;
}

.footer-glow{
  position:absolute;
  width:500px;height:500px;
  background:rgba(26,184,184,.2);
  border-radius:50%;
  top:-100px;right:-100px;
  filter:blur(120px);
}

.footer-title {
    font-size: 2.5rem;
    font-weight: 800;
    max-width: 600px;
    margin: auto;
}
.footer-sub{color:#9ca3af;margin:1rem auto 2rem;}

.footer-input{
  background:rgba(0,0,0,.6);
  border:1px solid rgba(255,255,255,.1);
  color:#fff;
}
.footer-input:focus{border-color:#1ab8b8;box-shadow:0 0 0 .15rem rgba(26,184,184,.4)}

.footer-form .footer-btn {
    padding: 10px .75rem;
    background: #1ab8b8;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    border: 1px solid #1ab8b8;
    position: absolute;
    right: 8px;
}
.footer-btn:hover{background:#fff; color: #000;box-shadow: 0 0 30px rgba(26, 184, 184, .5);}

.footer-note{color:#6b7280;font-size:.75rem;margin-top:1rem}

.footer-main{background:#0f0f12;border-top:1px solid rgba(255,255,255,.05);padding:4rem 0}
.footer-logo {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: 1.4rem;
    font-weight: 800;
    margin-bottom: 30px;
}
.footer-logo span span{color:#1ab8b8}
.logo-icon{width:36px;height:36px;background:#1ab8b8;color:#000;border-radius:6px;display:flex;align-items:center;justify-content:center}

.footer-desc {
    color: #9ca3af;
    font-size: 16px;
    max-width: 310px;
}

.footer-main .ft-title {
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #fff;
    font-weight: 600;
}

.footer-main ul{list-style:none;padding:0}
.footer-main li{margin-bottom:.6rem}
.footer-main a{color:#9ca3af;text-decoration:none;font-size:.85rem}
.footer-main a:hover{color:#1ab8b8}

.footer-mail{display:block;margin-bottom:1rem;color:#9ca3af;text-decoration:none}
.footer-mail:hover{color:#1ab8b8}

.footer-socials a{
  width:40px;height:40px;border-radius:50%;
  border:1px solid rgba(255,255,255,.1);
  display:inline-flex;align-items:center;justify-content:center;
  margin-right:.5rem;color:#9ca3af;text-decoration:none;
  transition:.3s;
}
.footer-socials a:hover{color:#1ab8b8;border-color:#1ab8b8;box-shadow:0 0 15px rgba(26,184,184,.4)}

.footer-bottom {
    background: rgb(15 15 18);
    border-top: 1px solid rgba(255,255,255,.05);
    padding: 1rem 0;
    font-size: 14px;
    color: #6b7280;
}
.footer-links a{color:#6b7280;margin-left:1rem;text-decoration:none}
.footer-links a:hover{color:#1ab8b8}


.form-control {
    display: block;
    width: 100%;
    padding: 16px .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.widget-fixed{
  position:fixed;
  bottom:1.5rem;
  right:1.5rem;
  z-index:9999;
}

.widget-box{
  background:#0f0f12;
  border:1px solid #1ab8b8;
  padding:1rem;
  border-radius:10px;
  box-shadow:0 0 20px rgba(26,184,184,.3);
  max-width:260px;
  cursor:pointer;
  transition:.3s;
}
.widget-box:hover{
  box-shadow:0 0 35px rgba(26,184,184,.6);
}

.widget-close{
  position:absolute;
  top:-10px;
  right:-10px;
  width:24px;
  height:24px;
  background:#000;
  border:1px solid rgba(255,255,255,.2);
  border-radius:50%;
  color:#fff;
  font-size:12px;
}
.widget-close:hover{
  background:#1ab8b8;
  color:#000;
}

.widget-icon{
  font-size:22px;
  color:#1ab8b8;
  margin-top:2px;
}

.widget-title{
  color:#fff;
  font-size:14px;
  font-weight:700;
  margin-bottom:4px;
}

.widget-text{
  font-size:12px;
  color:#9ca3af;
  margin-bottom:6px;
}

.widget-link{
  color:#1ab8b8;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  display:inline-flex;
  gap:4px;
  transition:.3s;
}
.widget-box:hover .widget-link{gap:10px;}

.material-symbols-outlined {
    font-size: 45px !important;
}
.mini-card h4 {
    color: #fff;
    margin-bottom: 5px;
}
.mini-card p {
    color: #9ca3af;
    font-size: 14px;
    line-height: 1.6;
}
.work-view .material-symbols-outlined {
    font-size: 24px !important;
}
.work-arrow .material-symbols-outlined {
    font-size: 24px !important;
}
.footer-form {
   position: relative;
}
ul.app-list li {
  display: flex;
  align-items: center;
}
ul.app-list li:before {
    content: "";
    width: 6px;
    height: 6px;
    background: var(--teal);
    display: inline-block;
    margin-right: 10px;
    box-shadow: 0 0 6px var(--teal);
}

#backToTop {
  position: fixed;
  bottom: 25px;
  right: 25px;
  width: 45px;
  height: 45px;
  background: var(--teal);
  color: #fff;
  border: none;
  border-radius: 50%;
  font-size: 20px;
  cursor: pointer;
  opacity: 0;
  transform: scale(0);
  pointer-events: none;
  transition: all 0.3s ease;
  z-index: 9999;
}

#backToTop.show {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
}

#backToTop:hover {
  background: #2a6f84;
}
.footer-links {
    font-size: 14px;
}
.mega-wrapper { position: relative; }

.mega-menu {
  position: absolute;
  top: 120%;
  left: 50%;
  transform: translateX(-50%);
  width: 900px;
  background: #050a18;
  border-radius: 16px;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  transition: .25s ease;
  z-index: 999;
}

.mega-menu h6 {
  color: #7dd3fc;
  margin-bottom: 10px;
}

.mega-menu a {
  display: block;
  color: #cfe3ff;
  text-decoration: none;
  margin-bottom: 8px;
  font-size: 14px;
}

.mega-menu a:hover { color: #7dd3fc; }

@media (min-width: 992px) {
  .mega-wrapper:hover .mega-menu {
    opacity: 1;
    visibility: visible;
    top: 100%;
  }
}

/* Mobile click */
@media (max-width: 991px) {
  .mega-menu {
    position: static;
    transform: none;
    width: 100%;
    opacity: 1;
    visibility: visible;
    display: none;
    margin-top: 10px;
  }
  .mega-wrapper.open .mega-menu { display: block; }
}

.menu-item.mega-toggle .material-symbols-outlined {
    font-size: 25px !important;
}
.menu-item.mega-toggle {
    display: flex;
    align-items: center;
    gap: 5px;
}
.menu-item {
    text-decoration: none;
    color: #000;
    padding: 20px 15px;
    transition: 0.5s all;
    position: relative;
}
.menu-item:before {
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    transition: 0.5s all;
    background: var(--teal);
}
.menu-item:hover:before {
    width: 100%;
}
.menu-item:hover {
    color: var(--teal);
}
.active {
    border-bottom: 2px solid var(--teal);
}
.menu-item.active:hover {
    border-bottom: 0;
}
label {
    display: block;
    text-align: left;
    margin-bottom: 5px;
}
a {
    text-decoration: none;
}

.contact-image {
    margin-right: 70px;
}
