:root {
      --bg: #080a12;
      --surface: #111522;
      --muted: #9ba3b7;
      --white: #f8f9ff;
      --purple: #a78bfa;
      --cyan: #67e8f9;
      --pink: #f0abfc;
    }

    * { box-sizing: border-box; }

    body {
      margin: 0;
      background: var(--bg);
      color: var(--white);
      font-family: 'Inter', sans-serif;
      overflow-x: hidden;
    }

    a { text-decoration: none; }

    /* Navigation */
    .navbar {
      padding: 24px 0;
      position: relative;
      z-index: 10;
    }

    .ai-scene {
  position: relative;
  width: min(92vw, 650px);
  aspect-ratio: 1.45 / 1;
  display: grid;
  place-items: center;
  isolation: isolate;
}
.ambient-glow {
  position: absolute;
  z-index: -2;
  width: 55%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: conic-gradient(from 0deg, var(--cyan), var(--blue), var(--purple), var(--pink), var(--orange), var(--cyan));
  filter: blur(62px);
  opacity: .24;
  animation: aura 7s ease-in-out infinite alternate;
}

    .brand {
      display: flex;
      align-items: center;
      gap: 10px;
      color: white;
      font-size: 22px;
      font-weight: 800;
      letter-spacing: -1px;
    }

    .brand-mark {
      display: grid;
      place-items: center;
      width: 37px;
      height: 37px;
      border-radius: 12px;
      background: linear-gradient(135deg, #8b5cf6, #22d3ee, #ec4899);
      color: #090b14;
      font-size: 21px;
      font-weight: 900;
    }

    .nav-link {
      color: #aeb5c8;
      font-size: 13px;
      transition: color .25s;
    }

    .nav-link:hover { color: white; }

    .btn-gradient {
      color: #080a12;
      background: linear-gradient(100deg, #c4b5fd, #67e8f9);
      border: 0;
      border-radius: 10px;
      padding: 13px 21px;
      font-size: 13px;
      font-weight: 700;
      transition: transform .25s, box-shadow .25s;
    }

    .btn-gradient:hover {
      color: #080a12;
      transform: translateY(-2px);
      box-shadow: 0 8px 35px #8b5cf644;
    }

    .btn-outline-dark {
      border: 1px solid #303548;
      color: #f5f5ff;
      background: #11152280;
      border-radius: 10px;
      padding: 12px 21px;
      font-size: 13px;
      font-weight: 600;
    }

    .btn-outline-dark:hover {
      color: white;
      border-color: #8b7af5;
      background: #17182a;
    }

    /* Hero */
    .hero {
      position: relative;
      isolation: isolate;
      min-height: 760px;
      padding: 68px 0 90px;
      overflow: hidden;
      background-image:
        linear-gradient(#ffffff06 1px, transparent 1px),
        linear-gradient(90deg, #ffffff06 1px, transparent 1px);
      background-size: 54px 54px;
    }

    .hero::before {
      content: "";
      position: absolute;
      width: 650px;
      height: 650px;
      top: 70px;
      left: 50%;
      transform: translateX(-50%);
      background: radial-gradient(
        circle, #703dcb22 0%, #322a8220 35%,
        transparent 70%
      );
      z-index: -1;
      pointer-events: none;
    }

    .hero-content {
      position: relative;
      z-index: 2;
    }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding: 9px 14px;
      border: 1px solid #a78bfa35;
      border-radius: 100px;
      background: #a78bfa0c;
      color: #c8baff;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 1.8px;
    }

    .live-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #6ee7b7;
      box-shadow: 0 0 12px #6ee7b7;
      animation: pulse 2s infinite;
    }

    .hero h1 {
      margin: 27px 0 20px;
      font-size: clamp(43px, 6.5vw, 78px);
      line-height: 1.05;
      font-weight: 800;
      letter-spacing: -5px;
    }

    .gradient-text {
      background: linear-gradient(
        100deg, #c4b5fd 5%, #67e8f9 48%, #f0abfc 90%
      );
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }

    .hero-description {
      max-width: 560px;
      margin: 0 auto;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.9;
    }

    .hero-actions {
      margin-top: 30px;
    }

    .trust-line {
      color: #858da3;
      font-size: 11px;
      margin-top: 20px;
    }

    /* Animated AI logo */
    .ai-stage {
      position: relative;
      width: min(100%, 540px);
      aspect-ratio: 1 / .84;
      margin: 16px auto 0;
      display: grid;
      place-items: center;
      perspective: 900px;
    }

    .ai-halo {
      position: absolute;
      width: 75%;
      aspect-ratio: 1;
      border-radius: 50%;
      background: conic-gradient(
        from 0deg,
        #8b5cf6, #22d3ee, #ec4899,
        #fbbf24, #8b5cf6
      );
      filter: blur(65px);
      opacity: .19;
      animation: breathe 5s ease-in-out infinite;
    }

    .orbit {
  position: absolute;
  width: 82%;
  height: 68%;
  border: 1px solid #4569ff45;
  border-radius: 50%;
  transform: rotate(-18deg);
}
.orbit.orbit-b {
  width: 95%;
  height: 77%;
  border-color: #28dff044;
  transform: rotate(17deg);
  animation: orbit-turn 18s linear infinite;
}
.orbit.orbit-c {
  width: 72%;
  height: 91%;
  border-color: #b05cff40;
  transform: rotate(64deg);
  animation: orbit-turn 24s linear infinite reverse;
}
.orbit.orbit-d {
  width: 61%;
  height: 55%;
  border-style: dashed;
  border-color: #7b63ff45;
  transform: rotate(-40deg);
}

    .orbit.orbit-two {
      width: 92%;
      border-color: #67e8f921;
      transform: rotateX(68deg) rotateZ(35deg);
      animation: orbit-spin 24s linear infinite;
    }

    .orbit.orbit-three {
      width: 67%;
      border-style: dashed;
      border-color: #f0abfc25;
      transform: rotateX(55deg) rotateZ(75deg);
      animation: orbit-spin 35s linear infinite reverse;
    }

    
.orbit-dot {
  position: absolute;
  top: 6%;
  left: 23%;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #62f5ff;
  box-shadow: 0 0 8px 3px #43dfff9c, 0 0 25px #43dfff;
  animation: dot-pulse 2.5s ease-in-out infinite;
}

.orbit-dot.dot-two {
  top: auto;
  left: auto;
  right: 10%;
  bottom: 22%;
  background: #ff7ce7;
  box-shadow: 0 0 8px 3px #ff65dc99, 0 0 25px #ff65dc;
  animation-delay: -1s;
}
.orbit-dot.dot-three {
  top: 78%;
  left: 18%;
  width: 7px;
  height: 7px;
  background: #9677ff;
  box-shadow: 0 0 15px #9677ff;
  animation-delay: -.7s;
}
    

    .orbit-dot.pink {
      top: 71%;
      left: 83%;
      width: 8px;
      height: 8px;
      background: #f0abfc;
      box-shadow: 0 0 25px 7px #f0abfc66;
    }

    .ai-logo {
      position: relative;
      z-index: 2;
      width: 49%;
      aspect-ratio: 1;
      display: grid;
      place-items: center;
      animation: float 6s ease-in-out infinite;
      filter: drop-shadow(0 0 30px #8b5cf655);
    }

    .ai-logo svg {
      width: 100%;
      height: 100%;
      overflow: visible;
    }

    .logo-ring {
      fill: none;
      stroke: url(#aiGradient);
      stroke-width: 1.5;
      opacity: .65;
      transform-origin: 100px 100px;
      animation: logo-spin 18s linear infinite;
    }

    .logo-core {
  position: relative;
  z-index: 2;
  width: 46%;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  animation: core-float 5s ease-in-out infinite;
}

.logo-core::before {
  content: "";
  position: absolute;
  inset: 18%;
  border-radius: 50%;
  background: radial-gradient(circle at 36% 25%, #28216e, #080a20 72%);
  border: 1px solid #a9a0ff40;
  box-shadow:
    0 0 28px #665aff50,
    inset 0 0 32px #6a42ff25,
    0 0 70px #3d39ff25;
}

    .logo-letter {
      fill: url(#aiGradient);
      font-family: Inter, sans-serif;
      font-weight: 800;
      font-size: 67px;
      letter-spacing: -7px;
    }

    .logo-spark {
      fill: #fff;
      filter: drop-shadow(0 0 8px #67e8f9);
    }

    .ribbon-svg {
  position: absolute;
  inset: -7%;
  width: 114%;
  height: 114%;
  overflow: visible;
  filter: drop-shadow(0 0 5px #aa7aff75);
}

.ribbon {
  fill: none;
  stroke: url(#rainbow);
  stroke-width: 12;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .88;
  transform-box: fill-box;
  transform-origin: center;
  animation: ribbon-breathe 7s ease-in-out infinite;
}
.ribbon.r2 { animation-delay: -1.75s; opacity: .84; }
.ribbon.r3 { animation-delay: -3.5s; opacity: .8; }
.ribbon.r4 { animation-delay: -5.25s; opacity: .86; }
.ribbon-highlight {
  fill: none;
  stroke: url(#shine);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .62;
  transform-box: fill-box;
  transform-origin: center;
  animation: ribbon-breathe 7s ease-in-out infinite reverse;
}

.ai-word {
  position: relative;
  z-index: 3;
  margin-top: -2%;
  font-size: clamp(52px, 10vw, 94px);
  font-weight: 850;
  line-height: 1;
  letter-spacing: -7px;
  padding-right: 7px;
  color: #f8fbff;
  background: linear-gradient(180deg, #fff 15%, #dbe5ff 58%, #9c9cff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 4px #fff) drop-shadow(0 0 14px #6b85ff) drop-shadow(0 0 27px #a34fff);
}

.scene-caption {
  position: absolute;
  bottom: 0;
  color: #8f9ebd;
  font-size: 10px;
  letter-spacing: 3px;
  text-transform: uppercase;
}
    /* Floating info cards */
    .float-card {
      position: absolute;
      z-index: 4;
      display: flex;
      align-items: center;
      gap: 11px;
      min-width: 180px;
      padding: 13px 15px;
      border: 1px solid #ffffff14;
      border-radius: 14px;
      background: #121625d9;
      backdrop-filter: blur(18px);
      box-shadow: 0 15px 55px #0005;
      animation: card-float 5s ease-in-out infinite;
    }

    .card-left {
      left: -1%;
      top: 26%;
    }

    .card-right {
      right: -2%;
      bottom: 23%;
      animation-delay: -2.5s;
    }

    .card-icon {
      width: 38px;
      height: 38px;
      display: grid;
      place-items: center;
      border-radius: 11px;
      font-size: 19px;
      background: #8b5cf626;
    }

    .card-title {
      color: #f4f5ff;
      font-size: 11px;
      font-weight: 700;
    }

    .card-subtitle {
      color: #8e98b0;
      font-size: 9px;
      margin-top: 4px;
    }

    /* Industry tags */
    .industry-row {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
      margin-top: 4px;
    }

    .industry-pill {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 10px 15px;
      border: 1px solid #ffffff12;
      border-radius: 9px;
      background: #ffffff05;
      color: #c3c9d9;
      font-size: 11px;
      font-weight: 500;
    }

    .industry-pill span {
      font-size: 15px;
    }

    /* Animations */

    @keyframes aura {
  from { transform: scale(.85) rotate(0); opacity: .17; }
  to { transform: scale(1.15) rotate(35deg); opacity: .3; }
}
@keyframes orbit-turn {
  from { rotate: 0deg; }
  to { rotate: 360deg; }
}
@keyframes core-float {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -9px; }
}
@keyframes ribbon-breathe {
  0%, 100% { scale: .99; }
  50% { scale: 1.025; }
}
@keyframes dot-pulse {
  0%, 100% { transform: scale(.8); opacity: .7; }
  50% { transform: scale(1.3); opacity: 1; }
}
@media (max-width: 600px) {
  .ai-scene { width: 100vw; aspect-ratio: 1 / 1; }
  .logo-core { width: 49%; }
  .scene-caption { bottom: 3%; font-size: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
    @keyframes float {
      0%, 100% { transform: translateY(0) rotateY(-5deg); }
      50% { transform: translateY(-13px) rotateY(5deg); }
    }

    @keyframes card-float {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-10px); }
    }

    @keyframes breathe {
      0%, 100% { transform: scale(.88); opacity: .13; }
      50% { transform: scale(1.12); opacity: .27; }
    }

    @keyframes orbit-spin {
      to { rotate: 360deg; }
    }

    @keyframes logo-spin {
      to { rotate: 360deg; }
    }

    @keyframes pulse {
      50% { opacity: .45; }
    }

    /* Mobile */
    @media (max-width: 767px) {
      .navbar { padding: 18px 0; }

      .hero {
        min-height: auto;
        padding: 55px 0 60px;
      }

      .hero h1 {
        font-size: clamp(42px, 11vw, 60px);
        letter-spacing: -2.5px;
      }

      .hero-description {
        font-size: 13px;
        padding: 0 8px;
      }

      .ai-stage {
        width: 100%;
        margin-top: 20px;
      }

      .float-card {
        min-width: auto;
        padding: 9px 10px;
        gap: 7px;
      }

      .card-left { left: 0; top: 26%; }
      .card-right { right: 6%; bottom: 19%; }

      .card-icon {
        width: 30px;
        height: 30px;
        font-size: 15px;
      }

      .card-title { font-size: 9px; }
      .card-subtitle { font-size: 8px; }

      .btn-gradient, .btn-outline-dark {
        padding: 12px 15px;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
      }
    }

    
/* Two additional floating AI capability cards */
.card-inquiry {
  left: -3%;
  bottom: 13%;
  animation-delay: -1.5s;
  border-color: #a78bfa38;
}

.card-always {
  right: -2%;
  top: 12%;
  animation-delay: -3.5s;
  border-color: #34d39938;
}

/* Four cards need a little more breathing room */
.ai-stage {
  width: min(100%, 580px);
}

@media (max-width: 767px) {
  .card-inquiry {
    left: 0;
    bottom: 5%;
  }

  .card-always {
    right: 6%;
    top: 5%;
  }

  .float-card {
    max-width: 175px;
  }

  .ai-stage {
    margin-top: 32px;
    margin-bottom: 20px;
  }
}

@media (max-width: 380px) {
  .float-card {
    max-width: 148px;
    padding: 7px;
    gap: 5px;
  }

  .card-subtitle {
    max-width: 95px;
  }
}


/* Shared section styling */
.features-section,
.industry-section,
.process-section,
.social-proof-section {
  position: relative;
  border-top: 1px solid #ffffff0a;
  background: #080a12;
}

.industry-section,
.social-proof-section {
  background: #0b0e18;
}

.section-label {
  display: inline-block;
  color: #c4b5fd;
  border: 1px solid #a78bfa35;
  background: #a78bfa0b;
  border-radius: 50px;
  padding: 7px 12px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.6px;
}

.section-title {
  color: #f8f9ff;
  font-size: clamp(30px, 4vw, 45px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -1.8px;
}

.section-description {
  max-width: 560px;
  color: #969fb4;
  font-size: 14px;
  line-height: 1.8;
}

/* Feature cards */
.feature-card {
  padding: 27px 22px;
  border: 1px solid #ffffff12;
  border-radius: 16px;
  background: linear-gradient(145deg, #141827, #0c0f19);
  transition: transform .3s, border-color .3s;
}

.feature-card:hover {
  transform: translateY(-6px);
  border-color: #a78bfa60;
}

.feature-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  font-size: 23px;
  margin-bottom: 25px;
  background: #a78bfa15;
}

.icon-cyan { color: #67e8f9; background: #67e8f915; }
.icon-purple { color: #c4b5fd; }
.icon-pink { color: #f0abfc; background: #f0abfc15; }
.icon-green { color: #6ee7b7; background: #6ee7b715; }

.feature-card h3,
.process-card h3 {
  color: #f2f4ff;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 12px;
}

.feature-card p,
.process-card p {
  color: #969fb4;
  font-size: 12px;
  line-height: 1.85;
}

.feature-tag {
  display: inline-block;
  margin-top: 10px;
  color: #bcb0ff;
  font-size: 10px;
}

/* Industry cards */
.industry-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 34px;
  min-height: 405px;
  border: 1px solid #ffffff16;
  border-radius: 20px;
  background: #101421;
}

.dental-card { border-color: #67e8f930; }
.salon-card { border-color: #f0abfc30; }

.industry-glow {
  position: absolute;
  z-index: -1;
  right: -100px;
  bottom: -130px;
  width: 350px;
  height: 350px;
  border-radius: 50%;
  background: radial-gradient(
    circle, #22d3ee1b, transparent 70%
  );
}

.salon-card .industry-glow {
  background: radial-gradient(
    circle, #d946ef20, transparent 70%
  );
}

.industry-content {
  position: relative;
  z-index: 2;
  max-width: 350px;
}

.industry-kicker {
  color: #a5e8fa;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1px;
}

.salon-card .industry-kicker {
  color: #e9a5ff;
}

.industry-card h3 {
  color: #f8f9ff;
  margin: 24px 0 15px;
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -1px;
}

.industry-card p {
  color: #a4adc0;
  font-size: 12px;
  line-height: 1.8;
}

.solution-list {
  list-style: none;
  padding: 0;
  margin: 22px 0;
}

.solution-list li {
  color: #c6ccdc;
  font-size: 11px;
  margin: 12px 0;
}

.dental-card .solution-list li::first-letter {
  color: #67e8f9;
}

.salon-card .solution-list li::first-letter {
  color: #f0abfc;
}

.industry-visual {
  position: absolute;
  right: 15px;
  bottom: 35px;
  width: 145px;
  height: 145px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  opacity: .8;
}

.dental-visual {
  background: radial-gradient(circle, #164a6545, transparent 70%);
}

.salon-visual {
  background: radial-gradient(circle, #762e8040, transparent 70%);
}

.visual-orb {
  display: grid;
  place-items: center;
  width: 82px;
  height: 82px;
  border: 1px solid #67e8f958;
  border-radius: 28px;
  background: linear-gradient(135deg, #67e8f91a, #a78bfa1a);
  color: #a9f1ff;
  font-size: 39px;
  box-shadow: 0 0 45px #67e8f91a;
  transform: rotate(-8deg);
  animation: float 6s ease-in-out infinite;
}

.salon-visual .visual-orb {
  border-color: #f0abfc58;
  color: #f0abfc;
  box-shadow: 0 0 45px #f0abfc1a;
}

.mini-notification {
  position: absolute;
  bottom: -3px;
  right: 0;
  width: 190px;
  padding: 12px;
  border: 1px solid #ffffff1c;
  border-radius: 11px;
  background: #141827ed;
  color: #d8deee;
  font-size: 9px;
  box-shadow: 0 10px 35px #0004;
}

.notification-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  border-radius: 50%;
  background: #6ee7b7;
}

/* Four-step process */
.process-grid {
  position: relative;
}

.process-card {
  height: 100%;
  padding: 26px 22px;
  border: 1px solid #ffffff12;
  border-radius: 15px;
  background: #101421;
}

.process-number {
  color: #b9a5ff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
}

.process-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin: 22px 0;
  border-radius: 14px;
  border: 1px solid #a78bfa35;
  background: #a78bfa12;
  color: #c4b5fd;
  font-size: 22px;
}

/* Testimonials */
.quote-card {
  padding: 27px;
  border: 1px solid #ffffff12;
  border-radius: 16px;
  background: linear-gradient(145deg, #131827, #0b0f19);
}

.quote-mark {
  color: #b9a5ff;
  font-size: 40px;
  line-height: 1;
  font-weight: 800;
}

.quote-card > p {
  min-height: 105px;
  margin: 14px 0 25px;
  color: #bbc2d3;
  font-size: 12px;
  line-height: 1.9;
}

.quote-person {
  display: flex;
  align-items: center;
  gap: 12px;
}

.quote-avatar {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 800;
}

.avatar-blue { color: #67e8f9; background: #164e6380; }
.avatar-purple { color: #c4b5fd; background: #4c1d9580; }
.avatar-pink { color: #f0abfc; background: #701a7580; }

.quote-person strong,
.quote-person span {
  display: block;
}

.quote-person strong {
  color: #f3f4ff;
  font-size: 11px;
}

.quote-person span {
  color: #858da3;
  margin-top: 5px;
  font-size: 10px;
}

/* CTA */
.cta-banner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 65px 22px;
  border: 1px solid #a78bfa35;
  border-radius: 24px;
  background: linear-gradient(135deg, #121328, #101725, #151025);
}

.cta-glow {
  position: absolute;
  z-index: -1;
  left: 50%;
  top: -210px;
  transform: translateX(-50%);
  width: 550px;
  height: 350px;
  border-radius: 50%;
  background: #8b5cf624;
  filter: blur(65px);
}

/* Footer */
.site-footer {
  border-top: 1px solid #ffffff12;
  background: #070910;
}

.footer-description {
  max-width: 330px;
  color: #9099ae;
  font-size: 12px;
  line-height: 1.9;
}

.footer-status {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 22px;
  color: #a8b2c7;
  font-size: 10px;
}

.footer-heading {
  margin: 8px 0 23px;
  color: #f2f4ff;
  font-size: 12px;
  font-weight: 700;
}

.footer-link {
  display: block;
  width: fit-content;
  margin: 13px 0;
  color: #9099ae;
  font-size: 11px;
  transition: color .2s;
}

.footer-link:hover,
.footer-email:hover {
  color: #c4b5fd;
}

.footer-email {
  color: #a9e9fa;
  font-size: 12px;
}

.footer-socials {
  display: flex;
  gap: 10px;
}

.footer-socials a {
  display: grid;
  place-items: center;
  width: 33px;
  height: 33px;
  border: 1px solid #ffffff18;
  border-radius: 9px;
  color: #c7cde0;
  font-size: 12px;
  font-weight: 700;
  transition: all .2s;
}

.footer-socials a:hover {
  background: #a78bfa20;
  border-color: #a78bfa70;
  color: white;
}

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 23px 0;
  border-top: 1px solid #ffffff10;
}

.footer-bottom p {
  margin: 0;
  color: #777f94;
  font-size: 10px;
}

.footer-bottom .footer-link {
  margin: 0;
  font-size: 10px;
}

/* Responsive refinements */
@media (max-width: 991px) {
  .industry-visual {
    right: 0;
    bottom: 12px;
    opacity: .38;
  }

  .industry-content {
    max-width: 100%;
  }

  .industry-card {
    padding: 28px;
  }
}

@media (max-width: 575px) {
  .section-title {
    letter-spacing: -1px;
  }

  .industry-card {
    min-height: 440px;
    padding: 24px 20px;
  }

  .industry-visual {
    right: -12px;
    bottom: 0;
    opacity: .22;
  }

  .industry-content {
    max-width: 100%;
  }

  .solution-list li {
    font-size: 10px;
  }

  .quote-card > p {
    min-height: auto;
  }

  .cta-banner {
    padding: 45px 18px;
  }

  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* Target the links inside your custom site-nav class */
.site-nav .navbar-nav .nav-link {
  position: relative;
  padding-bottom: 0.25rem; /* Space between text and underline */
}

/* Create the invisible baseline state */
.site-nav .navbar-nav .nav-link::after {
  content: '';
  position: absolute;
  width: 100%;
  transform: scaleX(0);
  height: 2px; /* Thickness of the underline */
  bottom: 0;
  left: 0;
  background-color: #6f42c1; /* Bootstrap's default purple, or use your custom hex like #8a2be2 */
  transform-origin: bottom center;
  transition: transform 0.25s ease-out; /* Smooth slide-out animation */
}

/* Animate the underline to full width on hover */
.site-nav .navbar-nav .nav-link:hover::after {
  transform: scaleX(1);
}

/* Optional: Keep the link text bright on hover */
.site-nav .navbar-nav .nav-link:hover {
  color: #fff !important; 
}