section {
  margin-bottom: clamp(60px, 8vw, 140px);
}

.gs-aura-hero {
  --gsa-ink: #072d23;
  --gsa-green: #13d57d;
  --gsa-text: #78827f;

  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 76px 28px 28px;
  background: #fff;
  color: var(--gsa-ink);
  font-family: "Inter", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.gs-aura-hero,
.gs-aura-hero * {
  box-sizing: border-box;
}

/* Faint vertical lines, fading toward the bottom */
.gs-aura-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 70px 0 0;
  background: repeating-linear-gradient(90deg,
      transparent 0,
      transparent 18px,
      #e8faf1 18px,
      #e8faf1 19px);
  mask-image: linear-gradient(transparent,
      rgb(0 0 0 / 45%) 25%,
      rgb(0 0 0 / 18%) 65%,
      transparent);
  pointer-events: none;
}

.gsa-background-word {
  position: absolute;
  z-index: -1;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  color: #f0fbf5;
  font-size: clamp(180px, 27vw, 430px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.08em;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
}

.gsa-container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
}

.gsa-header {
  max-width: 1220px;
  margin-inline: auto;
  text-align: center;
}

.gsa-eyebrow {
  display: block;
  margin-bottom: 20px;
  color: #149b62;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}

.gsa-header h1 {
  margin: 0;
  color: var(--gsa-ink);
  font-size: clamp(30px, 3vw, 44px);
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.gsa-header h1>span {
  color: #0aae66;
}

.gsa-description {
  max-width: 850px;
  margin: 22px auto 0;
  color: var(--gsa-text);
  font-size: 16px;
  line-height: 1.75;
}

.gsa-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 26px;
}

.gsa-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 12px 23px;
  border: 1.5px solid transparent;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.5;
  text-decoration: none;
  transition: transform 180ms ease, background-color 180ms ease;
}

.gsa-button-primary {
  background: #20e28a;
  border-color: #20e28a;
  color: #073b25;
}

.gsa-button-primary:hover {
  background: #12d67c;
  transform: translateY(-2px);
}

.gsa-button-secondary {
  background: #fff;
  border-color: #315a4c;
  color: #284c3e;
}

.gsa-button-secondary:hover {
  background: #f1fbf5;
  transform: translateY(-2px);
}

.gsa-button svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gsa-button:focus-visible {
  outline: 3px solid #178953;
  outline-offset: 4px;
}

/* Three equally aligned conversation stages */
.gsa-conversation {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 36px;
}

.gsa-stage {
  min-width: 0;
}

.gsa-stage-heading {
  min-height: 57px;
  text-align: center;
}

.gsa-stage-heading h2 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  margin: 0;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.5;
  letter-spacing: 0.26em;
  text-transform: uppercase;
}

.gsa-stage-heading h2>span {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  border-radius: 50%;
  background: var(--gsa-green);
}

.gsa-stage-heading p {
  margin: 6px 0 0;
  color: #8b9490;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: 0.08em;
}

.gsa-wave-area {
  position: relative;
  height: 150px;
}

.gsa-wave {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.gsa-wave-baseline {
  fill: none;
  stroke: #2ee48e;
  stroke-width: 2;
  stroke-dasharray: 1 6;
  stroke-linecap: round;
}

.gsa-wave-bars line {
  stroke: #38eb9b;
  stroke-width: 2;
  stroke-linecap: round;
}

.gsa-aura-mark {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, #fff 40%, #f4fff8 65%, transparent 72%);
}

.gsa-aura-mark svg {
  width: 55px;
  height: 55px;
  fill: var(--gsa-ink);
}

.gsa-dialogue {
  margin: 8px 12px 0;
  color: #7b8580;
  font-size: 13px;
  line-height: 1.6;
  text-align: center;
}

.gsa-dialogue strong {
  color: #0aaf67;
  font-weight: 700;
}

/* Outcomes align with the waveform centre line */
.gsa-outcome-flow {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) 132px;
  align-items: center;
  gap: 12px;
  height: 150px;
  padding-left: 12px;
}

.gsa-outcome-line {
  position: absolute;
  top: 50%;
  left: 0;
  right: 65px;
  border-top: 3px dotted #2fdc8c;
}

.gsa-outcome-icon {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 48px;
  height: 58px;
  margin-inline: auto;
  background: #fff;
}

.gsa-outcome-icon svg {
  width: 42px;
  height: 42px;
  stroke: #25583f;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gsa-green-stroke {
  stroke: #18cb77;
}

.gsa-result {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 132px;
  height: 132px;
  border: 1.5px solid #376b52;
  border-radius: 50%;
  background: #fff;
}

.gsa-result>svg {
  width: 36px;
  height: 36px;
  margin-bottom: 7px;
  stroke: #14c977;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gsa-result p {
  margin: 0;
  color: #315340;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.65;
  letter-spacing: 0.08em;
  text-align: center;
  text-transform: uppercase;
}

.gsa-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 68px;
}

.gsa-footer svg {
  width: 23px;
  height: 27px;
  flex: 0 0 23px;
  stroke: #1bd184;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gsa-footer p {
  margin: 0;
  color: #8a938e;
  font-size: 11px;
  line-height: 1.7;
}

.gsa-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .gsa-outcome-flow {
    grid-template-columns: repeat(3, minmax(0, 1fr)) 108px;
    gap: 6px;
    padding-left: 5px;
  }

  .gsa-result {
    width: 108px;
    height: 108px;
  }

  .gsa-result p {
    font-size: 9px;
  }

  .gsa-outcome-icon {
    width: 38px;
  }

  .gsa-outcome-icon svg {
    width: 34px;
    height: 34px;
  }

  .gsa-description {
    font-size: 15px;
  }
}

@media (max-width: 800px) {
  .gs-aura-hero {
    padding: 48px 24px 28px;
  }

  .gsa-desktop-break {
    display: none;
  }

  .gsa-header h1 {
    font-size: clamp(30px, 5vw, 40px);
  }

  .gsa-conversation {
    grid-template-columns: 1fr;
    gap: 28px;
    max-width: 620px;
    margin-inline: auto;
    margin-top: 36px;
  }

  .gsa-wave-area {
    height: 130px;
  }

  .gsa-stage-heading {
    min-height: auto;
  }

  .gsa-outcome-flow {
    grid-template-columns: repeat(3, minmax(0, 1fr)) 132px;
    gap: 12px;
    margin-top: 16px;
    padding-left: 0;
  }

  .gsa-result {
    width: 132px;
    height: 132px;
  }

  .gsa-result p {
    font-size: 10px;
  }

  .gsa-outcome-icon {
    width: 48px;
  }

  .gsa-outcome-icon svg {
    width: 42px;
    height: 42px;
  }

  .gsa-footer {
    margin-top: 36px;
    align-items: flex-start;
  }

  .gsa-footer p {
    max-width: 500px;
  }
}

@media (max-width: 480px) {
  .gs-aura-hero {
    padding-inline: 20px;
  }

  .gsa-eyebrow {
    font-size: 9px;
    letter-spacing: 0.18em;
  }

  .gsa-header h1 {
    font-size: 30px;
  }

  .gsa-description {
    font-size: 14px;
  }

  .gsa-actions {
    flex-direction: column;
    gap: 10px;
  }

  .gsa-button {
    width: 100%;
    font-size: 13px;
  }

  .gsa-outcome-flow {
    grid-template-columns: repeat(3, minmax(0, 1fr)) 105px;
    gap: 5px;
  }

  .gsa-result {
    width: 105px;
    height: 105px;
  }

  .gsa-result p {
    font-size: 8px;
  }

  .gsa-result>svg {
    width: 29px;
    height: 29px;
  }

  .gsa-outcome-icon {
    width: 36px;
  }

  .gsa-outcome-icon svg {
    width: 32px;
    height: 32px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gsa-button {
    transition: none;
  }
}

.gs-aura-about {
  --gsaa-ink: #082d24;
  --gsaa-green: #5cec9f;
  --gsaa-muted: #8cab9d;

  padding: 48px 28px;
  background: #fff;
  color: var(--gsaa-ink);
  font-family: "Inter", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.gs-aura-about,
.gs-aura-about * {
  box-sizing: border-box;
}

.gsaa-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.gsaa-container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
}

.gsaa-header {
  margin-bottom: 26px;
  text-align: center;
}

.gsaa-eyebrow {
  display: block;
  margin-bottom: 18px;
  color: #169b66;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.gsaa-header h2 {
  margin: 0;
  font-size: clamp(28px, 2.8vw, 42px);
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.gsaa-header>p {
  margin: 14px auto 0;
  max-width: 1250px;
  color: #637b70;
  font-size: 17px;
  line-height: 1.65;
}

/* Dark diagram panel */
.gsaa-panel {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) 225px;
  align-items: stretch;
  gap: 28px;
  padding: 28px;
  border: 1px solid #1c5541;
  border-radius: 20px;
  background: #053326;
  color: #fff;
}

.gsaa-alternatives {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding-right: 24px;
  border-right: 1px solid #376052;
  text-align: center;
}

.gsaa-alternative {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  color: #93b1a1;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.gsaa-crossed-icon {
  position: relative;
  display: block;
  width: 55px;
  height: 55px;
}

.gsaa-crossed-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: #8cab9d;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gsaa-crossed-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 67px;
  height: 1.5px;
  background: #8cab9d;
  transform: rotate(42deg);
}

.gsaa-alternatives>small {
  margin-top: -10px;
  color: #87a696;
  font-size: 12px;
}

.gsaa-anatomy {
  min-width: 0;
}

.gsaa-panel-title {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 0;
  color: #dceee4;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.5;
  letter-spacing: 0.15em;
  text-align: center;
  text-transform: uppercase;
}

.gsaa-panel-title::before,
.gsaa-panel-title::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #286e50;
}

/* Shared rows align all icons, headings and descriptions */
.gsaa-process {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  list-style: none;
  margin: 36px 0 0;
  padding: 0;
}

.gsaa-process>li {
  position: relative;
  display: grid;
  grid-template-rows: 82px 42px auto;
  justify-items: center;
  align-items: start;
  min-width: 0;
  text-align: center;
}

.gsaa-process-icon {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 66px;
  height: 76px;
  background: #053326;
}

.gsaa-process-icon>svg {
  width: 53px;
  height: 53px;
  fill: none;
  stroke: var(--gsaa-green);
  stroke-width: 2.3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gsaa-call .gsaa-process-icon {
  width: 78px;
  height: 78px;
  border-radius: 50%;
  background: #55ee9c;
}

.gsaa-call .gsaa-process-icon>svg {
  width: 43px;
  height: 43px;
  fill: #06462c;
  stroke: none;
}

.gsaa-process h4 {
  margin: 8px 0 0;
  color: #e5f4eb;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.gsaa-process p {
  max-width: 140px;
  margin: 8px 0 0;
  color: #96b7a4;
  font-size: 12px;
  line-height: 1.5;
}

.gsaa-connector {
  position: absolute;
  z-index: 0;
  top: 28px;
  left: calc(50% + 28px);
  width: calc(100% - 44px);
  height: 24px;
  fill: none;
  stroke: #4cdf92;
  stroke-width: 1.2;
  stroke-linecap: round;
  opacity: 0.8;
}

/* Outcomes */
.gsaa-outcomes {
  align-self: center;
  padding: 4px 0 4px 24px;
  border-left: 1px solid #376052;
}

.gsaa-outcomes h3 {
  margin: 0 0 26px;
  color: #dceee4;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gsaa-outcomes ul {
  display: grid;
  gap: 17px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.gsaa-outcomes li {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #e3f0e9;
  font-size: 14px;
  line-height: 1.4;
}

.gsaa-outcomes li>span {
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  border-radius: 50%;
  background: #6aefa7;
  color: #06472c;
  font-size: 20px;
  font-weight: 700;
}

/* Explanatory paragraphs */
.gsaa-copy {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 54px;
  margin: 28px 30px 0;
}

.gsaa-copy p {
  margin: 0;
  color: #4f6269;
  font-size: 15px;
  line-height: 1.75;
}

.gsaa-copy p+p {
  padding-left: 54px;
  border-left: 1px solid #cde8db;
}

/* Bottom statement */
.gsaa-summary {
  position: relative;
  margin-top: 26px;
  padding: 21px 26px 21px 50px;
  border-radius: 14px;
  background: #edf9f2;
}

.gsaa-summary::before {
  content: "";
  position: absolute;
  top: 20px;
  bottom: 20px;
  left: 26px;
  width: 4px;
  border-radius: 4px;
  background: #24bc7b;
}

.gsaa-summary p {
  margin: 0;
  color: #10362a;
  font-size: clamp(20px, 1.9vw, 28px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -0.035em;
}

/* Smaller desktops */
@media (max-width: 1200px) {
  .gsaa-panel {
    grid-template-columns: 115px minmax(0, 1fr) 190px;
    gap: 18px;
    padding: 24px 20px;
  }

  .gsaa-alternatives {
    padding-right: 16px;
  }

  .gsaa-outcomes {
    padding-left: 16px;
  }

  .gsaa-process {
    gap: 8px;
  }

  .gsaa-process h4 {
    font-size: 10px;
  }

  .gsaa-process p {
    font-size: 11px;
  }

  .gsaa-outcomes li {
    gap: 9px;
    font-size: 12px;
  }

  .gsaa-panel-title {
    gap: 10px;
    font-size: 11px;
  }
}

/* Tablets */
@media (max-width: 950px) {
  .gs-aura-about {
    padding: 40px 24px;
  }

  .gsaa-panel {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 26px;
  }

  .gsaa-alternatives {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 30px;
    padding: 0 0 20px;
    border-right: 0;
    border-bottom: 1px solid #376052;
  }

  .gsaa-alternative {
    flex-direction: row;
    text-align: left;
  }

  .gsaa-crossed-icon {
    width: 40px;
    height: 40px;
  }

  .gsaa-crossed-icon::after {
    width: 50px;
  }

  .gsaa-alternatives>small {
    margin: 0;
  }

  .gsaa-process {
    margin-top: 24px;
  }

  .gsaa-process h4 {
    font-size: 11px;
  }

  .gsaa-process p {
    font-size: 12px;
  }

  .gsaa-outcomes {
    padding: 20px 0 0;
    border-left: 0;
    border-top: 1px solid #376052;
  }

  .gsaa-outcomes h3 {
    margin-bottom: 15px;
    text-align: center;
  }

  .gsaa-outcomes ul {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
  }

  .gsaa-outcomes li {
    justify-content: center;
  }

  .gsaa-copy {
    gap: 28px;
    margin-inline: 0;
  }

  .gsaa-copy p+p {
    padding-left: 28px;
  }
}

/* Phones */
@media (max-width: 600px) {
  .gs-aura-about {
    padding-inline: 20px;
  }

  .gsaa-eyebrow {
    font-size: 10px;
    margin-bottom: 12px;
  }

  .gsaa-header h2 {
    font-size: 29px;
  }

  .gsaa-header>p {
    font-size: 14px;
  }

  .gsaa-panel {
    padding: 22px 18px;
    border-radius: 16px;
  }

  .gsaa-alternatives {
    justify-content: space-between;
    gap: 16px;
  }

  .gsaa-alternative {
    gap: 8px;
    font-size: 9px;
  }

  .gsaa-alternatives>small {
    width: 100%;
    text-align: center;
  }

  .gsaa-panel-title {
    font-size: 10px;
    letter-spacing: 0.1em;
  }

  .gsaa-process {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .gsaa-process>li {
    grid-template-columns: 70px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 16px;
    justify-items: start;
    text-align: left;
  }

  .gsaa-process-icon,
  .gsaa-call .gsaa-process-icon {
    grid-row: 1 / 3;
    width: 64px;
    height: 64px;
  }

  .gsaa-process-icon>svg {
    width: 44px;
    height: 44px;
  }

  .gsaa-process h4 {
    align-self: end;
    margin-top: 4px;
    font-size: 12px;
  }

  .gsaa-process p {
    max-width: none;
    margin-top: 5px;
    font-size: 12px;
  }

  .gsaa-call h4 {
    align-self: center;
    grid-row: 1 / 3;
  }

  .gsaa-connector {
    display: none;
  }

  .gsaa-process>li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 69px;
    left: 31px;
    width: 1px;
    height: 15px;
    background: #4cdf92;
  }

  .gsaa-outcomes ul {
    grid-template-columns: 1fr;
    gap: 13px;
  }

  .gsaa-outcomes li {
    justify-content: flex-start;
    font-size: 13px;
  }

  .gsaa-outcomes h3 {
    text-align: left;
  }

  .gsaa-copy {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .gsaa-copy p {
    font-size: 14px;
  }

  .gsaa-copy p+p {
    padding: 22px 0 0;
    border-left: 0;
    border-top: 1px solid #cde8db;
  }

  .gsaa-summary {
    padding: 20px 20px 20px 35px;
  }

  .gsaa-summary::before {
    left: 17px;
    width: 3px;
  }

  .gsaa-summary p {
    font-size: 21px;
  }
}

@keyframes gsa-wave-pulse {

  0%,
  100% {
    transform: scaleY(0.7);
  }

  50% {
    transform: scaleY(1.15);
  }
}

.gsa-wave-bars line {
  transform-origin: center;
  animation: gsa-wave-pulse 1.2s ease-in-out infinite;
}

.gs-aura-how {
  --gsah-ink: #10372d;
  --gsah-green: #25ae76;

  padding: 48px 28px;
  background: #fff;
  color: var(--gsah-ink);
  font-family: "Inter", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.gs-aura-how,
.gs-aura-how * {
  box-sizing: border-box;
}

.gsah-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.gsah-container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
}

.gsah-header {
  margin-bottom: 38px;
  text-align: center;
}

.gsah-eyebrow {
  display: block;
  margin-bottom: 18px;
  color: #209b68;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase;
}

.gsah-header h2 {
  margin: 0;
  font-size: clamp(28px, 2.7vw, 40px);
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -0.035em;
  text-wrap: balance;
}

.gsah-header>p {
  margin: 13px 0 0;
  color: #788580;
  font-size: 17px;
  line-height: 1.6;
}

.gsah-diagram {
  display: grid;
  grid-template-columns:
    minmax(220px, 0.85fr) minmax(380px, 1.3fr) minmax(320px, 1.05fr);
  align-items: stretch;
  gap: 28px;
}

.gsah-label {
  margin: 0;
  color: #365b4e;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.gsah-foot-label {
  margin: 20px 0 0;
  color: #71857b;
  font-size: 9px;
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}

/* LEFT */
.gsah-connect {
  position: relative;
  padding: 18px 16px 20px;
  border-radius: 24px 100px 100px 24px;
  background: linear-gradient(110deg, #eefbf3, #f8fffb);
}

.gsah-tools {
  position: relative;
  display: grid;
  grid-template-rows: repeat(4, 90px);
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
}

.gsah-tools li {
  display: flex;
  align-items: center;
  gap: 16px;
  color: #315b48;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
}

.gsah-tool-icon {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  flex: 0 0 62px;
  border: 1px solid #c4edd6;
  border-radius: 50%;
  background: #fff;
}

.gsah-tool-icon svg {
  width: 30px;
  height: 30px;
}

.gsah-tool-icon svg,
.gsah-setting svg,
.gsah-action-icon svg,
.gsah-report>svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gsah-input-lines {
  position: absolute;
  top: 52px;
  right: -18px;
  width: 35%;
  height: 360px;
  pointer-events: none;
}

/* CENTRE */
.gsah-engine {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 18px 35px 12px;
  border-right: 11px solid #164e3a;
  border-left: 11px solid #164e3a;
  border-radius: 80px / 220px;
  background: radial-gradient(ellipse at center,
      #f4effb 0%,
      #fcfaff 45%,
      #fff 75%);
}

.gsah-engine>.gsah-label {
  text-align: center;
}

.gsah-engine-settings {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 25px;
}

.gsah-setting {
  display: flex;
  align-items: center;
  gap: 13px;
  color: #74608d;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
}

.gsah-setting svg {
  width: 33px;
  height: 33px;
  flex: 0 0 33px;
}

.gsah-core {
  position: relative;
  display: grid;
  place-items: center;
  height: 175px;
  margin-top: 18px;
}

.gsah-aura-logo {
  width: 120px;
  height: 130px;
  fill: #164e3a;
}

.gsah-core-wave {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: -55px;
  width: calc(100% + 110px);
  height: 85px;
  transform: translateY(-50%);
  pointer-events: none;
}

.gsah-intent {
  display: grid;
  gap: 5px;
  text-align: center;
  line-height: 1.5;
}

.gsah-intent strong {
  color: #24a36c;
  font-size: 13px;
  font-weight: 650;
}

.gsah-intent>span {
  color: #3d5047;
  font-size: 12px;
}

.gsah-settings-bottom {
  margin-top: 30px;
}

.gsah-engine>.gsah-foot-label {
  margin-top: auto;
  padding-top: 28px;
  text-align: center;
}

/* RIGHT */
.gsah-actions {
  padding: 18px 0 12px;
}

.gsah-actions>.gsah-label {
  text-align: center;
}

.gsah-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 42px 24px;
  margin-top: 30px;
}

.gsah-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  color: #345d63;
  font-size: 13px;
  font-weight: 550;
  line-height: 1.5;
  text-align: center;
}

.gsah-action-icon {
  position: relative;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 14px;
  background: #edf7f8;
  color: #3b858d;
}

.gsah-action-icon svg {
  width: 34px;
  height: 34px;
}

.gsah-booked i {
  position: absolute;
  right: -3px;
  bottom: -3px;
  display: grid;
  place-items: center;
  width: 23px;
  height: 23px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #37c989;
  color: #fff;
  font-size: 14px;
  font-style: normal;
}

.gsah-save-arrow {
  margin: 10px 0;
  color: #8cd8b4;
  font-size: 36px;
  line-height: 1;
  text-align: center;
}

.gsah-report-row {
  display: flex;
  align-items: center;
  gap: 14px;
}

.gsah-report {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
  padding: 16px;
  border: 1px solid #dcebed;
  border-radius: 13px;
  background: #f6fbfc;
  color: #3b777e;
}

.gsah-report>svg {
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
}

.gsah-report strong {
  display: block;
  font-size: 8px;
  font-weight: 650;
  line-height: 1.7;
  text-transform: uppercase;
}

.gsah-report div>span {
  display: block;
  margin-top: 4px;
  color: #76908c;
  font-size: 10px;
  line-height: 1.5;
}

.gsah-synced {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  flex: 0 0 70px;
  text-align: center;
}

.gsah-synced>span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #37c989;
  color: #fff;
  font-size: 22px;
}

.gsah-synced strong {
  color: #209b68;
  font-size: 9px;
  line-height: 1.5;
  text-transform: uppercase;
}

/* Bottom process summary */
.gsah-footer {
  margin-top: 36px;
  text-align: center;
}

.gsah-footer ol {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.gsah-footer li {
  display: flex;
  align-items: center;
  gap: 20px;
  color: #274a3d;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.5;
}

.gsah-footer li:not(:last-child)::after {
  content: "→";
  color: #28b57a;
  font-size: 22px;
  font-weight: 400;
}

.gsah-footer>p {
  margin: 12px 0 0;
  color: #7d8782;
  font-size: 14px;
  line-height: 1.6;
}

@media (max-width: 1150px) {
  .gsah-diagram {
    grid-template-columns:
      minmax(180px, 0.8fr) minmax(330px, 1.3fr) minmax(260px, 1fr);
    gap: 16px;
  }

  .gsah-engine {
    padding-inline: 24px;
    border-width: 8px;
  }

  .gsah-tools li {
    gap: 10px;
    font-size: 12px;
  }

  .gsah-tool-icon {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
  }

  .gsah-engine-settings {
    gap: 14px;
  }

  .gsah-setting {
    gap: 8px;
    font-size: 11px;
  }

  .gsah-report {
    padding: 12px;
  }

  .gsah-synced {
    flex-basis: 58px;
  }
}

/* Stack the diagram before its columns become cramped. */
@media (max-width: 900px) {
  .gs-aura-how {
    padding: 40px 24px;
  }

  .gsah-header>p {
    font-size: 15px;
  }

  .gsah-diagram {
    grid-template-columns: 1fr;
    gap: 28px;
    max-width: 660px;
    margin-inline: auto;
  }

  .gsah-connect {
    padding: 24px;
    border-radius: 20px;
  }

  .gsah-connect>.gsah-label,
  .gsah-connect>.gsah-foot-label {
    text-align: center;
  }

  .gsah-tools {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, 72px);
    gap: 12px;
  }

  .gsah-input-lines {
    display: none;
  }

  .gsah-engine {
    min-height: 440px;
    padding-inline: 35px;
    border-radius: 65px / 180px;
  }

  .gsah-setting {
    justify-content: center;
    font-size: 12px;
  }

  .gsah-core-wave {
    left: -30px;
    width: calc(100% + 60px);
  }

  .gsah-actions {
    padding: 24px;
    border: 1px solid #e0edef;
    border-radius: 20px;
    background: #fbfefe;
  }

  .gsah-action-grid {
    gap: 26px;
  }

  .gsah-footer ol {
    gap: 10px 14px;
  }

  .gsah-footer li {
    gap: 14px;
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .gs-aura-how {
    padding-inline: 20px;
  }

  .gsah-header h2 {
    font-size: 29px;
  }

  .gsah-eyebrow {
    font-size: 9px;
    letter-spacing: 0.2em;
  }

  .gsah-connect,
  .gsah-actions {
    padding: 20px 16px;
  }

  .gsah-tools {
    gap: 8px;
  }

  .gsah-tool-icon {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
  }

  .gsah-tool-icon svg {
    width: 25px;
    height: 25px;
  }

  .gsah-tools li {
    font-size: 11px;
  }

  .gsah-engine {
    padding-inline: 18px;
    border-width: 6px;
  }

  .gsah-label {
    font-size: 9px;
    letter-spacing: 0.13em;
  }

  .gsah-setting {
    gap: 8px;
    font-size: 10px;
  }

  .gsah-setting svg {
    width: 27px;
    height: 27px;
    flex-basis: 27px;
  }

  .gsah-intent strong {
    font-size: 11px;
  }

  .gsah-intent>span {
    font-size: 10px;
  }

  .gsah-report-row {
    gap: 8px;
  }

  .gsah-report {
    padding: 12px 10px;
    gap: 8px;
  }

  .gsah-report>svg {
    width: 25px;
    height: 25px;
    flex-basis: 25px;
  }

  .gsah-footer ol {
    flex-direction: column;
    gap: 9px;
  }

  .gsah-footer li {
    flex-direction: column;
    gap: 6px;
  }

  .gsah-footer li:not(:last-child)::after {
    content: "↓";
    font-size: 18px;
  }

  .gsah-footer>p {
    font-size: 13px;
  }
}

.gs-aura-capabilities {
  --cap-ink: #092f27;
  padding: 48px 28px 30px;
  background: #fff;
  color: var(--cap-ink);
  font-family: "Inter", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.gs-aura-capabilities,
.gs-aura-capabilities * {
  box-sizing: border-box;
}

.gscap-container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
}

.gscap-header {
  margin-bottom: 32px;
}

.gscap-eyebrow {
  display: block;
  margin-bottom: 14px;
  color: #189a6b;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gscap-header h2 {
  margin: 0;
  font-size: clamp(29px, 3vw, 44px);
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -0.045em;
}

.gscap-header>p {
  margin: 14px 0 0;
  color: #7a8480;
  font-size: 18px;
  line-height: 1.6;
}

/* Wide expanding accordion */
.gscap-cards {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 510px;
}

.gscap-card {
  --cap-dark: #083e2d;
  --cap-soft: #eff9f3;
  --cap-bright: #58e7a7;

  position: relative;
  flex: 1 1 0;
  min-width: 0;
  height: 390px;
  overflow: hidden;
  border: 1px solid #e0ebe5;
  border-radius: 48% 48% 48% 48% / 14% 14% 14% 14%;
  background: var(--cap-soft);
  transition:
    flex-grow 550ms cubic-bezier(.22, 1, .36, 1),
    height 550ms cubic-bezier(.22, 1, .36, 1),
    background-color 350ms ease,
    border-color 350ms ease;
}

.gscap-card:nth-child(3n + 1) {
  height: 425px;
}

.gscap-card:nth-child(4n + 1) {
  height: 455px;
}

.gscap-card.is-active {
  flex-grow: 2.9;
  height: 510px;
  border-color: var(--cap-dark);
  border-radius: 48% 48% 48% 48% / 9% 9% 9% 9%;
  background: var(--cap-dark);
  color: #fff;
}

/* Full-card accessible trigger */
.gscap-trigger {
  position: absolute;
  z-index: 3;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: inherit;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.gscap-trigger:focus-visible {
  outline: 3px solid var(--cap-bright);
  outline-offset: -6px;
}

.gscap-collapsed {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 20px 9px;
  text-align: center;
  transition: opacity 180ms ease;
}

.gscap-icon {
  display: block;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gscap-collapsed h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
  letter-spacing: -0.025em;
}

.gscap-status {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  color: #81908a;
  font-size: 10px;
  line-height: 1.4;
}

.gscap-status::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: #21bb83;
}

.gscap-expanded {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 36px 25px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition:
    opacity 200ms ease,
    transform 250ms ease,
    visibility 200ms;
}

.is-active .gscap-collapsed {
  opacity: 0;
  visibility: hidden;
}

.is-active .gscap-expanded {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 180ms;
}

.gscap-expanded>.gscap-icon {
  width: 43px;
  height: 43px;
  margin-bottom: 14px;
  color: var(--cap-bright);
}

.gscap-expanded h3 {
  margin: 0;
  font-size: 21px;
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: -0.035em;
}

.gscap-description {
  margin: 10px 0 18px;
  color: #e0e8e5;
  font-size: 12px;
  line-height: 1.6;
}

/* Conversation preview */
.gscap-preview {
  display: grid;
  gap: 9px;
}

.gscap-message {
  width: 95%;
  margin: 0;
  padding: 11px 13px;
  border-radius: 13px 13px 13px 3px;
  background: #fff;
  color: #294138;
  font-size: 11px;
  line-height: 1.5;
}

.gscap-message small {
  display: block;
  margin-bottom: 2px;
  color: #8b9690;
  font-size: 9px;
}

.gscap-message:last-child {
  justify-self: end;
  border-radius: 13px 13px 3px 13px;
  background: var(--cap-soft);
}

.gscap-wave {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  height: 38px;
  margin-top: 13px;
}

.gscap-wave i {
  width: 3px;
  height: var(--bar-height);
  flex: 0 0 3px;
  border-radius: 3px;
  background: var(--cap-bright);
}

.gscap-expanded>.gscap-status {
  margin-top: 9px;
  color: #c6d5cf;
}

.gscap-expanded>.gscap-status::before {
  background: var(--cap-bright);
}

.gscap-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 24px;
  padding-top: 21px;
  border-top: 1px solid #dce5df;
}

.gscap-footer ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.gscap-footer li {
  display: flex;
  align-items: center;
  gap: 24px;
  color: #7b8680;
  font-size: 9px;
  line-height: 1.5;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.gscap-footer li:not(:last-child)::after {
  content: "•";
  color: #285847;
}

.gscap-pause {
  flex-shrink: 0;
  padding: 9px 12px;
  border: 1px solid #d9e6dd;
  border-radius: 8px;
  background: #fff;
  color: #3e6353;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}

.gscap-pause:hover {
  background: #f1faf5;
}

.gscap-pause:focus-visible {
  outline: 2px solid #188f61;
  outline-offset: 3px;
}

/* Compact desktop */
@media (max-width: 1200px) {
  .gscap-cards {
    gap: 6px;
  }

  .gscap-card.is-active {
    flex-grow: 3.4;
  }

  .gscap-collapsed h3 {
    font-size: 11px;
  }

  .gscap-collapsed .gscap-status {
    font-size: 8px;
  }

  .gscap-expanded {
    padding-inline: 18px;
  }

  .gscap-expanded h3 {
    font-size: 18px;
  }

  .gscap-icon {
    width: 32px;
    height: 32px;
  }
}

/* Tablet / mobile: vertical accordion */
@media (max-width: 1000px) {
  .gs-aura-capabilities {
    padding: 40px 24px 28px;
  }

  .gscap-header {
    text-align: center;
  }

  .gscap-header>p {
    font-size: 15px;
  }

  .gscap-cards {
    display: grid;
    gap: 10px;
    min-height: 0;
  }

  .gscap-card,
  .gscap-card:nth-child(3n + 1),
  .gscap-card:nth-child(4n + 1) {
    height: 76px;
    border-radius: 16px;
  }

  .gscap-card.is-active {
    height: 345px;
    border-radius: 20px;
  }

  .gscap-collapsed {
    flex-direction: row;
    justify-content: flex-start;
    gap: 16px;
    padding: 16px 20px;
    text-align: left;
  }

  .gscap-collapsed h3 {
    font-size: 14px;
  }

  .gscap-collapsed .gscap-status {
    margin-left: auto;
    font-size: 11px;
  }

  .gscap-expanded {
    padding: 24px;
  }

  .gscap-expanded>.gscap-icon {
    position: absolute;
    top: 24px;
    right: 24px;
  }

  .gscap-expanded h3 {
    max-width: calc(100% - 60px);
    font-size: 22px;
  }

  .gscap-description {
    max-width: 620px;
    margin-bottom: 14px;
    font-size: 13px;
  }

  .gscap-preview {
    max-width: 520px;
  }

  .gscap-message {
    font-size: 12px;
  }

  .gscap-wave {
    justify-content: flex-start;
  }

  .gscap-footer {
    flex-direction: column;
    align-items: center;
  }

  .gscap-footer ul {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .gs-aura-capabilities {
    padding-inline: 20px;
  }

  .gscap-header h2 {
    font-size: 30px;
  }

  .gscap-collapsed {
    padding-inline: 15px;
    gap: 12px;
  }

  .gscap-collapsed h3 {
    font-size: 12px;
  }

  .gscap-collapsed .gscap-status {
    display: none;
  }

  .gscap-card.is-active {
    height: 390px;
  }

  .gscap-expanded {
    padding: 22px 18px;
  }

  .gscap-expanded h3 {
    font-size: 20px;
  }

  .gscap-expanded>.gscap-icon {
    right: 18px;
    width: 34px;
    height: 34px;
  }

  .gscap-footer li {
    font-size: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {

  .gscap-card,
  .gscap-collapsed,
  .gscap-expanded {
    transition: none;
  }
}

.gs-aura-directions {
  --gsad-ink: #10372b;
  --gsad-green: #20b87b;
  padding: 48px 28px 36px;
  background: #fff;
  color: var(--gsad-ink);
  font-family: "Inter", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.gs-aura-directions,
.gs-aura-directions * {
  box-sizing: border-box;
}

.gsad-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.gsad-container {
  max-width: 1300px;
  width: 100%;
  margin-inline: auto;
}

.gsad-header {
  margin-bottom: 34px;
  text-align: center;
}

.gsad-eyebrow {
  display: block;
  margin-bottom: 18px;
  color: #139b64;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.19em;
  text-transform: uppercase;
}

.gsad-header h2 {
  margin: 0;
  font-size: clamp(29px, 3vw, 44px);
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.gsad-header>p {
  margin: 14px 0 0;
  color: #718079;
  font-size: 18px;
  line-height: 1.6;
}

/* Five aligned diagram columns */
.gsad-diagram {
  display: grid;
  grid-template-columns:
    120px minmax(0, 1fr) 220px minmax(0, 1fr) 120px;
  align-items: center;
  gap: 16px;
}

.gsad-circle svg,
.gsad-agent-actions svg,
.gsad-integration svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Outer audiences */
.gsad-audiences ul {
  display: grid;
  grid-template-rows: repeat(3, 130px);
  list-style: none;
  margin: 0;
  padding: 0;
}

.gsad-audiences li {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  text-align: center;
}

.gsad-circle {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  border: 1px solid #cceedd;
  border-radius: 50%;
  background: #f1fcf6;
  color: #245743;
}

.gsad-circle svg {
  width: 28px;
  height: 28px;
}

.gsad-audiences strong {
  margin-top: 9px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.4;
}

.gsad-audiences small {
  margin-top: 4px;
  color: #83908a;
  font-size: 10px;
  line-height: 1.4;
}

.gsad-audiences-out .gsad-circle {
  border-color: #d9e3e6;
  background: #f6f9fa;
  color: #36585d;
}

/* Inbound / outbound panels */
.gsad-side {
  position: relative;
  min-width: 0;
  min-height: 350px;
  padding: 32px 18px 24px;
  text-align: center;
}

.gsad-inbound {
  border-radius: 28px 100px 100px 28px;
  background: linear-gradient(100deg, #fbfffd, #edfdf4);
}

.gsad-outbound {
  border-radius: 100px 28px 28px 100px;
  background: linear-gradient(100deg, #f5f8fa, #fcfdfd);
}

.gsad-side h3 {
  margin: 0;
  font-size: 27px;
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: 0.015em;
  text-transform: uppercase;
}

.gsad-side h4 {
  margin: 9px 0 0;
  font-size: 18px;
  font-weight: 650;
  line-height: 1.35;
  letter-spacing: -0.03em;
}

.gsad-side-description {
  max-width: 310px;
  margin: 15px auto 0;
  color: #75837c;
  font-size: 12px;
  line-height: 1.65;
}

.gsad-branches {
  position: absolute;
  top: 50%;
  width: 90px;
  height: 390px;
  transform: translateY(-50%);
  pointer-events: none;
}

.gsad-branches-in {
  right: calc(100% - 28px);
}

.gsad-branches-out {
  left: calc(100% - 28px);
}

.gsad-mini-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
}

.gsad-mini-flow li {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: #355045;
  font-size: 11px;
  line-height: 1.45;
}

.gsad-mini-flow .gsad-circle {
  width: 55px;
  height: 55px;
  flex-basis: 55px;
  background: #fff;
}

.gsad-mini-flow .gsad-circle svg {
  width: 24px;
  height: 24px;
}

.gsad-mini-flow li:not(:last-child)::after {
  content: "→";
  position: absolute;
  top: 14px;
  left: calc(100% - 5px);
  color: #25b67b;
  font-size: 23px;
  line-height: 1;
}

.gsad-outbound .gsad-mini-flow .gsad-circle {
  border-color: #dde7e8;
  color: #375d61;
}

.gsad-outbound .gsad-mini-flow li:not(:last-child)::after {
  color: #7aa4a5;
}

.gsad-pill {
  display: inline-block;
  margin-top: 22px;
  padding: 8px 15px;
  border-radius: 100px;
  background: #d9f8e8;
  color: #247557;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}

.gsad-outbound .gsad-pill {
  background: #e0efeb;
  color: #337566;
}

/* Central Agent Aura panel */
.gsad-centre {
  position: relative;
  padding-top: 10px;
  text-align: center;
}

.gsad-centre::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -18px;
  left: 50%;
  width: 290px;
  height: 290px;
  border: 16px solid #f0fcf5;
  border-radius: 50%;
  transform: translateX(-50%);
  background: #e0fbed;
  box-shadow: 0 0 0 16px #f8fffb;
}

.gsad-agent {
  position: relative;
  z-index: 1;
  padding: 21px 16px 17px;
  border: 1.5px solid #22cd7f;
  border-radius: 27px;
  background: linear-gradient(160deg, #043729, #063d2e);
  color: #fff;
}

.gsad-agent h3 {
  margin: 0;
  color: #ddf2e5;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.5;
  letter-spacing: 0.23em;
  text-transform: uppercase;
}

.gsad-wave {
  display: block;
  width: 100%;
  height: 84px;
  margin: 17px 0 9px;
}

.gsad-live {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0 0 15px;
  color: #e2f1e8;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.5;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.gsad-live>span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2be48c;
}

.gsad-agent-actions {
  display: grid;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.gsad-agent-actions li {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 43px;
  padding: 9px 12px;
  border: 1px solid #31614d;
  border-radius: 12px;
  background: rgb(255 255 255 / 2%);
  color: #e2f1e8;
  font-size: 12px;
  line-height: 1.4;
  text-align: left;
}

.gsad-agent-actions svg {
  width: 23px;
  height: 23px;
  flex: 0 0 23px;
}

.gsad-centre-caption {
  position: relative;
  margin: 18px 0 0;
  color: #74867d;
  font-size: 9px;
  font-weight: 650;
  line-height: 1.8;
  letter-spacing: 0.19em;
  text-transform: uppercase;
}

/* Bottom integrations strip */
.gsad-integrations {
  display: grid;
  grid-template-columns: 0.7fr 0.9fr 2fr 0.9fr 1fr;
  align-items: center;
  gap: 18px;
  margin-top: 30px;
  padding: 22px;
  border: 1px solid #dcebe3;
  border-radius: 18px;
  background: #fcfefd;
}

.gsad-integration {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  color: #315648;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gsad-integration svg {
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  color: #2f7d5a;
}

.gsad-integrations>p {
  margin: 0;
  padding-inline: 18px;
  border-right: 1px solid #dce5df;
  border-left: 1px solid #dce5df;
  color: #7b8881;
  font-size: 13px;
  line-height: 1.6;
  text-align: center;
}

@media (max-width: 1200px) {
  .gsad-diagram {
    grid-template-columns:
      95px minmax(0, 1fr) 190px minmax(0, 1fr) 95px;
    gap: 10px;
  }

  .gsad-side {
    padding-inline: 10px;
  }

  .gsad-side h3 {
    font-size: 23px;
  }

  .gsad-side h4 {
    font-size: 15px;
  }

  .gsad-audiences strong {
    font-size: 10px;
  }

  .gsad-mini-flow .gsad-circle {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
  }

  .gsad-mini-flow li {
    font-size: 10px;
  }

  .gsad-mini-flow li:not(:last-child)::after {
    top: 10px;
    font-size: 21px;
  }

  .gsad-agent {
    padding-inline: 12px;
  }

  .gsad-integrations {
    gap: 12px;
    padding: 18px;
  }
}

/* Tablet: inbound, agent, outbound stack vertically */
@media (max-width: 950px) {
  .gs-aura-directions {
    padding: 40px 24px 30px;
  }

  .gsad-diagram {
    grid-template-columns: 1fr;
    gap: 24px;
    max-width: 650px;
    margin-inline: auto;
  }

  .gsad-audiences-in {
    order: 1;
  }

  .gsad-inbound {
    order: 2;
  }

  .gsad-centre {
    order: 3;
    width: 230px;
    justify-self: center;
    margin: 10px 0;
  }

  .gsad-outbound {
    order: 4;
  }

  .gsad-audiences-out {
    order: 5;
  }

  .gsad-audiences ul {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: auto;
    gap: 12px;
  }

  .gsad-audiences strong {
    font-size: 11px;
  }

  .gsad-side {
    min-height: 0;
    padding: 26px;
    border-radius: 24px;
  }

  .gsad-side h3 {
    font-size: 27px;
  }

  .gsad-side h4 {
    font-size: 18px;
  }

  .gsad-side-description {
    max-width: 470px;
    font-size: 13px;
  }

  .gsad-branches {
    display: none;
  }

  .gsad-mini-flow {
    max-width: 440px;
    margin-inline: auto;
  }

  .gsad-mini-flow li {
    font-size: 12px;
  }

  .gsad-mini-flow .gsad-circle {
    width: 56px;
    height: 56px;
    flex-basis: 56px;
  }

  .gsad-mini-flow li:not(:last-child)::after {
    top: 16px;
  }

  .gsad-integrations {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px 12px;
  }

  .gsad-integrations>p {
    grid-column: 1 / -1;
    grid-row: 2;
    padding: 16px 0 0;
    border-right: 0;
    border-left: 0;
    border-top: 1px solid #dce5df;
  }

  .gsad-integration {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }
}

@media (max-width: 480px) {
  .gs-aura-directions {
    padding-inline: 20px;
  }

  .gsad-header h2 {
    font-size: 30px;
  }

  .gsad-header>p {
    font-size: 15px;
  }

  .gsad-eyebrow {
    font-size: 9px;
  }

  .gsad-audiences ul {
    gap: 7px;
  }

  .gsad-audiences .gsad-circle {
    width: 52px;
    height: 52px;
    flex-basis: 52px;
  }

  .gsad-audiences strong {
    font-size: 10px;
  }

  .gsad-audiences small {
    font-size: 9px;
  }

  .gsad-side {
    padding: 24px 16px;
  }

  .gsad-side h4 {
    font-size: 17px;
  }

  .gsad-mini-flow li {
    font-size: 10px;
  }

  .gsad-pill {
    padding-inline: 12px;
    font-size: 9px;
  }

  .gsad-integrations {
    padding: 18px 12px;
    gap: 18px 8px;
  }

  .gsad-integration {
    font-size: 8px;
    letter-spacing: 0.03em;
  }

  .gsad-integrations>p {
    font-size: 12px;
  }
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: #fff;
}

.aura-support {
  --ink: #092d28;
  --muted: #687975;
  --green: #09cf86;
  --teal: #168d90;
  --line: #dcece7;
  font-family: "Inter", sans-serif;
  color: var(--ink);
  padding: 52px 28px 32px;
  background:
    radial-gradient(ellipse at 34% 48%, #edfaf580, transparent 42%),
    #fff;
}

.aura-support .support-wrap {
  max-width: 1300px;
  margin: 0 auto;
}

.aura-support .support-header {
  text-align: center;
  margin-bottom: 22px;
}

.aura-support .support-eyebrow {
  margin: 0 0 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2.2px;
  color: #08aa70;
  text-transform: uppercase;
}

.aura-support h2 {
  margin: 0;
  font-size: clamp(30px, 3.4vw, 52px);
  line-height: 1.12;
  letter-spacing: -1.8px;
  font-weight: 750;
  text-wrap: balance;
}

.aura-support .support-intro {
  margin: 14px auto 0;
  max-width: 1080px;
  color: var(--muted);
  font-size: clamp(16px, 1.5vw, 21px);
  line-height: 1.55;
}

.aura-support .support-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 26px;
  align-items: center;
}

.aura-support .support-clock {
  width: 100%;
  display: block;
  overflow: visible;
}

.aura-support svg text {
  font-family: "Inter", sans-serif;
}

.aura-support .handoff {
  padding: 10px 0 0;
  min-width: 0;
}

.aura-support .handoff-heading {
  text-align: center;
  margin: 0 0 32px;
  font-size: 13px;
  letter-spacing: 1.8px;
  font-weight: 700;
}

.aura-support .handoff-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) 132px;
  gap: 8px;
  align-items: center;
  position: relative;
}

.aura-support .handoff-step {
  position: relative;
  text-align: center;
  align-self: center;
  padding-top: 8px;
}

.aura-support .handoff-step::after {
  content: "";
  position: absolute;
  top: 33px;
  left: calc(50% + 29px);
  width: calc(100% - 42px);
  border-top: 2px dotted #b1cac2;
}

.aura-support .step-icon {
  width: 52px;
  height: 52px;
  margin: 0 auto 12px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #e9f7f1;
  color: #247062;
}

.aura-support .handoff-step:nth-child(2) .step-icon {
  background: #f0edfc;
  color: #7761b0;
}

.aura-support .handoff-step:nth-child(3) .step-icon {
  background: #e8f6f8;
  color: #26888f;
}

.aura-support .icon {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  display: block;
}

.aura-support .handoff-step p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.aura-support .representative {
  position: relative;
  width: 132px;
  height: 132px;
  border-radius: 50%;
  background: #e8f0ef;
  border: 6px solid #f4f8f7;
}

.aura-support .representative>svg {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: inherit;
}

.aura-support .representative::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 25px;
  background: #91b4a8;
  left: 50%;
  top: calc(100% + 6px);
}

.aura-support .representative-status {
  position: absolute;
  right: 0;
  bottom: 6px;
  width: 21px;
  height: 21px;
  background: var(--green);
  border: 4px solid #fff;
  border-radius: 50%;
}

.aura-support .handoff-card {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 25px 0 0 15%;
  padding: 24px 26px;
  border: 1.5px solid #94b8aa;
  border-radius: 18px;
  background: linear-gradient(120deg, #f3fcf7, #edf8f8);
  box-shadow: 0 8px 28px #173e2f06;
}

.aura-support .handoff-card-icon {
  display: grid;
  place-items: center;
  flex: 0 0 62px;
  height: 62px;
  border-radius: 50%;
  background: #08392e;
  color: #c9f8df;
}

.aura-support .handoff-card-icon .icon {
  width: 30px;
  height: 30px;
}

.aura-support .handoff-card h3 {
  font-size: 23px;
  line-height: 1.2;
  letter-spacing: -.5px;
  margin: 0 0 7px;
}

.aura-support .handoff-card p {
  font-size: 18px;
  line-height: 1.4;
  color: #527269;
  margin: 0;
}

.aura-support .handoff-note {
  margin: 20px 0 0 20%;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.65;
  max-width: 390px;
}

.aura-support .support-footer {
  margin-top: 22px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: auto auto auto minmax(0, 1fr);
  gap: 25px;
  align-items: center;
}

.aura-support .support-benefit {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-right: 25px;
  border-right: 1px solid var(--line);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  white-space: nowrap;
}

.aura-support .benefit-icon {
  position: relative;
  color: #42685c;
  flex-shrink: 0;
}

.aura-support .benefit-icon .icon {
  width: 33px;
  height: 33px;
}

.aura-support .benefit-icon::after {
  content: "";
  width: 44px;
  height: 1px;
  background: #7ca595;
  position: absolute;
  top: 16px;
  left: -5px;
  transform: rotate(-45deg);
}

.aura-support .availability {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

.aura-support .status-dot {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  background: var(--green);
  border-radius: 50%;
  box-shadow: 0 0 0 5px #d3f8e6;
}

@media (max-width: 1100px) {
  .aura-support .support-layout {
    gap: 10px;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  }

  .aura-support .handoff-flow {
    grid-template-columns: repeat(3, minmax(0, 1fr)) 100px;
  }

  .aura-support .representative {
    width: 100px;
    height: 100px;
  }

  .aura-support .handoff-card {
    margin-left: 5%;
    padding: 20px;
  }

  .aura-support .handoff-note {
    margin-left: 8%;
  }

  .aura-support .support-footer {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }

  .aura-support .support-benefit {
    justify-content: center;
  }

  .aura-support .support-benefit:nth-child(3) {
    border-right: 0;
  }

  .aura-support .availability {
    grid-column: 1 / -1;
    justify-content: center;
  }
}

@media (max-width: 800px) {
  .aura-support {
    padding: 38px 20px 28px;
  }

  .aura-support h2 {
    letter-spacing: -1px;
  }

  .aura-support .support-layout {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .aura-support .support-clock {
    max-width: 700px;
    margin: auto;
  }

  .aura-support .handoff {
    max-width: 580px;
    width: 100%;
    margin: auto;
  }

  .aura-support .handoff-heading {
    margin-bottom: 18px;
  }

  .aura-support .handoff-card,
  .aura-support .handoff-note {
    margin-left: 0;
  }

  .aura-support .handoff-note {
    text-align: center;
    max-width: none;
  }

  .aura-support .support-footer {
    margin-top: 30px;
  }
}

@media (max-width: 480px) {
  .aura-support {
    padding-inline: 14px;
  }

  .aura-support .support-eyebrow {
    font-size: 10px;
    letter-spacing: 1.7px;
  }

  .aura-support .handoff-flow {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }

  .aura-support .handoff-step:nth-child(3)::after {
    display: none;
  }

  .aura-support .handoff-step p {
    font-size: 12px;
  }

  .aura-support .representative {
    grid-column: 1 / -1;
    margin: 12px auto 0;
  }

  .aura-support .handoff-card {
    gap: 14px;
    padding: 19px;
  }

  .aura-support .handoff-card h3 {
    font-size: 21px;
  }

  .aura-support .handoff-card p {
    font-size: 16px;
  }

  .aura-support .support-footer {
    grid-template-columns: 1fr;
    gap: 19px;
  }

  .aura-support .support-benefit {
    border: 0;
    padding: 0;
    justify-content: flex-start;
  }

  .aura-support .availability {
    justify-content: flex-start;
    padding-top: 15px;
    border-top: 1px solid var(--line);
  }
}

.aura-qualification {
  --aq-ink: #082c24;
  --aq-muted: #6d7d77;
  --aq-green: #06d487;
  --aq-border: #e3ece7;

  padding: 48px 28px 30px;
  color: var(--aq-ink);
  background: #fff;
  font-family: "Inter", sans-serif;
}

.aura-qualification,
.aura-qualification * {
  box-sizing: border-box;
}

.aura-qualification .aq-icon-library {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.aura-qualification .aq-container {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
}

.aura-qualification .aq-header {
  text-align: center;
  margin-bottom: 26px;
}

.aura-qualification .aq-eyebrow {
  margin: 0 0 16px;
  color: #0ba876;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3.4px;
  text-transform: uppercase;
}

.aura-qualification h2 {
  margin: 0;
  font-size: clamp(30px, 3.4vw, 52px);
  line-height: 1.13;
  font-weight: 750;
  letter-spacing: -1.9px;
  text-wrap: balance;
}

.aura-qualification .aq-intro {
  margin: 16px auto 0;
  max-width: 1120px;
  color: var(--aq-muted);
  font-size: clamp(16px, 1.65vw, 23px);
  line-height: 1.5;
}

/* Continuous, aligned desktop diagram */
.aura-qualification .aq-diagram {
  display: grid;
  grid-template-columns:
    minmax(0, 600fr) minmax(0, 320fr) minmax(0, 480fr);
  align-items: center;
  gap: 0;
}

.aura-qualification .aq-conversation,
.aura-qualification .aq-scoring,
.aura-qualification .aq-crm {
  min-width: 0;
}

.aura-qualification .aq-conversation-svg,
.aura-qualification .aq-score-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.aura-qualification svg text {
  font-family: "Inter", sans-serif;
}

.aura-qualification .aq-icon {
  width: 23px;
  height: 23px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* CRM */
.aura-qualification .aq-crm {
  position: relative;
  padding-left: 15px;
}

.aura-qualification .aq-crm::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 15px;
  height: 1.7px;
  background: var(--aq-green);
}

.aura-qualification .aq-crm-heading {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 10px 22px;
  color: #486459;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.7px;
  text-transform: uppercase;
}

.aura-qualification .aq-database-icon {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  flex: 0 0 43px;
  color: #147b62;
  border-radius: 50%;
  background: #e5faf1;
}

.aura-qualification .aq-database-icon .aq-icon {
  width: 27px;
  height: 27px;
}

.aura-qualification .aq-leads {
  padding: 8px;
  border: 1px solid #edf2ef;
  border-radius: 15px;
  background: #ffffff;
}

.aura-qualification .aq-lead {
  padding: 14px 13px;
  border: 1px solid var(--aq-border);
  border-radius: 9px;
  background: #fff;
}

.aura-qualification .aq-lead+.aq-lead {
  margin-top: 10px;
}

.aura-qualification .aq-lead-featured {
  position: relative;
  padding-top: 17px;
  padding-bottom: 13px;
  border-color: #d5f3e5;
  background: linear-gradient(110deg, #f1fff7, #eafff6);
}

.aura-qualification .aq-lead-featured::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  bottom: 9px;
  width: 3px;
  border-radius: 3px;
  background: var(--aq-green);
}

.aura-qualification .aq-lead-main {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) 34px 106px;
  gap: 10px;
  align-items: center;
}

.aura-qualification .aq-lead-featured .aq-lead-main {
  grid-template-columns: 22px minmax(0, 1fr) 34px 106px 72px;
}

.aura-qualification .aq-rank {
  font-size: 16px;
  font-weight: 600;
}

.aura-qualification .aq-name {
  font-size: 17px;
  line-height: 1.3;
  letter-spacing: -.5px;
}

.aura-qualification .aq-score {
  font-size: 23px;
  font-weight: 700;
  color: #527168;
}

.aura-qualification .aq-score-green {
  color: #08b97b;
}

.aura-qualification .aq-badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 28px;
  padding: 6px 10px;
  border-radius: 30px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .6px;
  white-space: nowrap;
  text-transform: uppercase;
}

.aura-qualification .aq-badge-ready {
  color: #07583a;
  background: #05df8c;
}

.aura-qualification .aq-badge-follow {
  color: #54716d;
  background: #e9f0ef;
}

.aura-qualification .aq-badge-nurture {
  color: #b37a30;
  background: #fff0dc;
}

.aura-qualification .aq-sales-handoff {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #168f6c;
  font-size: 10px;
  line-height: 1.35;
}

.aura-qualification .aq-handoff-arrow {
  color: #08ce81;
  font-size: 31px;
  line-height: 1;
}

.aura-qualification .aq-context {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 12px 0 0 32px;
}

.aura-qualification .aq-context>span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid #e1eee7;
  border-radius: 30px;
  background: #ffffff;
  color: #647c70;
  font-size: 10px;
  white-space: nowrap;
}

.aura-qualification .aq-context .aq-icon {
  width: 13px;
  height: 13px;
}

/* Captions */
.aura-qualification .aq-stages {
  display: grid;
  grid-template-columns: 1.25fr 1fr 1.15fr;
  gap: 40px;
  margin-top: 20px;
  padding-left: 9%;
}

.aura-qualification .aq-stage {
  display: flex;
  align-items: flex-start;
  gap: 17px;
}

.aura-qualification .aq-stage-number {
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  flex: 0 0 43px;
  border-radius: 50%;
  color: #fff;
  background: #063d2f;
  font-size: 22px;
  line-height: 1;
}

.aura-qualification .aq-stage h3 {
  margin: 11px 0 10px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 2.2px;
  text-transform: uppercase;
}

.aura-qualification .aq-stage p {
  margin: 0;
  color: var(--aq-muted);
  font-size: 15px;
  line-height: 1.55;
}

/* Bottom transformation */
.aura-qualification .aq-footer {
  margin-top: 43px;
  text-align: center;
}

.aura-qualification .aq-transformation {
  display: grid;
  grid-template-columns: minmax(0, 300px) minmax(80px, 280px) minmax(0, 380px);
  align-items: center;
  justify-content: center;
  gap: 30px;
}

.aura-qualification .aq-transformation-start,
.aura-qualification .aq-transformation-end {
  display: grid;
  place-items: center;
  min-height: 46px;
  padding: 13px 20px;
  border: 1px solid #dfe9e3;
  border-radius: 40px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.aura-qualification .aq-transformation-start {
  background: #f3f6f4;
  color: #476158;
}

.aura-qualification .aq-transformation-end {
  background: #e9fcf3;
  color: #164f3b;
}

.aura-qualification .aq-transformation-arrow {
  position: relative;
  height: 1.5px;
  background: #83958b;
}

.aura-qualification .aq-transformation-arrow::after {
  content: "";
  position: absolute;
  right: 1px;
  top: -4px;
  width: 9px;
  height: 9px;
  border-top: 1.5px solid #83958b;
  border-right: 1.5px solid #83958b;
  transform: rotate(45deg);
}

.aura-qualification .aq-footer>p {
  margin: 20px 0 0;
  color: #65786e;
  font-size: 17px;
  line-height: 1.5;
}

/* Laptop */
@media (max-width: 1250px) {
  .aura-qualification .aq-diagram {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, .64fr) minmax(0, 1fr);
  }

  .aura-qualification .aq-lead-main,
  .aura-qualification .aq-lead-featured .aq-lead-main {
    grid-template-columns: 16px minmax(0, 1fr) 30px 86px;
    gap: 7px;
  }

  .aura-qualification .aq-name {
    font-size: 14px;
  }

  .aura-qualification .aq-badge {
    font-size: 9px;
    padding-inline: 7px;
  }

  .aura-qualification .aq-sales-handoff {
    grid-column: 2 / -1;
    justify-self: end;
  }

  .aura-qualification .aq-handoff-arrow {
    font-size: 22px;
  }

  .aura-qualification .aq-sales-handoff br {
    display: none;
  }

  .aura-qualification .aq-context {
    margin-left: 0;
    gap: 4px;
  }

  .aura-qualification .aq-context>span {
    padding: 5px 7px;
    font-size: 9px;
  }

  .aura-qualification .aq-crm-heading {
    margin-left: 0;
    letter-spacing: 1px;
    font-size: 10px;
  }

  .aura-qualification .aq-stages {
    padding-left: 4%;
    gap: 24px;
  }

  .aura-qualification .aq-desktop-break {
    display: none;
  }
}

/* Tablet */
@media (max-width: 950px) {
  .aura-qualification {
    padding: 40px 22px 30px;
  }

  .aura-qualification .aq-diagram {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, .8fr);
    row-gap: 28px;
  }

  .aura-qualification .aq-crm {
    grid-column: 1 / -1;
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
    padding-left: 0;
  }

  .aura-qualification .aq-crm::before {
    display: none;
  }

  .aura-qualification .aq-lead-main {
    grid-template-columns: 22px minmax(0, 1fr) 40px 110px;
  }

  .aura-qualification .aq-lead-featured .aq-lead-main {
    grid-template-columns: 22px minmax(0, 1fr) 40px 110px 80px;
  }

  .aura-qualification .aq-sales-handoff {
    grid-column: auto;
  }

  .aura-qualification .aq-sales-handoff br {
    display: initial;
  }

  .aura-qualification .aq-name {
    font-size: 17px;
  }

  .aura-qualification .aq-context {
    margin-left: 29px;
  }

  .aura-qualification .aq-context>span {
    font-size: 11px;
    padding: 6px 10px;
  }

  .aura-qualification .aq-stages {
    padding-left: 0;
    gap: 22px;
    margin-top: 32px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .aura-qualification .aq-stage {
    gap: 11px;
  }

  .aura-qualification .aq-stage-number {
    width: 35px;
    height: 35px;
    flex-basis: 35px;
    font-size: 18px;
  }

  .aura-qualification .aq-stage h3 {
    font-size: 11px;
    letter-spacing: 1.3px;
  }

  .aura-qualification .aq-stage p {
    font-size: 13px;
  }

  .aura-qualification .aq-transformation {
    grid-template-columns: 1fr 80px 1.2fr;
    gap: 18px;
  }

  .aura-qualification .aq-transformation-start,
  .aura-qualification .aq-transformation-end {
    font-size: 10px;
    letter-spacing: 1px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .aura-qualification {
    padding: 34px 16px 28px;
  }

  .aura-qualification .aq-eyebrow {
    font-size: 10px;
    letter-spacing: 2.4px;
    margin-bottom: 12px;
  }

  .aura-qualification h2 {
    font-size: 32px;
    letter-spacing: -1.1px;
  }

  .aura-qualification .aq-intro {
    font-size: 15px;
    margin-top: 12px;
  }

  .aura-qualification .aq-diagram {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .aura-qualification .aq-scoring {
    width: min(100%, 290px);
    margin: 0 auto;
  }

  .aura-qualification .aq-crm {
    grid-column: auto;
  }

  .aura-qualification .aq-lead-main,
  .aura-qualification .aq-lead-featured .aq-lead-main {
    grid-template-columns: 16px minmax(0, 1fr) 30px 90px;
    gap: 7px;
  }

  .aura-qualification .aq-name {
    font-size: 15px;
  }

  .aura-qualification .aq-score {
    font-size: 21px;
  }

  .aura-qualification .aq-sales-handoff {
    grid-column: 2 / -1;
    justify-self: end;
  }

  .aura-qualification .aq-sales-handoff br {
    display: none;
  }

  .aura-qualification .aq-context {
    margin-left: 0;
    gap: 5px;
  }

  .aura-qualification .aq-context>span {
    font-size: 10px;
    padding: 6px 8px;
  }

  .aura-qualification .aq-stages {
    grid-template-columns: 1fr;
    gap: 22px;
    margin-top: 28px;
  }

  .aura-qualification .aq-stage {
    gap: 14px;
  }

  .aura-qualification .aq-stage h3 {
    margin-top: 9px;
    font-size: 12px;
  }

  .aura-qualification .aq-stage p {
    font-size: 14px;
  }

  .aura-qualification .aq-footer {
    margin-top: 30px;
  }

  .aura-qualification .aq-transformation {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .aura-qualification .aq-transformation-arrow {
    width: 35px;
    margin: 8px auto;
    transform: rotate(90deg);
  }

  .aura-qualification .aq-transformation-start,
  .aura-qualification .aq-transformation-end {
    min-height: 44px;
    font-size: 11px;
  }

  .aura-qualification .aq-footer>p {
    font-size: 15px;
    margin-top: 19px;
  }
}

.aura-booking {
  --ab-green: #05d084;
  --ab-ink: #082d25;
  --ab-muted: #708078;
  --ab-border: #e4ede8;

  padding: 42px 28px 26px;
  color: var(--ab-ink);
  background: #fff;
  font-family: "Inter", sans-serif;
}

.aura-booking,
.aura-booking * {
  box-sizing: border-box;
}

.aura-booking .ab-icon-library {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.aura-booking .ab-container {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
}

.aura-booking .ab-icon {
  display: block;
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Heading */
.aura-booking .ab-header {
  text-align: center;
  margin-bottom: 34px;
}

.aura-booking .ab-eyebrow {
  margin: 0 0 17px;
  color: #0bbe78;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
}

.aura-booking h2 {
  margin: 0;
  font-size: clamp(30px, 3.3vw, 50px);
  line-height: 1.14;
  font-weight: 750;
  letter-spacing: -1.8px;
  text-wrap: balance;
}

.aura-booking .ab-intro {
  max-width: 1280px;
  margin: 14px auto 0;
  color: var(--ab-muted);
  font-size: clamp(16px, 1.5vw, 21px);
  line-height: 1.55;
}

/* Main three-column layout */
.aura-booking .ab-layout {
  position: relative;
  display: grid;
  grid-template-columns:
    minmax(0, 365fr) minmax(0, 720fr) minmax(0, 355fr);
  gap: 24px;
  align-items: stretch;
}

.aura-booking .ab-call,
.aura-booking .ab-calendar-panel,
.aura-booking .ab-confirmation {
  min-width: 0;
  border-radius: 16px;
}

/* Live call */
.aura-booking .ab-call {
  display: flex;
  flex-direction: column;
  padding: 28px 23px 23px;
  color: #fff;
  background:
    radial-gradient(circle at 45% 28%, #0d493680, transparent 45%),
    linear-gradient(145deg, #032c23, #073a2d);
  border: 1px solid #225944;
}

.aura-booking .ab-call-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  color: #d1e7d8;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.aura-booking .ab-call-time {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  font-size: 11px;
  letter-spacing: 0;
}

.aura-booking .ab-call-time i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #09df88;
}

.aura-booking .ab-waveform {
  display: block;
  width: 85%;
  height: 82px;
  margin: 23px auto 0;
  filter: drop-shadow(0 0 7px #06d78950);
}

.aura-booking .ab-listening {
  margin: 3px 0 21px;
  text-align: center;
  font-size: 12px;
  color: #c6ded1;
}

.aura-booking .ab-message {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 15px 14px 11px;
  border-radius: 17px;
  color: #15382d;
}

.aura-booking .ab-message-caller {
  margin-right: 4px;
  background: #f6f7f8;
}

.aura-booking .ab-message-agent {
  margin: 16px 0 0 7px;
  background: #e9fff3;
}

.aura-booking .ab-message::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 18px;
  height: 18px;
}

.aura-booking .ab-message-caller::after {
  left: -6px;
  background: #f6f7f8;
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
}

.aura-booking .ab-message-agent::after {
  right: -6px;
  background: #e9fff3;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
}

.aura-booking .ab-avatar {
  display: grid;
  place-items: center;
  width: 33px;
  height: 33px;
  flex: 0 0 33px;
  border-radius: 50%;
}

.aura-booking .ab-avatar-person {
  background: #e4eaeb;
  color: #6b8182;
}

.aura-booking .ab-avatar-person .ab-icon {
  width: 19px;
  height: 19px;
}

.aura-booking .ab-avatar-aura {
  background: #a5f3ce;
  color: #0cb972;
  font-size: 20px;
  font-weight: 700;
}

.aura-booking .ab-message-content {
  flex: 1;
  min-width: 0;
}

.aura-booking .ab-message-name {
  display: block;
  margin: 0 0 5px;
  color: #647d71;
  font-size: 10px;
}

.aura-booking .ab-message p {
  margin: 0;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: -.25px;
}

.aura-booking .ab-message time {
  display: block;
  text-align: right;
  margin-top: 5px;
  color: #8a9790;
  font-size: 10px;
}

.aura-booking .ab-call-controls {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  gap: 20px;
  margin-top: auto;
  padding-top: 28px;
}

.aura-booking .ab-control {
  display: grid;
  place-items: center;
  width: 47px;
  height: 47px;
  border: 1px solid #ffffff26;
  border-radius: 50%;
  color: #d7e9df;
  background: #ffffff06;
}

.aura-booking .ab-control-end {
  width: 53px;
  height: 53px;
  color: #fff;
  background: #ff6266;
  border-color: #ff7b7e;
}

.aura-booking .ab-control-end svg {
  width: 29px;
  height: 29px;
}

.aura-booking .ab-control-more {
  font-size: 20px;
  letter-spacing: 2px;
  padding-left: 2px;
}

/* Calendar */
.aura-booking .ab-calendar-panel {
  display: flex;
  flex-direction: column;
  padding: 23px 18px 22px;
  border: 1px solid var(--ab-border);
  background: #fcfefd;
}

.aura-booking .ab-calendar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0 4px 24px;
}

.aura-booking .ab-calendar-heading {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aura-booking .ab-live-dot {
  width: 10px;
  height: 10px;
  flex: 0 0 10px;
  border-radius: 50%;
  background: var(--ab-green);
  box-shadow: 0 0 0 5px #ddf9eb;
}

.aura-booking .ab-calendar-heading h3 {
  margin: 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.2px;
  line-height: 1.5;
  text-transform: uppercase;
}

.aura-booking .ab-checking {
  display: flex;
  align-items: center;
  gap: 13px;
  color: #829087;
  font-size: 10px;
  white-space: nowrap;
}

.aura-booking .ab-checking-dots {
  display: inline-flex;
  gap: 8px;
}

.aura-booking .ab-checking-dots i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d3ece0;
}

.aura-booking .ab-checking-dots i:first-child {
  background: #0ad083;
}

.aura-booking .ab-week {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  flex: 1;
  border: 1px solid #edf2ee;
  border-radius: 10px;
  background: #fff;
}

.aura-booking .ab-day {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px 9px 22px;
  border-right: 1px solid #edf2ee;
}

.aura-booking .ab-day:last-child {
  border-right: 0;
}

.aura-booking .ab-day-selected {
  background: #ecfdf5;
  border-radius: 9px;
}

.aura-booking .ab-day-heading {
  text-align: center;
  margin-bottom: 12px;
}

.aura-booking .ab-day-heading strong {
  display: block;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.aura-booking .ab-day-heading>span {
  display: block;
  margin-top: 5px;
  font-size: 11px;
  color: #869189;
}

.aura-booking .ab-slot {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 44px;
  padding: 8px 3px;
  border-radius: 7px;
  background: #e7fbf1;
  color: #326656;
  font-size: 12px;
  white-space: nowrap;
}

.aura-booking .ab-slot-unavailable {
  background: #f3f5f5;
  color: #a6aeaa;
}

.aura-booking .ab-slot-selected {
  position: relative;
  z-index: 2;
  color: #fff;
  background: #03d17e;
  font-size: 13px;
  font-weight: 600;
  box-shadow: 0 5px 14px #05ca8124;
}

.aura-booking .ab-selected-dot {
  display: block;
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: inset 0 0 0 3px #03d17e;
  background: #b5ffe1;
}

.aura-booking .ab-calendar-actions {
  display: flex;
  justify-content: center;
  align-self: center;
  margin-top: 26px;
  border: 1px solid #e7eeea;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

.aura-booking .ab-action {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 49px;
  padding: 12px 22px;
  font-size: 13px;
  color: #4e675d;
}

.aura-booking .ab-action+.ab-action {
  border-left: 1px solid #edf2ee;
}

.aura-booking .ab-action-book {
  background: #04cf7c;
  color: #fff;
}

.aura-booking .ab-action .ab-icon {
  width: 22px;
  height: 22px;
}

.aura-booking .ab-calendar-note {
  margin: 18px 0 0;
  text-align: center;
  font-size: 11px;
  line-height: 1.6;
  color: #839087;
}

/* Confirmation */
.aura-booking .ab-confirmation {
  display: flex;
  flex-direction: column;
  padding: 21px 18px 15px;
  border: 2px solid #376a53;
  background: #fff;
  text-align: center;
}

.aura-booking .ab-confirmation-mark {
  width: 143px;
  margin: 0 auto 5px;
}

.aura-booking .ab-confirmation-mark svg {
  display: block;
  width: 100%;
}

.aura-booking .ab-confirmation h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 750;
  line-height: 1.35;
  letter-spacing: -.4px;
  text-transform: uppercase;
}

.aura-booking .ab-confirmed-time {
  margin: 14px 0 7px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.6px;
  line-height: 1.3;
}

.aura-booking .ab-appointment-type {
  margin: 0;
  color: #64776d;
  font-size: 16px;
}

.aura-booking .ab-confirmation-details {
  display: grid;
  gap: 20px;
  margin-top: 22px;
  padding-top: 21px;
  border-top: 1px solid #edf2ee;
  text-align: left;
}

.aura-booking .ab-detail {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 19px;
  gap: 13px;
  align-items: start;
}

.aura-booking .ab-detail>.ab-icon {
  width: 27px;
  height: 27px;
  color: #214c3b;
}

.aura-booking .ab-detail p {
  margin: 0;
  font-size: 12px;
  color: #345547;
  line-height: 1.4;
}

.aura-booking .ab-detail div>span {
  display: block;
  margin-top: 5px;
  font-size: 11px;
  line-height: 1.4;
  color: #86928b;
}

.aura-booking .ab-detail-check {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  margin-top: 5px;
  border-radius: 50%;
  color: #fff;
  background: #08cf80;
  font-size: 12px;
}

.aura-booking .ab-confirmation-benefit {
  margin: auto 0 0;
  padding: 11px 5px;
  border-radius: 7px;
  color: #368467;
  background: #eafbf2;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .25px;
  text-transform: uppercase;
}

/* Connections are visual, not interactive */
.aura-booking .ab-connectors {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}

/* Bottom process */
.aura-booking .ab-footer {
  margin-top: 35px;
}

.aura-booking .ab-process {
  display: grid;
  grid-template-columns: auto minmax(35px, 1fr) auto minmax(35px, 1fr) auto;
  align-items: center;
  gap: 28px;
  padding: 0 6%;
}

.aura-booking .ab-process-step {
  display: flex;
  align-items: center;
  gap: 18px;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -.35px;
}

.aura-booking .ab-process-number {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  color: #163e30;
  background: #edf6f1;
  border-radius: 50%;
  font-size: 19px;
}

.aura-booking .ab-process-final {
  color: #118153;
}

.aura-booking .ab-process-final .ab-process-number {
  color: #118153;
  background: #e4fcf0;
}

.aura-booking .ab-process-arrow {
  position: relative;
  height: 1px;
  background: #bfcec5;
}

.aura-booking .ab-process-arrow::after {
  content: "";
  position: absolute;
  right: 1px;
  top: -4px;
  width: 9px;
  height: 9px;
  border-top: 1px solid #7f988a;
  border-right: 1px solid #7f988a;
  transform: rotate(45deg);
}

.aura-booking .ab-footer>p {
  margin: 15px 0 0;
  text-align: center;
  color: #829087;
  font-size: 14px;
  line-height: 1.5;
}

/* Laptop */
@media (max-width: 1250px) {
  .aura-booking .ab-layout {
    gap: 16px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.8fr) minmax(0, 1fr);
  }

  .aura-booking .ab-call {
    padding: 22px 15px 20px;
  }

  .aura-booking .ab-call-header {
    font-size: 9px;
    letter-spacing: .7px;
  }

  .aura-booking .ab-message {
    padding: 13px 10px 10px;
    gap: 8px;
  }

  .aura-booking .ab-message p {
    font-size: 13px;
  }

  .aura-booking .ab-calendar-panel {
    padding-inline: 12px;
  }

  .aura-booking .ab-checking {
    display: none;
  }

  .aura-booking .ab-day {
    padding-inline: 6px;
  }

  .aura-booking .ab-slot {
    font-size: 10px;
    gap: 4px;
  }

  .aura-booking .ab-slot-selected {
    font-size: 11px;
  }

  .aura-booking .ab-selected-dot {
    width: 12px;
    height: 12px;
    flex-basis: 12px;
  }

  .aura-booking .ab-action {
    padding-inline: 16px;
    font-size: 12px;
  }

  .aura-booking .ab-confirmation {
    padding-inline: 13px;
  }

  .aura-booking .ab-confirmation h3 {
    font-size: 14px;
  }

  .aura-booking .ab-confirmed-time {
    font-size: 18px;
  }

  .aura-booking .ab-detail {
    gap: 8px;
    grid-template-columns: 24px minmax(0, 1fr) 17px;
  }

  .aura-booking .ab-detail>.ab-icon {
    width: 24px;
  }

  .aura-booking .ab-connectors {
    display: none;
  }

  .aura-booking .ab-process {
    padding: 0;
    gap: 20px;
  }

  .aura-booking .ab-process-step {
    font-size: 14px;
    gap: 12px;
  }
}

/* Tablet */
@media (max-width: 950px) {
  .aura-booking {
    padding: 38px 22px 28px;
  }

  .aura-booking .ab-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr);
    gap: 20px;
  }

  .aura-booking .ab-confirmation {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 22px;
  }

  .aura-booking .ab-confirmation h3 {
    font-size: 19px;
  }

  .aura-booking .ab-confirmed-time {
    font-size: 24px;
  }

  .aura-booking .ab-confirmation-details {
    gap: 18px;
  }

  .aura-booking .ab-detail p {
    font-size: 14px;
  }

  .aura-booking .ab-detail div>span {
    font-size: 12px;
  }

  .aura-booking .ab-confirmation-benefit {
    margin-top: 23px;
    font-size: 11px;
  }

  .aura-booking .ab-process {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
  }

  .aura-booking .ab-process-arrow {
    display: none;
  }

  .aura-booking .ab-process-step {
    align-items: flex-start;
  }

  .aura-booking .ab-process-number {
    width: 37px;
    height: 37px;
    flex-basis: 37px;
    font-size: 16px;
  }
}

/* Mobile */
@media (max-width: 650px) {
  .aura-booking {
    padding: 32px 16px 25px;
  }

  .aura-booking .ab-header {
    margin-bottom: 25px;
  }

  .aura-booking .ab-eyebrow {
    font-size: 10px;
    letter-spacing: 2.3px;
    margin-bottom: 12px;
  }

  .aura-booking h2 {
    font-size: 32px;
    letter-spacing: -1px;
  }

  .aura-booking .ab-intro {
    font-size: 15px;
  }

  .aura-booking .ab-layout {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .aura-booking .ab-call {
    width: 100%;
    max-width: 420px;
    margin: auto;
    padding: 23px;
  }

  .aura-booking .ab-call-header {
    font-size: 10px;
  }

  .aura-booking .ab-waveform {
    margin-top: 20px;
  }

  .aura-booking .ab-message p {
    font-size: 15px;
  }

  .aura-booking .ab-message {
    padding: 15px;
  }

  .aura-booking .ab-calendar-panel {
    padding: 20px 10px;
  }

  .aura-booking .ab-calendar-header {
    margin-bottom: 20px;
  }

  .aura-booking .ab-calendar-heading h3 {
    font-size: 9px;
    letter-spacing: .8px;
  }

  .aura-booking .ab-day {
    padding: 15px 3px;
    gap: 11px;
  }

  .aura-booking .ab-day-heading {
    margin-bottom: 9px;
  }

  .aura-booking .ab-day-heading strong {
    font-size: 10px;
  }

  .aura-booking .ab-day-heading>span {
    font-size: 9px;
  }

  .aura-booking .ab-slot {
    min-height: 39px;
    font-size: 9px;
    border-radius: 5px;
    padding-inline: 1px;
  }

  .aura-booking .ab-slot-selected {
    font-size: 9px;
  }

  .aura-booking .ab-selected-dot {
    width: 9px;
    height: 9px;
    flex-basis: 9px;
    border-width: 1px;
    box-shadow: none;
    background: transparent;
  }

  .aura-booking .ab-calendar-actions {
    margin-top: 20px;
    width: 100%;
  }

  .aura-booking .ab-action {
    flex: 1;
    gap: 6px;
    padding: 11px 7px;
    min-height: 44px;
    font-size: 10px;
  }

  .aura-booking .ab-action .ab-icon {
    width: 18px;
    height: 18px;
  }

  .aura-booking .ab-calendar-note {
    padding-inline: 8px;
    font-size: 10px;
  }

  .aura-booking .ab-confirmation {
    grid-column: auto;
  }

  .aura-booking .ab-footer {
    margin-top: 26px;
  }

  .aura-booking .ab-process {
    grid-template-columns: 1fr;
    max-width: 340px;
    margin: auto;
    gap: 18px;
  }

  .aura-booking .ab-process-step {
    align-items: center;
    font-size: 15px;
    gap: 15px;
  }

  .aura-booking .ab-footer>p {
    margin-top: 20px;
    font-size: 13px;
  }
}

.aura-lifecycle {
  --alc-ink: #082c25;
  --alc-muted: #738078;
  --alc-green: #09c981;
  --alc-line: #e2ece6;

  padding: 44px 28px 34px;
  background: #fff;
  color: var(--alc-ink);
  font-family: "Inter", sans-serif;
}

.aura-lifecycle,
.aura-lifecycle * {
  box-sizing: border-box;
}

.aura-lifecycle .alc-container {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
}

.aura-lifecycle .alc-header {
  text-align: center;
  margin-bottom: 34px;
}

.aura-lifecycle .alc-eyebrow {
  margin: 0 0 15px;
  font-size: 12px;
  font-weight: 700;
  color: #16be7b;
  letter-spacing: 2.6px;
  text-transform: uppercase;
}

.aura-lifecycle h2 {
  margin: 0;
  font-size: clamp(30px, 3.3vw, 50px);
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -1.7px;
  text-wrap: balance;
}

.aura-lifecycle .alc-intro {
  margin: 14px auto 0;
  color: var(--alc-muted);
  font-size: clamp(16px, 1.5vw, 21px);
  line-height: 1.55;
}

.aura-lifecycle .alc-diagram {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.aura-lifecycle .alc-diagram text {
  font-family: "Inter", sans-serif;
}

.aura-lifecycle .alc-loop {
  fill: none;
  stroke: #153f33;
  stroke-width: 2.5;
  stroke-linecap: round;
}

.aura-lifecycle .alc-node-icon {
  fill: none;
  stroke: #174d3d;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-lifecycle .alc-node-title {
  fill: #12392d;
  text-anchor: middle;
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -.4px;
}

.aura-lifecycle .alc-node-description {
  fill: #758279;
  text-anchor: middle;
  font-size: 13px;
}

.aura-lifecycle .alc-muted-text {
  fill: #748178;
  font-size: 13px;
}

.aura-lifecycle .alc-callout {
  fill: #fcfdfc;
  stroke: #dce6df;
  stroke-width: 1.2;
}

.aura-lifecycle .alc-callout-text {
  fill: #61766a;
  font-size: 11px;
}

/* Footer */
.aura-lifecycle .alc-footer {
  display: grid;
  grid-template-columns: 1fr 1.1fr 1.2fr 1fr;
  align-items: center;
  gap: 0;
  margin-top: 43px;
  padding-top: 29px;
  border-top: 1px solid var(--alc-line);
}

.aura-lifecycle .alc-benefit {
  display: flex;
  align-items: center;
  gap: 20px;
  min-width: 0;
  padding: 0 28px;
  border-right: 1px solid var(--alc-line);
}

.aura-lifecycle .alc-benefit:first-child {
  padding-left: 0;
}

.aura-lifecycle .alc-check {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border: 1.6px solid #23996a;
  border-radius: 50%;
  color: #19b176;
  font-size: 26px;
  line-height: 1;
}

.aura-lifecycle .alc-benefit h3 {
  margin: 0 0 7px;
  color: #315447;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .7px;
  line-height: 1.3;
  text-transform: uppercase;
}

.aura-lifecycle .alc-benefit p {
  margin: 0;
  color: #839087;
  font-size: 12px;
  line-height: 1.5;
}

.aura-lifecycle .alc-record {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  padding-left: 25px;
  color: #0f9761;
}

.aura-lifecycle .alc-record svg {
  width: 55px;
  height: 30px;
  flex: 0 0 55px;
  color: #04c579;
}

.aura-lifecycle .alc-record p {
  margin: 0;
  color: #19865e;
  font-size: 19px;
  font-weight: 600;
  line-height: 1.4;
}

/* Mobile alternative */
.aura-lifecycle .alc-mobile {
  display: none;
}

.aura-lifecycle .alc-mobile-engine {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 25px 18px;
  border-radius: 20px;
  text-align: center;
  background: linear-gradient(135deg, #073c2e, #042d25);
  color: #fff;
}

.aura-lifecycle .alc-mobile-wave {
  color: #08df8d;
  font-size: 25px;
  letter-spacing: 3px;
}

.aura-lifecycle .alc-mobile-engine strong {
  font-size: 15px;
  letter-spacing: 2px;
}

.aura-lifecycle .alc-mobile-engine>span:last-child {
  color: #b9d7c9;
  font-size: 12px;
  line-height: 1.5;
}

.aura-lifecycle .alc-mobile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.aura-lifecycle .alc-mobile-item {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 17px;
  border: 1px solid var(--alc-line);
  border-radius: 13px;
  background: #fcfefc;
}

.aura-lifecycle .alc-mobile-item svg {
  width: 39px;
  height: 39px;
  flex: 0 0 39px;
  fill: none;
  stroke: #236348;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-lifecycle .alc-mobile-item h3 {
  margin: 0 0 6px;
  font-size: 14px;
  line-height: 1.3;
}

.aura-lifecycle .alc-mobile-item p {
  margin: 0;
  color: var(--alc-muted);
  font-size: 11px;
  line-height: 1.55;
}

.aura-lifecycle .alc-mobile-handoff {
  background: #eafbf2;
  border-color: #d3efdf;
}

/* Laptop */
@media (max-width: 1200px) {
  .aura-lifecycle .alc-benefit {
    gap: 12px;
    padding-inline: 18px;
  }

  .aura-lifecycle .alc-benefit h3 {
    font-size: 10px;
  }

  .aura-lifecycle .alc-benefit p {
    font-size: 11px;
  }

  .aura-lifecycle .alc-record {
    gap: 12px;
    padding-left: 18px;
  }

  .aura-lifecycle .alc-record p {
    font-size: 16px;
  }

  .aura-lifecycle .alc-record svg {
    width: 44px;
    flex-basis: 44px;
  }
}

/* Tablet: use readable cards instead of shrinking diagram text */
@media (max-width: 850px) {
  .aura-lifecycle {
    padding: 36px 22px 28px;
  }

  .aura-lifecycle .alc-header {
    margin-bottom: 25px;
  }

  .aura-lifecycle .alc-diagram {
    /* Keeps SVG symbols available to the mobile illustrations. */
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    visibility: hidden;
  }

  .aura-lifecycle .alc-mobile {
    display: block;
  }

  .aura-lifecycle .alc-footer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px 20px;
    margin-top: 28px;
    padding-top: 25px;
  }

  .aura-lifecycle .alc-benefit,
  .aura-lifecycle .alc-benefit:first-child {
    padding: 0;
    border-right: 0;
    gap: 14px;
  }

  .aura-lifecycle .alc-benefit h3 {
    font-size: 11px;
  }

  .aura-lifecycle .alc-benefit p {
    font-size: 12px;
  }

  .aura-lifecycle .alc-record {
    padding: 0;
    justify-content: flex-start;
    gap: 14px;
  }
}

/* Mobile */
@media (max-width: 520px) {
  .aura-lifecycle {
    padding: 32px 16px 26px;
  }

  .aura-lifecycle .alc-eyebrow {
    font-size: 10px;
    letter-spacing: 2px;
    margin-bottom: 12px;
  }

  .aura-lifecycle h2 {
    font-size: 31px;
    letter-spacing: -1px;
  }

  .aura-lifecycle .alc-intro {
    font-size: 15px;
    margin-top: 12px;
  }

  .aura-lifecycle .alc-mobile-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .aura-lifecycle .alc-mobile-item {
    padding: 16px;
  }

  .aura-lifecycle .alc-mobile-item h3 {
    font-size: 15px;
  }

  .aura-lifecycle .alc-mobile-item p {
    font-size: 12px;
  }

  .aura-lifecycle .alc-footer {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .aura-lifecycle .alc-record {
    padding-top: 20px;
    border-top: 1px solid var(--alc-line);
  }

  .aura-lifecycle .alc-record p {
    font-size: 18px;
  }
}

.aura-conversation {
  --aci-ink: #082e26;
  --aci-muted: #748079;
  --aci-green: #08d18a;
  --aci-line: #e1ece6;

  padding: 46px 28px 30px;
  background: #fff;
  color: var(--aci-ink);
  font-family: "Inter", sans-serif;
}

.aura-conversation,
.aura-conversation * {
  box-sizing: border-box;
}

.aura-conversation .aci-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.aura-conversation .aci-container {
  max-width: 1300px;
  width: 100%;
  margin: 0 auto;
}

/* Heading */
.aura-conversation .aci-header {
  text-align: center;
  margin-bottom: 36px;
}

.aura-conversation .aci-eyebrow {
  margin: 0 0 16px;
  color: #13b978;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
}

.aura-conversation h2 {
  margin: 0;
  font-size: clamp(30px, 3.4vw, 52px);
  line-height: 1.13;
  font-weight: 750;
  letter-spacing: -1.7px;
  text-wrap: balance;
}

.aura-conversation .aci-intro {
  margin: 15px auto 0;
  max-width: 1150px;
  color: var(--aci-muted);
  font-size: clamp(15px, 1.4vw, 20px);
  line-height: 1.55;
}

/* Main visual */
.aura-conversation .aci-layout {
  display: grid;
  grid-template-columns:
    minmax(0, 1.2fr) minmax(240px, .68fr) minmax(0, 1.2fr);
  align-items: center;
  gap: 0;
  min-height: 410px;
}

/* Conversation */
.aura-conversation .aci-conversation {
  position: relative;
  height: 350px;
  min-width: 0;
}

.aura-conversation .aci-caller {
  position: absolute;
  left: 0;
  top: 130px;
  z-index: 2;
  text-align: center;
}

.aura-conversation .aci-caller-avatar {
  display: grid;
  place-items: center;
  width: 78px;
  height: 78px;
  margin-bottom: 12px;
  border: 2px solid #a7f0cf;
  border-radius: 50%;
  background: #e5fbf1;
  box-shadow: 0 0 0 8px #f0fdf6;
}

.aura-conversation .aci-caller-avatar svg {
  width: 42px;
  height: 42px;
  fill: none;
  stroke: #2a7b59;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-conversation .aci-caller strong {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
}

.aura-conversation .aci-caller strong i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #0cce82;
}

.aura-conversation .aci-caller>span:last-child {
  display: block;
  margin-top: 6px;
  color: #8b9890;
  font-size: 12px;
}

.aura-conversation .aci-signal {
  position: absolute;
  top: 83px;
  left: 65px;
  width: calc(100% - 65px);
  height: 210px;
}

.aura-conversation .aci-bubble {
  position: absolute;
  z-index: 2;
  padding: 13px 17px;
  border: 1px solid #e5ece8;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 6px 15px #183b2b05;
}

.aura-conversation .aci-bubble>span {
  position: absolute;
  top: -21px;
  left: 17px;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #94a198;
  text-transform: uppercase;
}

.aura-conversation .aci-bubble p {
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: -.25px;
}

.aura-conversation .aci-bubble-first {
  left: 20%;
  top: 52px;
}

.aura-conversation .aci-bubble-first::after,
.aura-conversation .aci-bubble-second::after {
  content: "";
  position: absolute;
  left: 35px;
  bottom: -9px;
  width: 16px;
  height: 16px;
  border-right: 1px solid #e5ece8;
  border-bottom: 1px solid #e5ece8;
  background: #fff;
  transform: rotate(45deg);
}

.aura-conversation .aci-bubble-second {
  right: 5%;
  top: 84px;
  border-color: #e6dff2;
  background: #fcfaff;
}

.aura-conversation .aci-bubble-second::after {
  background: #fcfaff;
  border-color: #e6dff2;
}

.aura-conversation .aci-bubble-reply {
  left: 30%;
  top: 258px;
  padding-left: 13px;
}

.aura-conversation .aci-reply-content {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aura-conversation .aci-reply-content svg {
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  fill: none;
  stroke: #0bc682;
  stroke-width: 1.8;
  stroke-linecap: round;
}

.aura-conversation .aci-bubble-reply p {
  font-size: 12px;
}

.aura-conversation .aci-topic {
  position: absolute;
  right: 0;
  top: 248px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 30px;
  background: #f0eafb;
  color: #6d5596;
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
}

.aura-conversation .aci-topic>span {
  font-size: 22px;
  line-height: 1;
}

/* Engine */
.aura-conversation .aci-engine {
  position: relative;
  display: grid;
  place-items: center;
  height: 360px;
}

.aura-conversation .aci-orbit {
  position: relative;
  width: 100%;
  max-width: 310px;
  aspect-ratio: 1;
  border: 1px solid #a9dec7;
  border-radius: 50%;
  background: radial-gradient(circle, #e0fced70, transparent 68%);
}

.aura-conversation .aci-orbit::before,
.aura-conversation .aci-orbit::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 24%;
  height: 1.5px;
  background: #0ad487;
}

.aura-conversation .aci-orbit::before {
  left: 0;
}

.aura-conversation .aci-orbit::after {
  right: 0;
}

.aura-conversation .aci-engine-core {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 56%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 2px solid #06d883;
  border-radius: 50%;
  background: radial-gradient(circle at 45% 30%, #105340, #032c25 80%);
  box-shadow:
    0 0 0 13px #e0fced,
    0 0 0 27px #edfcf4,
    0 0 0 40px #f5fdf9;
  z-index: 1;
}

.aura-conversation .aci-core-wave {
  width: 50px;
  height: 50px;
  margin-bottom: 12px;
  fill: none;
  stroke: #0ee58f;
  stroke-width: 2.4;
  stroke-linecap: round;
}

.aura-conversation .aci-engine-core strong {
  color: #fff;
  font-size: 12px;
  text-transform: uppercase;
}

.aura-conversation .aci-engine-core>span {
  margin-top: 5px;
  color: #b2d7c4;
  font-size: 8px;
  text-transform: uppercase;
}

.aura-conversation .aci-language {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 127px;
  justify-content: center;
  padding: 10px 15px;
  border: 1px solid #dceee5;
  border-radius: 30px;
  background: #fff;
  z-index: 3;
  font-size: 12px;
  font-weight: 600;
}

.aura-conversation .aci-language svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: #346353;
  stroke-width: 1.5;
}

.aura-conversation .aci-language-top {
  top: -19px;
  text-transform: uppercase;
}

.aura-conversation .aci-language-bottom {
  bottom: -19px;
}

.aura-conversation .aci-engine-feature {
  position: absolute;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.aura-conversation .aci-engine-feature>span {
  display: grid;
  place-items: center;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background: #053b2b;
  color: #4ce0a1;
  border: 1px solid #178858;
}

.aura-conversation .aci-engine-feature svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
}

.aura-conversation .aci-engine-feature small {
  font-size: 8px;
  color: #466455;
  font-weight: 600;
}

.aura-conversation .aci-feature-interruption {
  top: 21%;
  left: 9%;
}

.aura-conversation .aci-feature-intent {
  top: 21%;
  right: 10%;
}

.aura-conversation .aci-feature-intent>span {
  background: #294d55;
  border-color: #569d9e;
  color: #9de3e0;
}

.aura-conversation .aci-feature-followup {
  bottom: 12%;
  left: 50%;
  transform: translateX(-50%);
}

/* Routing */
.aura-conversation .aci-routing {
  position: relative;
  min-width: 0;
  height: 410px;
}

.aura-conversation .aci-routing-lines {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 360px;
}

.aura-conversation .aci-departments {
  position: relative;
  margin-left: 47%;
  padding-top: 16px;
  display: grid;
  gap: 42px;
}

.aura-conversation .aci-department {
  display: flex;
  align-items: center;
  gap: 17px;
  min-height: 60px;
}

.aura-conversation .aci-department-icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  border-radius: 50%;
}

.aura-conversation .aci-department-icon svg {
  width: 31px;
  height: 31px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-conversation .aci-sales .aci-department-icon {
  color: #78609d;
  background: #f0eafb;
}

.aura-conversation .aci-support .aci-department-icon {
  color: #277e88;
  background: #e7f5f7;
}

.aura-conversation .aci-specialist .aci-department-icon {
  color: #068d55;
  background: #dcfbed;
  box-shadow: 0 0 0 6px #f0fdf6;
}

.aura-conversation .aci-department h3 {
  margin: 0 0 5px;
  font-size: 13px;
  text-transform: uppercase;
}

.aura-conversation .aci-specialist h3 {
  color: #08a45f;
}

.aura-conversation .aci-department p {
  margin: 0;
  color: #849188;
  font-size: 11px;
  line-height: 1.4;
}

.aura-conversation .aci-transfer {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 66px;
  align-items: center;
  gap: 16px;
  margin-top: 20px;
  margin-left: 13%;
}

.aura-conversation .aci-transfer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 28px;
  top: 50%;
  height: 1.5px;
  background: #78e9b5;
}

.aura-conversation .aci-transfer-step {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 44px;
  padding: 7px;
  text-align: center;
  border: 1px solid #a4efc9;
  border-radius: 14px;
  background: #f8fffb;
  font-size: 9px;
  line-height: 1.35;
}

.aura-conversation .aci-specialist-avatar {
  position: relative;
  display: grid;
  place-items: center;
  width: 66px;
  height: 66px;
  border-radius: 50%;
  border: 2px solid #0ed588;
  background: #e3fcf0;
  box-shadow: 0 0 0 5px #f1fdf7;
}

.aura-conversation .aci-specialist-avatar svg {
  width: 36px;
  height: 36px;
  fill: none;
  stroke: #176c49;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-conversation .aci-transfer-complete {
  position: relative;
  display: flex;
  align-items: center;
  gap: 11px;
  width: fit-content;
  margin: 16px 0 0 auto;
  padding: 12px 16px;
  border: 1px solid #d0f5df;
  border-radius: 14px;
  background: #eafff2;
}

.aura-conversation .aci-transfer-check {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  background: #06d183;
  color: #fff;
  border-radius: 50%;
  font-size: 21px;
}

.aura-conversation .aci-transfer-complete strong {
  display: block;
  font-size: 10px;
  color: #16895d;
  text-transform: uppercase;
}

.aura-conversation .aci-transfer-complete p {
  margin: 4px 0 0;
  font-size: 11px;
  color: #698c79;
}

/* Bottom message */
.aura-conversation .aci-footer {
  margin-top: 38px;
  text-align: center;
}

.aura-conversation .aci-outcome {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
}

.aura-conversation .aci-old-process {
  color: #8a958e;
  font-size: 20px;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}

.aura-conversation .aci-outcome-arrow {
  color: #7d9586;
  font-size: 38px;
  line-height: 1;
}

.aura-conversation .aci-outcome strong {
  font-size: 20px;
  letter-spacing: -.5px;
  line-height: 1.5;
}

.aura-conversation .aci-footer>p {
  margin: 17px 0 0;
  color: #839087;
  font-size: 15px;
  line-height: 1.5;
}

/* Laptop */
@media (max-width: 1200px) {
  .aura-conversation .aci-layout {
    grid-template-columns: minmax(0, 1fr) 245px minmax(0, 1fr);
  }

  .aura-conversation .aci-bubble {
    padding: 11px 12px;
  }

  .aura-conversation .aci-bubble p {
    font-size: 12px;
  }

  .aura-conversation .aci-bubble-first {
    left: 15%;
  }

  .aura-conversation .aci-bubble-second {
    right: 0;
  }

  .aura-conversation .aci-bubble-reply {
    left: 19%;
    top: 272px;
  }

  .aura-conversation .aci-topic {
    top: 233px;
    font-size: 7px;
    padding-inline: 8px;
  }

  .aura-conversation .aci-caller-avatar {
    width: 62px;
    height: 62px;
  }

  .aura-conversation .aci-signal {
    left: 48px;
    width: calc(100% - 48px);
  }

  .aura-conversation .aci-departments {
    margin-left: 35%;
  }

  .aura-conversation .aci-department {
    gap: 10px;
  }

  .aura-conversation .aci-department-icon {
    width: 48px;
    height: 48px;
    flex-basis: 48px;
  }

  .aura-conversation .aci-transfer {
    margin-left: 0;
    gap: 8px;
    grid-template-columns: 1fr 1fr 1fr 48px;
  }

  .aura-conversation .aci-transfer-step {
    font-size: 8px;
  }

  .aura-conversation .aci-specialist-avatar {
    width: 48px;
    height: 48px;
  }

  .aura-conversation .aci-specialist-avatar svg {
    width: 28px;
  }
}

/* Tablet */
@media (max-width: 950px) {
  .aura-conversation {
    padding: 38px 22px 28px;
  }

  .aura-conversation .aci-layout {
    grid-template-columns: minmax(0, 1.2fr) minmax(240px, .8fr);
    gap: 20px;
  }

  .aura-conversation .aci-routing {
    grid-column: 1 / -1;
    height: auto;
    max-width: 650px;
    width: 100%;
    margin: 15px auto 0;
  }

  .aura-conversation .aci-routing-lines {
    display: none;
  }

  .aura-conversation .aci-departments {
    margin: 0;
    padding: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
  }

  .aura-conversation .aci-department {
    flex-direction: column;
    text-align: center;
    gap: 12px;
  }

  .aura-conversation .aci-transfer {
    margin-top: 26px;
    grid-template-columns: 1fr 1fr 1fr 62px;
    gap: 16px;
  }

  .aura-conversation .aci-transfer-step {
    font-size: 11px;
    min-height: 50px;
  }

  .aura-conversation .aci-specialist-avatar {
    width: 62px;
    height: 62px;
  }

  .aura-conversation .aci-transfer-complete {
    margin: 20px auto 0;
  }

  .aura-conversation .aci-outcome {
    gap: 15px;
  }

  .aura-conversation .aci-old-process,
  .aura-conversation .aci-outcome strong {
    font-size: 17px;
  }
}

/* Mobile */
@media (max-width: 650px) {
  .aura-conversation {
    padding: 32px 16px 26px;
  }

  .aura-conversation .aci-eyebrow {
    font-size: 10px;
    letter-spacing: 2px;
  }

  .aura-conversation h2 {
    font-size: 31px;
    letter-spacing: -1px;
  }

  .aura-conversation .aci-heading-break {
    display: none;
  }

  .aura-conversation .aci-intro {
    font-size: 15px;
  }

  .aura-conversation .aci-layout {
    grid-template-columns: 1fr;
    gap: 25px;
  }

  .aura-conversation .aci-conversation {
    width: 100%;
    max-width: 470px;
    margin: auto;
    height: 345px;
  }

  .aura-conversation .aci-bubble-first {
    left: 22%;
    top: 35px;
  }

  .aura-conversation .aci-bubble-second {
    top: 116px;
  }

  .aura-conversation .aci-bubble-reply {
    left: 22%;
    top: 272px;
  }

  .aura-conversation .aci-topic {
    top: 242px;
  }

  .aura-conversation .aci-engine {
    height: 340px;
  }

  .aura-conversation .aci-orbit {
    width: 285px;
  }

  .aura-conversation .aci-engine-core strong {
    font-size: 13px;
  }

  .aura-conversation .aci-routing {
    grid-column: auto;
    margin-top: 0;
  }

  .aura-conversation .aci-departments {
    gap: 10px;
  }

  .aura-conversation .aci-department h3 {
    font-size: 11px;
  }

  .aura-conversation .aci-department p {
    font-size: 10px;
  }

  .aura-conversation .aci-transfer {
    gap: 9px;
    grid-template-columns: 1fr 1fr 1fr 43px;
  }

  .aura-conversation .aci-transfer-step {
    font-size: 8px;
    padding-inline: 4px;
    min-height: 44px;
    border-radius: 10px;
  }

  .aura-conversation .aci-specialist-avatar {
    width: 43px;
    height: 43px;
  }

  .aura-conversation .aci-specialist-avatar svg {
    width: 26px;
  }

  .aura-conversation .aci-footer {
    margin-top: 30px;
  }

  .aura-conversation .aci-outcome {
    flex-direction: column;
    gap: 12px;
  }

  .aura-conversation .aci-old-process {
    font-size: 15px;
  }

  .aura-conversation .aci-outcome-arrow {
    transform: rotate(90deg);
    font-size: 29px;
  }

  .aura-conversation .aci-outcome strong {
    font-size: 18px;
    max-width: 330px;
  }

  .aura-conversation .aci-footer>p {
    font-size: 13px;
  }
}

.aura-stack {
  --ast-ink: #082e25;
  --ast-muted: #6f8077;
  --ast-green: #08ce83;
  --ast-line: #dfeae3;

  padding: 56px 30px 35px;
  background: #fff;
  color: var(--ast-ink);
  font-family: "Inter", sans-serif;
}

.aura-stack,
.aura-stack * {
  box-sizing: border-box;
}

.aura-stack .ast-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.aura-stack .ast-container {
  max-width: 1300px;
  width: 100%;
  margin: 0 auto;
}

/* Left-aligned heading */
.aura-stack .ast-eyebrow {
  margin: 0 0 17px;
  color: #0bbe78;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.aura-stack h2 {
  margin: 0;
  font-size: clamp(32px, 3.7vw, 56px);
  line-height: 1.12;
  letter-spacing: -2px;
  font-weight: 750;
  text-wrap: balance;
}

.aura-stack .ast-intro {
  max-width: 1180px;
  margin: 22px 0 0;
  color: var(--ast-muted);
  font-size: clamp(16px, 1.65vw, 24px);
  line-height: 1.55;
}

/* Main diagram */
.aura-stack .ast-diagram {
  display: grid;
  grid-template-columns:
    155px minmax(65px, .36fr) 220px minmax(250px, 1fr) minmax(420px, 1.35fr);
  align-items: center;
  margin-top: 34px;
  min-height: 285px;
}

.aura-stack .ast-inputs {
  display: grid;
  gap: 26px;
}

.aura-stack .ast-input {
  display: flex;
  align-items: center;
  gap: 15px;
}

.aura-stack .ast-input strong {
  font-size: 14px;
  font-weight: 600;
}

.aura-stack .ast-round-icon {
  display: grid;
  place-items: center;
  width: 61px;
  height: 61px;
  flex: 0 0 61px;
  border: 1px solid #acf0cf;
  border-radius: 50%;
  background: #edfcf4;
  color: #235a43;
}

.aura-stack .ast-round-icon svg {
  width: 29px;
  height: 29px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-stack .ast-merge {
  display: block;
  width: 100%;
  height: 260px;
}

/* Engine */
.aura-stack .ast-engine {
  position: relative;
  display: grid;
  place-items: center;
  height: 250px;
}

.aura-stack .ast-engine::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 5px;
  transform: translateY(-50%);
  background: #11774d;
}

.aura-stack .ast-engine-core {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 176px;
  height: 176px;
  border: 2px solid #b0f1cc;
  border-radius: 50%;
  background: radial-gradient(circle at 45% 35%, #0a4d38, #032d24 80%);
  box-shadow: 0 0 0 8px #f0fdf5;
  z-index: 1;
}

.aura-stack .ast-engine-core::after {
  content: "";
  position: absolute;
  inset: -24px;
  border: 2px dotted #d4f5e3;
  border-radius: 50%;
}

.aura-stack .ast-engine-wave {
  width: 77px;
  height: 65px;
  margin-bottom: 7px;
  fill: none;
  stroke: #07df8d;
  stroke-width: 4.5;
  stroke-linecap: round;
}

.aura-stack .ast-engine-core strong {
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.aura-stack .ast-engine-core>span {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 9px;
  color: #0cdd86;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .7px;
  text-transform: uppercase;
}

.aura-stack .ast-engine-core i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #08df88;
}

/* Structured data */
.aura-stack .ast-data {
  position: relative;
  min-width: 0;
}

.aura-stack .ast-data-items {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding-bottom: 33px;
}

.aura-stack .ast-data-items::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 23px;
  height: 5px;
  background: #11774d;
}

.aura-stack .ast-data-items::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 36px;
  border-top: 2px dotted #3bb484;
}

.aura-stack .ast-data-item {
  position: relative;
  z-index: 1;
  text-align: center;
}

.aura-stack .ast-data-icon {
  display: grid;
  place-items: center;
  width: 47px;
  height: 47px;
  margin: 0 auto;
  border: 1px solid #bff2d7;
  border-radius: 13px;
  color: #285d46;
  background: #f3fff7;
}

.aura-stack .ast-data-icon svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-stack .ast-data-item strong {
  display: block;
  margin-top: 9px;
  font-size: 12px;
  font-weight: 600;
}

.aura-stack .ast-sync-label {
  position: absolute;
  left: 50%;
  bottom: -62px;
  width: max-content;
  max-width: 390px;
  transform: translateX(-50%);
  margin: 0;
  color: #17a46b;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 1.5;
  text-align: center;
  text-transform: uppercase;
}

/* Integration branches */
.aura-stack .ast-integrations {
  position: relative;
  padding-left: 40px;
  min-width: 0;
}

.aura-stack .ast-branch {
  position: absolute;
  left: 0;
  top: -64px;
  width: calc(100% - 28px);
  height: 110px;
}

.aura-stack .ast-integration-items {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 7px;
  padding-bottom: 0;
  transform: translateY(34px);
}

.aura-stack .ast-integration {
  min-width: 0;
  text-align: center;
}

.aura-stack .ast-integration .ast-round-icon {
  margin: 0 auto;
}

.aura-stack .ast-integration h3 {
  margin: 9px 0 5px;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}

.aura-stack .ast-integration p {
  margin: 0;
  color: #87928b;
  font-size: 10px;
  line-height: 1.5;
}

/* Bottom explanation */
.aura-stack .ast-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 30px;
  margin-top: 44px;
  padding-top: 25px;
  border-top: 1px solid #dbe6df;
}

.aura-stack .ast-footer>p {
  margin: 0;
  color: #788980;
  font-size: 16px;
  line-height: 1.65;
}

.aura-stack .ast-footer>p strong {
  color: #234d3a;
  font-weight: 700;
}

.aura-stack .ast-no-entry {
  display: flex;
  align-items: center;
  gap: 18px;
  padding-left: 30px;
  border-left: 1px solid #dbe6df;
}

.aura-stack .ast-no-entry svg {
  width: 68px;
  height: 68px;
  flex: 0 0 68px;
  fill: none;
  stroke: #285d43;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-stack .ast-no-entry strong {
  font-size: 12px;
  letter-spacing: .7px;
  line-height: 1.5;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Laptop: rearrange integrations below the pipeline */
@media (max-width: 1250px) {
  .aura-stack .ast-diagram {
    grid-template-columns: 155px minmax(65px, .4fr) 220px minmax(250px, 1fr);
    row-gap: 55px;
  }

  .aura-stack .ast-integrations {
    grid-column: 1 / -1;
    padding-left: 0;
    max-width: 780px;
    width: 100%;
    margin: auto;
  }

  .aura-stack .ast-branch {
    display: none;
  }

  .aura-stack .ast-integration-items {
    transform: none;
    gap: 20px;
    padding-top: 22px;
    border-top: 1px solid #cce6d8;
  }

  .aura-stack .ast-sync-label {
    bottom: -34px;
  }

  .aura-stack .ast-footer>p {
    font-size: 14px;
  }

  .aura-stack .ast-no-entry {
    padding-left: 22px;
    gap: 12px;
  }

  .aura-stack .ast-no-entry svg {
    width: 55px;
    height: 55px;
    flex-basis: 55px;
  }
}

/* Tablet */
@media (max-width: 800px) {
  .aura-stack {
    padding: 38px 22px 28px;
  }

  .aura-stack h2 {
    letter-spacing: -1.2px;
  }

  .aura-stack .ast-intro {
    font-size: 17px;
  }

  .aura-stack .ast-diagram {
    grid-template-columns: 1fr;
    gap: 25px;
    margin-top: 28px;
  }

  .aura-stack .ast-inputs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
  }

  .aura-stack .ast-input {
    flex-direction: column;
    text-align: center;
    gap: 10px;
  }

  .aura-stack .ast-merge {
    display: none;
  }

  .aura-stack .ast-engine {
    height: 220px;
  }

  .aura-stack .ast-engine::before {
    top: 0;
    bottom: 0;
    left: 50%;
    right: auto;
    width: 2px;
    height: auto;
    transform: translateX(-50%);
    background: #b2e7cb;
  }

  .aura-stack .ast-data {
    max-width: 440px;
    width: 100%;
    margin: auto;
  }

  .aura-stack .ast-data-items {
    padding-bottom: 0;
  }

  .aura-stack .ast-sync-label {
    position: static;
    transform: none;
    width: auto;
    max-width: none;
    margin-top: 23px;
    font-size: 10px;
  }

  .aura-stack .ast-integrations {
    grid-column: auto;
    margin-top: 0;
  }

  .aura-stack .ast-integration-items {
    gap: 10px;
  }

  .aura-stack .ast-integration .ast-round-icon {
    width: 52px;
    height: 52px;
  }

  .aura-stack .ast-integration h3 {
    font-size: 11px;
  }

  .aura-stack .ast-integration p {
    font-size: 9px;
  }

  .aura-stack .ast-footer {
    grid-template-columns: 1fr;
    gap: 22px;
    margin-top: 30px;
  }

  .aura-stack .ast-no-entry {
    padding: 0;
    border: 0;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .aura-stack {
    padding: 32px 16px 25px;
  }

  .aura-stack .ast-eyebrow {
    font-size: 10px;
    letter-spacing: 1.7px;
    margin-bottom: 12px;
  }

  .aura-stack h2 {
    font-size: 32px;
    letter-spacing: -1px;
  }

  .aura-stack .ast-intro {
    margin-top: 17px;
    font-size: 15px;
    line-height: 1.7;
  }

  .aura-stack .ast-input strong {
    font-size: 12px;
  }

  .aura-stack .ast-round-icon {
    width: 53px;
    height: 53px;
    flex-basis: 53px;
  }

  .aura-stack .ast-data-item strong {
    font-size: 11px;
  }

  .aura-stack .ast-integration-items {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px 12px;
  }

  .aura-stack .ast-integration h3 {
    font-size: 12px;
  }

  .aura-stack .ast-integration p {
    font-size: 10px;
  }

  .aura-stack .ast-footer>p {
    font-size: 13px;
  }

  .aura-stack .ast-no-entry strong {
    font-size: 11px;
  }
}

.aura-insights {
  --ai-ink: #092e26;
  --ai-muted: #748078;
  --ai-line: #e1ece6;

  padding: 42px 28px 24px;
  background: #fff;
  color: var(--ai-ink);
  font-family: "Inter", sans-serif;
}

.aura-insights,
.aura-insights * {
  box-sizing: border-box;
}

.aura-insights .ai-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.aura-insights .ai-container {
  max-width: 1300px;
  width: 100%;
  margin: auto;
}

.aura-insights .ai-eyebrow {
  margin: 0 0 14px;
  color: #0dba78;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.aura-insights h2 {
  margin: 0;
  font-size: clamp(32px, 3.8vw, 57px);
  font-weight: 750;
  line-height: 1.12;
  letter-spacing: -2px;
  text-wrap: balance;
}

.aura-insights .ai-intro {
  margin: 20px 0 0;
  color: var(--ai-muted);
  font-size: clamp(16px, 1.5vw, 21px);
  line-height: 1.6;
}

/* Main diagram */
.aura-insights .ai-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  gap: 38px;
  align-items: center;
  margin-top: 24px;
}

.aura-insights .ai-capture {
  position: relative;
  min-width: 0;
}

.aura-insights .ai-capture::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 50%;
  width: 38px;
  border-top: 2px dotted #76d3a9;
}

.aura-insights .ai-capture-svg {
  display: block;
  width: 100%;
  height: auto;
}

.aura-insights svg text {
  font-family: "Inter", sans-serif;
}

.aura-insights .ai-svg-label {
  fill: #355646;
  font-size: 13px;
  font-weight: 600;
}

/* Dashboard */
.aura-insights .ai-dashboard {
  min-width: 0;
  border: 1px solid #d7e7de;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

.aura-insights .ai-dashboard-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  min-height: 45px;
  padding: 13px 19px;
  background: #06372b;
  color: #fff;
}

.aura-insights .ai-dashboard-header h3 {
  margin: 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.1px;
  text-transform: uppercase;
}

.aura-insights .ai-dashboard-header>span {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #51df9e;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .5px;
  text-transform: uppercase;
}

.aura-insights .ai-dashboard-header i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #37df97;
  box-shadow: 0 0 8px #37df9760;
}

.aura-insights .ai-dashboard-body {
  padding: 0 19px 20px;
}

.aura-insights .ai-dashboard-filter {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  padding: 10px 0;
  border-bottom: 1px solid #edf2ef;
  color: #718278;
  font-size: 9px;
}

.aura-insights .ai-dashboard-filter>span>span {
  margin-left: 6px;
}

.aura-insights .ai-volume {
  padding-top: 13px;
}

.aura-insights .ai-volume>p {
  margin: 0 0 4px;
  font-size: 11px;
  color: #4d6b5b;
}

.aura-insights .ai-volume>strong {
  display: block;
  font-size: 28px;
  letter-spacing: -.8px;
  line-height: 1.1;
}

.aura-insights .ai-line-chart {
  width: 100%;
  height: auto;
  display: block;
  margin-top: 4px;
}

.aura-insights .ai-metrics {
  display: grid;
  grid-template-columns: .9fr 1fr 1.15fr;
  margin-top: 22px;
}

.aura-insights .ai-metric {
  min-width: 0;
  padding: 0 17px;
  border-right: 1px solid #e9efeb;
}

.aura-insights .ai-metric:first-child {
  padding-left: 0;
}

.aura-insights .ai-metric:last-child {
  padding-right: 0;
  border: 0;
}

.aura-insights .ai-metric h4 {
  margin: 0 0 10px;
  color: #4c6658;
  font-size: 10px;
  line-height: 1.4;
  font-weight: 600;
}

.aura-insights .ai-metric>strong {
  display: block;
  font-size: 25px;
  line-height: 1.2;
  letter-spacing: -.5px;
}

/* Conversion donut */
.aura-insights .ai-donut {
  position: relative;
  width: 95px;
  max-width: 100%;
  aspect-ratio: 1;
}

.aura-insights .ai-donut svg {
  width: 100%;
  height: 100%;
  display: block;
  transform: rotate(-90deg);
}

.aura-insights .ai-donut circle {
  fill: none;
  stroke-width: 10px;
}

.aura-insights .ai-donut-track {
  stroke: #eee8f6;
}

.aura-insights .ai-donut-value {
  stroke: #9674be;
  stroke-dasharray: 85.45 251.33;
  stroke-linecap: round;
}

.aura-insights .ai-donut strong {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #665080;
  font-size: 20px;
}

/* Qualification progress */
.aura-insights .ai-qualification>strong {
  margin-top: 20px;
  color: #20838c;
}

.aura-insights .ai-progress {
  height: 15px;
  margin-top: 15px;
  overflow: hidden;
  border-radius: 20px;
  background: #e4f0f2;
}

.aura-insights .ai-progress span {
  display: block;
  width: 61%;
  height: 100%;
  border-radius: inherit;
  background: #29a5ab;
}

/* Booking bars */
.aura-insights .ai-bookings>strong {
  color: #11935f;
}

.aura-insights .ai-bar-chart {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  height: 65px;
  margin-top: 7px;
}

.aura-insights .ai-bar-chart i {
  flex: 1;
  min-width: 0;
  height: var(--bar);
  background: #0fc783;
  border-radius: 2px 2px 0 0;
}

.aura-insights .ai-bar-chart i:nth-child(3n + 1) {
  background: #a7eccd;
}

/* Bottom process */
.aura-insights .ai-process {
  display: grid;
  grid-template-columns: auto minmax(35px, 1fr) auto minmax(35px, .7fr) auto;
  align-items: center;
  gap: 24px;
  margin: 32px 5% 0;
}

.aura-insights .ai-process-item {
  display: flex;
  align-items: center;
  gap: 15px;
}

.aura-insights .ai-process-icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  border-radius: 50%;
  background: #e7faf0;
  color: #14ad70;
}

.aura-insights .ai-process-icon svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-insights .ai-process-item:last-child svg {
  fill: currentColor;
  stroke: none;
}

.aura-insights .ai-process-item strong {
  color: #426454;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .9px;
  line-height: 1.5;
  text-transform: uppercase;
}

.aura-insights .ai-process-arrow {
  position: relative;
  height: 1px;
  background: #a5cbb8;
}

.aura-insights .ai-process-arrow::after {
  content: "";
  position: absolute;
  top: -4px;
  right: 1px;
  width: 9px;
  height: 9px;
  border-top: 1px solid #729d88;
  border-right: 1px solid #729d88;
  transform: rotate(45deg);
}

.aura-insights .ai-footer {
  margin-top: 27px;
  padding-top: 17px;
  border-top: 1px solid var(--ai-line);
  text-align: center;
  color: #93a096;
  font-size: 12px;
  line-height: 1.5;
}

/* Laptop */
@media (max-width: 1150px) {
  .aura-insights .ai-layout {
    gap: 23px;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  }

  .aura-insights .ai-capture::after {
    width: 23px;
  }

  .aura-insights .ai-dashboard-header {
    padding-inline: 13px;
  }

  .aura-insights .ai-dashboard-header>span {
    font-size: 7px;
  }

  .aura-insights .ai-dashboard-body {
    padding-inline: 13px;
  }

  .aura-insights .ai-metric {
    padding-inline: 10px;
  }

  .aura-insights .ai-metric h4 {
    font-size: 9px;
  }

  .aura-insights .ai-process {
    margin-inline: 0;
    gap: 16px;
  }

  .aura-insights .ai-process-item {
    gap: 10px;
  }

  .aura-insights .ai-process-item strong {
    font-size: 9px;
  }
}

/* Tablet */
@media (max-width: 850px) {
  .aura-insights {
    padding: 36px 22px 25px;
  }

  .aura-insights h2 {
    letter-spacing: -1.2px;
  }

  .aura-insights .ai-layout {
    grid-template-columns: 1fr;
    gap: 25px;
  }

  .aura-insights .ai-capture {
    max-width: 760px;
    width: 100%;
    margin: auto;
  }

  .aura-insights .ai-capture::after {
    display: none;
  }

  .aura-insights .ai-dashboard {
    max-width: 650px;
    width: 100%;
    margin: auto;
  }

  .aura-insights .ai-dashboard-header>span {
    font-size: 9px;
  }

  .aura-insights .ai-dashboard-body {
    padding-inline: 19px;
  }

  .aura-insights .ai-metric h4 {
    font-size: 11px;
  }

  .aura-insights .ai-process {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
  }

  .aura-insights .ai-process-arrow {
    display: none;
  }

  .aura-insights .ai-process-item {
    flex-direction: column;
    text-align: center;
  }

  .aura-insights .ai-process-item strong {
    font-size: 10px;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .aura-insights {
    padding: 32px 16px 24px;
  }

  .aura-insights .ai-eyebrow {
    font-size: 10px;
    margin-bottom: 12px;
  }

  .aura-insights h2 {
    font-size: 32px;
    letter-spacing: -1px;
  }

  .aura-insights .ai-intro {
    margin-top: 15px;
    font-size: 15px;
    line-height: 1.65;
  }

  /* Keep the detailed SVG legible on narrow screens */
  .aura-insights .ai-capture {
    overflow-x: auto;
    padding-bottom: 8px;
  }

  .aura-insights .ai-capture-svg {
    width: 620px;
    max-width: none;
  }

  .aura-insights .ai-dashboard-header {
    flex-wrap: wrap;
    gap: 7px;
  }

  .aura-insights .ai-dashboard-header h3 {
    font-size: 9px;
  }

  .aura-insights .ai-dashboard-header>span {
    font-size: 7px;
  }

  .aura-insights .ai-dashboard-body {
    padding: 0 12px 16px;
  }

  .aura-insights .ai-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 0;
  }

  .aura-insights .ai-metric {
    padding-inline: 12px;
  }

  .aura-insights .ai-qualification {
    border: 0;
  }

  .aura-insights .ai-bookings {
    grid-column: 1 / -1;
    padding: 16px 0 0;
    border-top: 1px solid #e9efeb;
  }

  .aura-insights .ai-bar-chart {
    max-width: 230px;
    height: 75px;
  }

  .aura-insights .ai-process {
    grid-template-columns: 1fr;
    gap: 17px;
    margin-top: 25px;
  }

  .aura-insights .ai-process-item {
    flex-direction: row;
    text-align: left;
    gap: 14px;
  }

  .aura-insights .ai-process-icon {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
  }

  .aura-insights .ai-process-item strong {
    font-size: 11px;
  }
}

.aura-industries {
  --aui-ink: #082e25;
  --aui-muted: #718178;
  --aui-green: #0bc982;

  padding: 36px 28px 24px;
  color: var(--aui-ink);
  background: #fff;
  font-family: "Inter", sans-serif;
}

.aura-industries,
.aura-industries * {
  box-sizing: border-box;
}

.aura-industries .aui-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.aura-industries .aui-container {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
}

.aura-industries .aui-header {
  text-align: center;
}

.aura-industries .aui-eyebrow {
  margin: 0 0 12px;
  color: #10b875;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.aura-industries h2 {
  margin: 0;
  font-size: clamp(30px, 3.3vw, 50px);
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -1.7px;
  text-wrap: balance;
}

.aura-industries .aui-intro {
  max-width: 1380px;
  margin: 13px auto 0;
  color: var(--aui-muted);
  font-size: clamp(15px, 1.35vw, 20px);
  line-height: 1.55;
}

/* Scalable radial layout */
.aura-industries .aui-map {
  position: relative;
  width: 100%;
  max-width: 1200px;
  aspect-ratio: 1200 / 650;
  margin: 8px auto 0;
}

.aura-industries .aui-orbits {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.aura-industries .aui-core {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #fff;
  background: radial-gradient(circle at 42% 30%, #08462e, #032d24 85%);
  z-index: 2;
}

.aura-industries .aui-core>svg {
  width: 55%;
  height: 36%;
  margin-bottom: 9%;
  fill: none;
  stroke: #0be58e;
  stroke-width: 4;
  stroke-linecap: round;
}

.aura-industries .aui-core strong {
  font-size: clamp(10px, 1.2vw, 16px);
  letter-spacing: 2px;
  text-transform: uppercase;
}

.aura-industries .aui-core>span {
  margin-top: 5%;
  color: #bbdcca;
  font-size: clamp(6px, .72vw, 9px);
  letter-spacing: .6px;
  text-transform: uppercase;
}

.aura-industries .aui-core small {
  margin-top: 8%;
  padding: 5px 13px;
  border-radius: 20px;
  color: #3ae6a1;
  background: #087b4b;
  font-size: clamp(7px, .75vw, 10px);
  font-weight: 600;
  text-transform: uppercase;
}

/* Industry nodes */
.aura-industries .aui-industry {
  --node-bg: #eafbf2;
  --node-color: #287153;
  --node-border: #d0efdf;

  position: absolute;
  width: 180px;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  z-index: 3;
}

.aura-industries .aui-industry-icon {
  display: grid;
  place-items: center;
  width: clamp(48px, 4.3vw, 64px);
  height: clamp(48px, 4.3vw, 64px);
  flex-shrink: 0;
  border: 1px solid var(--node-border);
  border-radius: 50%;
  color: var(--node-color);
  background: var(--node-bg);
}

.aura-industries .aui-industry-icon svg {
  width: 48%;
  height: 48%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-industries .aui-industry h3 {
  margin: 0;
  color: #34584a;
  font-size: clamp(10px, 1vw, 14px);
  line-height: 1.3;
  font-weight: 600;
  text-align: center;
}

.aura-industries .aui-real-estate {
  top: 7%;
  left: 50%;
}

.aura-industries .aui-healthcare {
  top: 23%;
  left: 68.3%;
  --node-bg: #d8fae9;
  --node-color: #0aa967;
  --node-border: #9beac3;
}

.aura-industries .aui-healthcare .aui-industry-icon {
  box-shadow: 0 0 0 5px #effdf5;
}

.aura-industries .aui-healthcare h3 {
  color: #0aa568;
}

.aura-industries .aui-retail {
  top: 59.7%;
  left: 73%;
  --node-bg: #eef1fd;
  --node-color: #637eb1;
  --node-border: #dce3f6;
}

.aura-industries .aui-finance {
  top: 89%;
  left: 60.2%;
  --node-bg: #edf7fa;
  --node-color: #327d91;
  --node-border: #d5eaf0;
}

.aura-industries .aui-hospitality {
  top: 89%;
  left: 39.8%;
  --node-bg: #fff6e8;
  --node-color: #ac8143;
  --node-border: #f0e2c9;
}

.aura-industries .aui-education {
  top: 59.7%;
  left: 27%;
  --node-bg: #f3edfb;
  --node-color: #8863ad;
  --node-border: #e5d8f3;
}

.aura-industries .aui-professional {
  top: 23%;
  left: 31.7%;
  --node-bg: #e8f6f5;
  --node-color: #3f8983;
  --node-border: #d2e9e5;
}

/* Inner workflow ring */
.aura-industries .aui-workflow {
  position: absolute;
  width: 100px;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  z-index: 3;
}

.aura-industries .aui-workflow-icon {
  display: grid;
  place-items: center;
  width: clamp(43px, 3.7vw, 55px);
  height: clamp(43px, 3.7vw, 55px);
  border: 1px solid #ccebdd;
  border-radius: 50%;
  color: #346b52;
  background: #f1fcf6;
}

.aura-industries .aui-workflow-icon svg {
  width: 47%;
  height: 47%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-industries .aui-workflow p {
  margin: 0;
  font-size: clamp(8px, .85vw, 11px);
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  color: #456555;
}

.aura-industries .aui-inbound {
  top: 25%;
  left: 50%;
}

.aura-industries .aui-outbound {
  top: 34.4%;
  left: 60.6%;
}

.aura-industries .aui-leads {
  top: 56.4%;
  left: 63.2%;
}

.aura-industries .aui-appointments {
  top: 72.6%;
  left: 55.9%;
}

.aura-industries .aui-triage {
  top: 72.6%;
  left: 44.1%;
}

.aura-industries .aui-followup {
  top: 56.4%;
  left: 36.8%;
}

.aura-industries .aui-crm {
  top: 34.4%;
  left: 39.4%;
}

.aura-industries .aui-inbound .aui-workflow-icon,
.aura-industries .aui-appointments .aui-workflow-icon,
.aura-industries .aui-crm .aui-workflow-icon {
  color: #fff;
  border-color: #8dedbf;
  background: #09cd7c;
  box-shadow: 0 0 0 5px #e8fff1;
}

/* Healthcare outcome */
.aura-industries .aui-healthcare-outcome {
  position: absolute;
  top: 15%;
  left: 76%;
  display: flex;
  align-items: center;
  gap: 7px;
  width: max-content;
  max-width: 34%;
  padding: 10px 14px;
  border: 1px solid #9be7c1;
  border-radius: 30px;
  background: #f2fff7;
  color: #199862;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.5;
  text-transform: uppercase;
  z-index: 4;
}

.aura-industries .aui-healthcare-outcome::before {
  content: "";
  position: absolute;
  right: 100%;
  top: 50%;
  width: 45px;
  height: 25px;
  border-top: 1.5px solid #18c881;
  border-radius: 100% 0 0 0;
}

.aura-industries .aui-healthcare-outcome>span {
  font-size: 14px;
}

/* Footer */
.aura-industries .aui-footer {
  margin-top: 16px;
  padding: 15px 0 0;
  border-top: 1px solid #e1ece6;
  color: #78867d;
  font-size: 13px;
  line-height: 1.65;
  text-align: center;
}

.aura-industries .aui-footer strong {
  color: #486554;
  font-weight: 600;
}

/* Smaller desktop */
@media (max-width: 1250px) {
  .aura-industries .aui-healthcare-outcome {
    left: 74%;
    max-width: 26%;
    padding: 8px 10px;
    font-size: 7px;
  }

  .aura-industries .aui-industry {
    width: 155px;
  }
}

/* Tablet and mobile: clear, readable groups */
@media (max-width: 850px) {
  .aura-industries {
    padding: 34px 22px 26px;
  }

  .aura-industries .aui-map {
    aspect-ratio: auto;
    display: flex;
    flex-direction: column;
    gap: 25px;
    margin-top: 28px;
  }

  .aura-industries .aui-orbits {
    display: none;
  }

  .aura-industries .aui-core {
    position: relative;
    top: auto;
    left: auto;
    width: 180px;
    transform: none;
    margin: 0 auto;
  }

  .aura-industries .aui-core strong {
    font-size: 14px;
  }

  .aura-industries .aui-core>span {
    font-size: 8px;
  }

  .aura-industries .aui-core small {
    font-size: 10px;
  }

  .aura-industries .aui-industries {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
  }

  .aura-industries .aui-industry {
    position: static;
    transform: none;
    width: auto;
    min-width: 0;
    padding: 17px 10px;
    border: 1px solid var(--node-border);
    border-radius: 15px;
    background: var(--node-bg);
  }

  .aura-industries .aui-industry-icon {
    width: 53px;
    height: 53px;
    background: #ffffff90;
  }

  .aura-industries .aui-industry h3 {
    font-size: 12px;
  }

  .aura-industries .aui-workflows {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px 12px;
    padding: 24px 0;
    border-top: 1px solid #e1ece6;
    border-bottom: 1px solid #e1ece6;
  }

  .aura-industries .aui-workflow {
    position: static;
    width: auto;
    transform: none;
  }

  .aura-industries .aui-workflow-icon {
    width: 49px;
    height: 49px;
  }

  .aura-industries .aui-workflow p {
    font-size: 11px;
  }

  .aura-industries .aui-healthcare-outcome {
    position: static;
    max-width: 100%;
    width: fit-content;
    align-self: center;
    padding: 12px 17px;
    font-size: 10px;
    text-align: center;
  }

  .aura-industries .aui-healthcare-outcome::before {
    display: none;
  }

  .aura-industries .aui-footer {
    margin-top: 25px;
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .aura-industries {
    padding: 30px 16px 24px;
  }

  .aura-industries .aui-eyebrow {
    font-size: 10px;
    letter-spacing: 1.7px;
  }

  .aura-industries h2 {
    font-size: 31px;
    letter-spacing: -1px;
  }

  .aura-industries .aui-intro {
    font-size: 14px;
    line-height: 1.65;
  }

  .aura-industries .aui-industries {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .aura-industries .aui-industry:last-child {
    grid-column: 1 / -1;
  }

  .aura-industries .aui-workflows {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 23px 10px;
  }

  .aura-industries .aui-healthcare-outcome {
    font-size: 9px;
    border-radius: 14px;
  }
}

.aura-summary {
  --asum-ink: #082e26;
  --asum-muted: #66786d;
  --asum-green: #0acd83;

  padding: 35px 28px 28px;
  background: #fff;
  color: var(--asum-ink);
  font-family: "Inter", sans-serif;
}

.aura-summary,
.aura-summary * {
  box-sizing: border-box;
}

.aura-summary .asum-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.aura-summary .asum-container {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
}

/* Heading */
.aura-summary .asum-header {
  text-align: center;
  margin-bottom: 26px;
}

.aura-summary .asum-eyebrow {
  margin: 0 0 10px;
  color: #18ac70;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.aura-summary h2 {
  margin: 0;
  font-size: clamp(30px, 3vw, 46px);
  line-height: 1.15;
  font-weight: 750;
  letter-spacing: -1.4px;
}

.aura-summary .asum-header>p:last-child {
  margin: 9px 0 0;
  color: var(--asum-muted);
  font-size: clamp(15px, 1.3vw, 19px);
  line-height: 1.5;
}

/* Seven aligned desktop columns */
.aura-summary .asum-diagram {
  display: grid;
  grid-template-columns:
    52px minmax(0, 1.3fr) minmax(70px, .75fr) 186px minmax(70px, .75fr) minmax(0, 1.3fr) 52px;
  column-gap: 13px;
  align-items: stretch;
}

.aura-summary .asum-side-label {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 520px;
  border-radius: 14px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}

.aura-summary .asum-feature-label {
  color: #fff;
  background: #06392d;
  transform: rotate(180deg);
}

.aura-summary .asum-benefit-label {
  color: #194f3b;
  background: #e4f9ee;
}

/* Lists */
.aura-summary .asum-features,
.aura-summary .asum-benefits {
  display: grid;
  margin: 0;
  padding: 0 0 0 12px;
  list-style: none;
  min-width: 0;
}

.aura-summary .asum-features {
  grid-template-rows: repeat(8, minmax(0, 1fr));
  gap: 8px;
}

.aura-summary .asum-benefits {
  grid-template-rows: repeat(6, minmax(0, 1fr));
  gap: 14px;
  padding-left: 7px;
}

.aura-summary .asum-features li,
.aura-summary .asum-benefits li {
  display: flex;
  align-items: center;
  gap: 15px;
  min-width: 0;
  color: #3d5046;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: -.15px;
}

.aura-summary .asum-icon,
.aura-summary .asum-check {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 50%;
  background: #e8fbf1;
  color: #0bbb76;
}

.aura-summary .asum-icon svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-summary .asum-check {
  font-size: 31px;
  font-weight: 700;
  line-height: 1;
}

/* Connecting paths */
.aura-summary .asum-links {
  display: block;
  width: 100%;
  height: 520px;
}

/* Central engine */
.aura-summary .asum-engine {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 28px 12px 15px;
  border: 1px solid #277959;
  border-radius: 15px;
  color: #fff;
  background:
    radial-gradient(ellipse at 50% 55%, #08794690, transparent 58%),
    linear-gradient(145deg, #064c37, #03533a);
  overflow: hidden;
}

.aura-summary .asum-engine h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
}

.aura-summary .asum-engine>p {
  margin: 14px 0 0;
  color: #b6e0c8;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1.5px;
  line-height: 1.6;
  text-align: center;
  text-transform: uppercase;
}

.aura-summary .asum-wave {
  display: block;
  width: 100%;
  flex: 1;
  min-height: 0;
  margin-top: 16px;
}

/* Detailed copy */
.aura-summary .asum-copy {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 60px;
  margin-top: 30px;
}

.aura-summary .asum-copy p {
  margin: 0;
  color: #6d7b72;
  font-size: 13px;
  line-height: 1.7;
}

.aura-summary .asum-copy p+p {
  padding-left: 40px;
  border-left: 1px solid #dce9e1;
}

.aura-summary .asum-copy strong {
  color: #285c43;
  font-weight: 700;
}

/* Bottom statement */
.aura-summary .asum-footer {
  display: grid;
  grid-template-columns: 1fr auto minmax(100px, 1.2fr) auto 1fr;
  align-items: center;
  gap: 20px;
  margin-top: 33px;
}

.aura-summary .asum-footer strong {
  color: #345143;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  line-height: 1.5;
  text-align: center;
  text-transform: uppercase;
}

.aura-summary .asum-footer-line {
  height: 1px;
  background: #cbd6cf;
}

.aura-summary .asum-footer-arrow {
  display: flex;
  align-items: center;
  gap: 13px;
  color: #09ce80;
  font-size: 35px;
  line-height: 1;
}

.aura-summary .asum-footer-arrow::before,
.aura-summary .asum-footer-arrow::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #09ce80;
}

/* Laptop */
@media (max-width: 1200px) {
  .aura-summary .asum-diagram {
    grid-template-columns:
      40px minmax(0, 1.3fr) minmax(35px, .4fr) 155px minmax(35px, .4fr) minmax(0, 1.3fr) 40px;
    column-gap: 9px;
  }

  .aura-summary .asum-features,
  .aura-summary .asum-benefits {
    padding-left: 5px;
  }

  .aura-summary .asum-features li,
  .aura-summary .asum-benefits li {
    font-size: 12px;
    gap: 10px;
  }

  .aura-summary .asum-icon,
  .aura-summary .asum-check {
    width: 39px;
    height: 39px;
    flex-basis: 39px;
  }

  .aura-summary .asum-icon svg {
    width: 22px;
    height: 22px;
  }

  .aura-summary .asum-check {
    font-size: 26px;
  }

  .aura-summary .asum-engine h3 {
    font-size: 17px;
  }

  .aura-summary .asum-engine>p {
    font-size: 8px;
  }

  .aura-summary .asum-copy {
    gap: 30px;
  }

  .aura-summary .asum-copy p+p {
    padding-left: 25px;
  }
}

/* Tablet: centre engine above two readable columns */
@media (max-width: 900px) {
  .aura-summary {
    padding: 34px 22px 28px;
  }

  .aura-summary .asum-diagram {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px 24px;
  }

  .aura-summary .asum-engine {
    grid-column: 1 / -1;
    grid-row: 1;
    min-height: 180px;
    padding: 22px;
  }

  .aura-summary .asum-wave {
    width: 160px;
    height: 95px;
    flex: none;
    margin-top: 10px;
  }

  .aura-summary .asum-engine h3 {
    font-size: 22px;
  }

  .aura-summary .asum-engine>p {
    font-size: 10px;
    margin-top: 8px;
  }

  .aura-summary .asum-engine>p br {
    display: none;
  }

  .aura-summary .asum-links {
    display: none;
  }

  .aura-summary .asum-side-label {
    min-height: 0;
    padding: 13px;
    writing-mode: horizontal-tb;
    transform: none;
    font-size: 12px;
    letter-spacing: 2px;
    border-radius: 10px;
  }

  .aura-summary .asum-feature-label {
    grid-column: 1;
    grid-row: 2;
  }

  .aura-summary .asum-benefit-label {
    grid-column: 2;
    grid-row: 2;
  }

  .aura-summary .asum-features {
    grid-column: 1;
    grid-row: 3;
    gap: 16px;
  }

  .aura-summary .asum-benefits {
    grid-column: 2;
    grid-row: 3;
    gap: 22px;
  }

  .aura-summary .asum-features li,
  .aura-summary .asum-benefits li {
    font-size: 13px;
  }

  .aura-summary .asum-copy {
    gap: 24px;
    margin-top: 27px;
  }

  .aura-summary .asum-copy p {
    font-size: 12px;
  }

  .aura-summary .asum-copy p+p {
    padding-left: 0;
    border: 0;
  }

  .aura-summary .asum-footer {
    grid-template-columns: 1fr 80px 1fr;
    gap: 15px;
  }

  .aura-summary .asum-footer-line {
    display: none;
  }

  .aura-summary .asum-footer strong {
    font-size: 9px;
    letter-spacing: 1.2px;
  }
}

/* Mobile */
@media (max-width: 550px) {
  .aura-summary {
    padding: 30px 16px 25px;
  }

  .aura-summary .asum-eyebrow {
    font-size: 9px;
    letter-spacing: 1.4px;
  }

  .aura-summary h2 {
    font-size: 31px;
    letter-spacing: -1px;
  }

  .aura-summary .asum-header>p:last-child {
    font-size: 15px;
  }

  .aura-summary .asum-diagram {
    display: flex;
    flex-direction: column;
    gap: 17px;
  }

  .aura-summary .asum-engine {
    order: 0;
  }

  .aura-summary .asum-feature-label {
    order: 1;
  }

  .aura-summary .asum-features {
    order: 2;
  }

  .aura-summary .asum-benefit-label {
    order: 3;
    margin-top: 10px;
  }

  .aura-summary .asum-benefits {
    order: 4;
  }

  .aura-summary .asum-features,
  .aura-summary .asum-benefits {
    gap: 17px;
    padding: 0;
    grid-template-rows: none;
  }

  .aura-summary .asum-features li,
  .aura-summary .asum-benefits li {
    font-size: 14px;
    gap: 13px;
  }

  .aura-summary .asum-copy {
    grid-template-columns: 1fr;
    gap: 18px;
    padding-top: 22px;
    border-top: 1px solid #e1ece6;
  }

  .aura-summary .asum-footer {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 25px;
  }

  .aura-summary .asum-footer-arrow {
    width: 65px;
    margin: auto;
    transform: rotate(90deg);
  }

  .aura-summary .asum-footer strong {
    font-size: 10px;
    letter-spacing: 1.4px;
  }
}

.aura-reliability {
  --ar-ink: #092e27;
  --ar-muted: #718078;
  --ar-green: #09c983;
  --ar-border: #dfece5;

  padding: 38px 28px 28px;
  background: #fff;
  color: var(--ar-ink);
  font-family: "Inter", sans-serif;
}

.aura-reliability,
.aura-reliability * {
  box-sizing: border-box;
}

.aura-reliability .ar-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.aura-reliability .ar-container {
  width: 100%;
  max-width: 1300px;
  margin: auto;
}

.aura-reliability .ar-header {
  text-align: center;
}

.aura-reliability .ar-eyebrow {
  margin: 0 0 15px;
  color: #11b879;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.aura-reliability h2 {
  margin: 0;
  font-size: clamp(30px, 3.2vw, 49px);
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -1.6px;
  text-wrap: balance;
}

/* Two introductory columns */
.aura-reliability .ar-overview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 65px;
  max-width: 1320px;
  margin: 22px auto 0;
}

.aura-reliability .ar-overview p {
  margin: 0;
  color: var(--ar-muted);
  font-size: 16px;
  line-height: 1.6;
}

/* Progression */
.aura-reliability .ar-growth {
  display: grid;
  grid-template-columns: auto minmax(45px, 1fr) auto minmax(45px, 1fr) auto;
  align-items: center;
  gap: 24px;
  margin: 31px 4% 35px;
}

.aura-reliability .ar-growth-stage {
  display: flex;
  align-items: center;
  gap: 22px;
}

.aura-reliability .ar-building-icon {
  display: block;
  width: 57px;
  height: 57px;
  flex: 0 0 57px;
  fill: none;
  stroke: #356452;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-reliability .ar-growth-stage h3 {
  margin: 0 0 8px;
  color: #426152;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.aura-reliability .ar-growth-stage p {
  margin: 8px 0 0;
  color: #8b978f;
  font-size: 11px;
  line-height: 1.4;
}

.aura-reliability .ar-daily-dots {
  display: flex;
  align-items: center;
  gap: 19px;
  height: 25px;
}

.aura-reliability .ar-daily-dots i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #14bd79;
}

.aura-reliability .ar-volume-waves {
  display: flex;
  align-items: center;
  gap: 19px;
  height: 25px;
  color: #19b989;
}

.aura-reliability .ar-volume-waves svg {
  width: 31px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
}

.aura-reliability .ar-volume-enterprise {
  gap: 12px;
  color: #229caa;
}

.aura-reliability .ar-growth-arrow {
  position: relative;
  height: 1px;
  background: #a4ebc7;
}

.aura-reliability .ar-growth-arrow::after {
  content: "";
  position: absolute;
  right: 1px;
  top: -4px;
  width: 9px;
  height: 9px;
  border-top: 1.5px solid #1bc581;
  border-right: 1.5px solid #1bc581;
  transform: rotate(45deg);
}

/* Secure perimeter */
.aura-reliability .ar-security {
  position: relative;
  padding: 18px 20px 8px;
  border: 1px solid #72c5a4;
  border-radius: 40px;
  background: linear-gradient(135deg, #fbfefc, #f7fcfb);
}

.aura-reliability .ar-security-title {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 18px;
  background: #fff;
  white-space: nowrap;
}

.aura-reliability .ar-security-title>span {
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  border-radius: 50%;
  color: #064b31;
  background: #13de91;
}

.aura-reliability .ar-security-title svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.aura-reliability .ar-security-title h3 {
  margin: 0;
  color: #365e4a;
  font-size: 11px;
  letter-spacing: 1.7px;
  text-transform: uppercase;
}

.aura-reliability .ar-security-points {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

.aura-reliability .ar-security-points li {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 3px 12px;
  color: #426555;
  font-size: 12px;
  line-height: 1.4;
}

.aura-reliability .ar-security-points li+li {
  border-left: 1px solid #c7e8d8;
}

.aura-reliability .ar-security-points li>span {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  border-radius: 50%;
  background: #0ab87a;
  color: #fff;
  font-size: 17px;
}

/* Cloud illustration */
.aura-reliability .ar-cloud {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 1.35fr) minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  min-height: 126px;
  padding: 12px 45px;
  border-radius: 65px;
  background: linear-gradient(110deg, #07382d, #063e32 55%, #082f2a);
}

.aura-reliability .ar-cloud-center {
  text-align: center;
}

.aura-reliability .ar-cloud-center h3 {
  margin: 0;
  color: #e7f6ed;
  font-size: 19px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
}

.aura-reliability .ar-cloud-center>strong {
  display: block;
  margin-top: 7px;
  color: #0be391;
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
}

.aura-reliability .ar-capacity-signal {
  width: 100%;
  height: 29px;
  display: block;
  margin-top: 4px;
}

.aura-reliability .ar-cloud-center p {
  margin: 5px 0 0;
  color: #b7d9c9;
  font-size: 9px;
  line-height: 1.5;
}

.aura-reliability .ar-server-group {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.aura-reliability .ar-server-group>div {
  display: grid;
  gap: 3px;
  flex: 1;
  min-width: 0;
}

.aura-reliability .ar-server-group svg {
  display: block;
  width: 100%;
  height: auto;
  fill: #ffffff04;
  stroke: #709e8c;
  stroke-width: 1;
}

.aura-reliability .ar-server-group svg use {
  color: #69e6ae;
}

.aura-reliability .ar-server-large {
  gap: 9px;
}

/* Technology foundation */
.aura-reliability .ar-foundation {
  display: grid;
  grid-template-columns: 1.1fr 1.15fr .95fr 1.25fr;
  align-items: center;
  gap: 0;
  margin-top: 33px;
  padding: 17px 20px;
  border-radius: 15px;
  background: #07372c;
  color: #e5f2ea;
}

.aura-reliability .ar-foundation-item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  min-height: 39px;
  padding: 0 18px;
}

.aura-reliability .ar-foundation-item+.ar-foundation-item {
  border-left: 1px solid #608577;
}

.aura-reliability .ar-foundation-item>svg {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-reliability .ar-foundation-item strong {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
}

.aura-reliability .ar-aws-mark {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 47px;
  flex: 0 0 47px;
  font-size: 25px;
  line-height: .9;
  letter-spacing: -1px;
}

.aura-reliability .ar-aws-mark svg {
  width: 47px;
  height: 12px;
  margin-top: 3px;
}

.aura-reliability .ar-engineered span {
  display: block;
  margin-top: 4px;
  color: #b9d3c5;
  font-size: 9px;
  letter-spacing: .6px;
  line-height: 1.5;
}

.aura-reliability .ar-foundation-copy {
  max-width: 1300px;
  margin: 13px auto 0;
  text-align: center;
  color: #7a897f;
  font-size: 14px;
  line-height: 1.65;
}

/* Bottom assurance strip */
.aura-reliability .ar-footer {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 14px;
  padding: 17px 12px;
  border-radius: 13px;
  background: #f0faf5;
}

.aura-reliability .ar-footer>div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 19px;
  padding: 0 12px;
}

.aura-reliability .ar-footer>div+div {
  border-left: 1px solid #d6e9df;
}

.aura-reliability .ar-footer svg {
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  fill: none;
  stroke: #27865c;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-reliability .ar-footer strong {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.aura-reliability .ar-footer>div:nth-child(2) {
  color: #77608f;
}

.aura-reliability .ar-footer>div:nth-child(2) svg {
  stroke: #9474b5;
}

.aura-reliability .ar-footer>div:nth-child(3) {
  color: #367d87;
}

.aura-reliability .ar-footer>div:nth-child(3) svg {
  stroke: #3696a3;
}

/* Laptop */
@media (max-width: 1150px) {
  .aura-reliability .ar-overview {
    gap: 35px;
  }

  .aura-reliability .ar-growth {
    margin-inline: 0;
    gap: 17px;
  }

  .aura-reliability .ar-growth-stage {
    gap: 12px;
  }

  .aura-reliability .ar-growth-stage h3 {
    font-size: 9px;
    letter-spacing: .8px;
  }

  .aura-reliability .ar-volume-waves {
    gap: 10px;
  }

  .aura-reliability .ar-volume-enterprise svg {
    width: 25px;
  }

  .aura-reliability .ar-cloud {
    grid-template-columns: minmax(0, 1fr) 310px minmax(0, 1fr);
    padding-inline: 30px;
  }

  .aura-reliability .ar-server-group {
    gap: 5px;
  }

  .aura-reliability .ar-foundation-item {
    padding-inline: 12px;
    gap: 10px;
  }

  .aura-reliability .ar-foundation-item strong {
    font-size: 10px;
  }

  .aura-reliability .ar-footer>div {
    gap: 12px;
  }

  .aura-reliability .ar-footer strong {
    font-size: 9px;
    letter-spacing: 1px;
  }
}

/* Tablet */
@media (max-width: 850px) {
  .aura-reliability {
    padding: 34px 22px 26px;
  }

  .aura-reliability .ar-overview {
    gap: 24px;
  }

  .aura-reliability .ar-overview p {
    font-size: 14px;
  }

  .aura-reliability .ar-growth {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
  }

  .aura-reliability .ar-growth-arrow {
    display: none;
  }

  .aura-reliability .ar-growth-stage {
    flex-direction: column;
    text-align: center;
    gap: 12px;
  }

  .aura-reliability .ar-daily-dots,
  .aura-reliability .ar-volume-waves {
    justify-content: center;
  }

  .aura-reliability .ar-volume-enterprise {
    gap: 5px;
  }

  .aura-reliability .ar-volume-enterprise svg {
    width: 23px;
  }

  .aura-reliability .ar-security {
    padding: 24px 15px 15px;
    border-radius: 25px;
  }

  .aura-reliability .ar-security-points {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 20px;
  }

  .aura-reliability .ar-security-points li {
    justify-content: flex-start;
    font-size: 11px;
  }

  .aura-reliability .ar-security-points li+li {
    border: 0;
  }

  .aura-reliability .ar-cloud {
    grid-template-columns: 1fr;
    padding: 23px;
    border-radius: 25px;
  }

  .aura-reliability .ar-cloud-center {
    grid-row: 1;
  }

  .aura-reliability .ar-server-small {
    display: none;
  }

  .aura-reliability .ar-server-large {
    max-width: 380px;
    width: 100%;
    margin: auto;
    gap: 15px;
  }

  .aura-reliability .ar-cloud-center h3 {
    font-size: 21px;
  }

  .aura-reliability .ar-cloud-center p {
    font-size: 11px;
  }

  .aura-reliability .ar-foundation {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 0;
    margin-top: 25px;
  }

  .aura-reliability .ar-foundation-item {
    justify-content: flex-start;
  }

  .aura-reliability .ar-foundation-item:nth-child(3) {
    border-left: 0;
  }

  .aura-reliability .ar-foundation-item strong {
    font-size: 11px;
  }

  .aura-reliability .ar-footer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 0;
  }

  .aura-reliability .ar-footer>div {
    justify-content: flex-start;
  }

  .aura-reliability .ar-footer>div:nth-child(3) {
    border-left: 0;
  }
}

/* Mobile */
@media (max-width: 520px) {
  .aura-reliability {
    padding: 30px 16px 24px;
  }

  .aura-reliability .ar-eyebrow {
    font-size: 9px;
    letter-spacing: 1.3px;
  }

  .aura-reliability h2 {
    font-size: 31px;
    letter-spacing: -1px;
  }

  .aura-reliability .ar-overview {
    grid-template-columns: 1fr;
    gap: 17px;
    margin-top: 18px;
  }

  .aura-reliability .ar-growth {
    grid-template-columns: 1fr;
    gap: 22px;
    margin-block: 25px 35px;
  }

  .aura-reliability .ar-growth-stage {
    flex-direction: row;
    text-align: left;
    gap: 20px;
  }

  .aura-reliability .ar-growth-stage h3 {
    font-size: 10px;
  }

  .aura-reliability .ar-daily-dots,
  .aura-reliability .ar-volume-waves {
    justify-content: flex-start;
  }

  .aura-reliability .ar-security-title {
    padding-inline: 10px;
  }

  .aura-reliability .ar-security-title h3 {
    font-size: 10px;
    letter-spacing: 1px;
  }

  .aura-reliability .ar-security-points {
    gap: 14px 8px;
  }

  .aura-reliability .ar-security-points li {
    padding: 0;
    gap: 7px;
    font-size: 10px;
  }

  .aura-reliability .ar-security-points li>span {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
    font-size: 14px;
  }

  .aura-reliability .ar-cloud {
    padding: 22px 14px;
  }

  .aura-reliability .ar-cloud-center h3 {
    font-size: 17px;
    letter-spacing: 2px;
  }

  .aura-reliability .ar-cloud-center>strong {
    font-size: 9px;
    letter-spacing: 1.7px;
  }

  .aura-reliability .ar-server-large {
    gap: 8px;
  }

  .aura-reliability .ar-foundation {
    grid-template-columns: 1fr;
    gap: 0;
    padding: 7px 18px;
  }

  .aura-reliability .ar-foundation-item {
    min-height: 66px;
    padding: 14px 0;
    gap: 17px;
  }

  .aura-reliability .ar-foundation-item+.ar-foundation-item {
    border-left: 0;
    border-top: 1px solid #426958;
  }

  .aura-reliability .ar-foundation-copy {
    font-size: 12px;
  }

  .aura-reliability .ar-footer {
    padding: 17px 10px;
    gap: 18px 10px;
  }

  .aura-reliability .ar-footer>div,
  .aura-reliability .ar-footer>div+div {
    padding: 0;
    border: 0;
    gap: 9px;
  }

  .aura-reliability .ar-footer svg {
    width: 24px;
    height: 24px;
    flex-basis: 24px;
  }

  .aura-reliability .ar-footer strong {
    font-size: 8px;
    letter-spacing: .7px;
  }
}

/* Agent Aura reliability — reference layout correction */

.aura-reliability {
  padding: 32px 28px 26px;
}

.aura-reliability .ar-container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
}

.aura-reliability .ar-header {
  display: block;
  text-align: center;
  margin: 0 0 32px;
  padding: 0;
}

.aura-reliability .ar-eyebrow {
  margin: 0 0 15px;
  font-size: 13px;
  letter-spacing: 1.8px;
}

.aura-reliability h2 {
  margin: 0 auto;
  width: 100%;
  font-size: clamp(24px, 2.9vw, 42px);
  line-height: 1.12;
  letter-spacing: -0.03em;
}

.aura-reliability .ar-overview {
  max-width: 1320px;
  margin: 22px auto 0;
  gap: 65px;
}

.aura-reliability .ar-overview p {
  margin: 0;
  font-size: 16px;
  line-height: 1.45;
}

/* Compact scale progression */
.aura-reliability .ar-growth {
  margin: 28px 4% 35px;
  gap: 22px;
}

.aura-reliability .ar-building-icon {
  width: 55px;
  height: 55px;
  flex-basis: 55px;
}

.aura-reliability .ar-growth-stage {
  gap: 20px;
}

.aura-reliability .ar-growth-stage h3 {
  margin: 0 0 7px;
}

.aura-reliability .ar-growth-stage p {
  margin-top: 6px;
}

/* Secure perimeter */
.aura-reliability .ar-security {
  position: relative;
  height: auto;
  min-height: 0;
  padding: 18px 18px 8px;
  border: 1.2px solid #71c4a0;
  border-radius: 42px;
  background: #fff;
}

.aura-reliability .ar-security-title {
  z-index: 3;
}

.aura-reliability .ar-security-points {
  margin: 0 0 14px;
  min-height: 30px;
  align-items: center;
}

/* Short cloud, matching the reference proportions */
.aura-reliability .ar-cloud {
  position: relative;
  isolation: isolate;

  display: grid;
  grid-template-columns:
    minmax(0, 1fr) minmax(320px, 1.45fr) minmax(0, 1.15fr);

  align-items: center;
  gap: 18px;

  width: calc(100% - 54px);
  height: 126px;
  min-height: 126px;
  max-height: 126px;
  margin: 0 auto;

  padding: 10px 24px;
  border-radius: 50px;

  background: linear-gradient(110deg,
      #07382d 0%,
      #073d30 50%,
      #062f28 100%);

  overflow: visible;
}

/* Cloud end lobes */
.aura-reliability .ar-cloud::before,
.aura-reliability .ar-cloud::after {
  content: "";
  position: absolute;
  top: 32px;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  z-index: -1;
}

.aura-reliability .ar-cloud::before {
  left: -27px;
  background: #07382d;
}

.aura-reliability .ar-cloud::after {
  right: -27px;
  background: #062f28;
}

/*
  Explicit SVG heights prevent the server illustrations
  from creating oversized rows.
*/
.aura-reliability .ar-server-group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  height: 72px;
  min-height: 0;
  max-height: 72px;
  margin: 0;

  align-self: center;
}

.aura-reliability .ar-server-group>div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;

  flex: 1 1 0;
  min-width: 0;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
}

.aura-reliability .ar-server-group svg {
  display: block;

  width: 100%;
  height: 17px;
  min-height: 17px;
  max-height: 17px;

  flex: 0 0 17px;
  margin: 0;
  padding: 0;

  fill: #ffffff05;
  stroke: #719889;
  stroke-width: 1;

  overflow: visible;
}

.aura-reliability .ar-server-large {
  gap: 11px;
}

/* Central cloud content */
.aura-reliability .ar-cloud-center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  min-width: 0;
  height: 106px;
  margin: 0;
  padding: 0;
  text-align: center;
}

.aura-reliability .ar-cloud-center h3 {
  margin: 0;
  color: #eef9f1;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 2.8px;
}

.aura-reliability .ar-cloud-center>strong {
  margin-top: 6px;
  color: #09dc86;
  font-size: 11px;
  line-height: 1.3;
  letter-spacing: 2.4px;
}

.aura-reliability .ar-capacity-signal {
  display: block;
  width: 100%;
  height: 30px;
  min-height: 30px;
  max-height: 30px;
  flex: 0 0 30px;
  margin: 3px 0 0;
}

.aura-reliability .ar-cloud-center p {
  margin: 4px 0 0;
  color: #bfd8ca;
  font-size: 10px;
  line-height: 1.35;
}

/* Technology strip with the subtle connection wash */
.aura-reliability .ar-foundation {
  position: relative;
  isolation: isolate;

  min-height: 72px;
  margin-top: 33px;
  padding: 15px 20px;
  border-radius: 14px;
}

.aura-reliability .ar-foundation::before {
  content: "";
  position: absolute;
  left: 3%;
  right: 3%;
  top: -32px;
  height: 32px;

  background: linear-gradient(90deg,
      #edf9f3,
      #cceee0,
      #edf9f3);

  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  z-index: -1;
  pointer-events: none;
}

.aura-reliability .ar-foundation-item {
  min-height: 40px;
}

.aura-reliability .ar-foundation-copy {
  max-width: 1300px;
  margin-top: 12px;
  font-size: 14px;
  line-height: 1.5;
}

.aura-reliability .ar-footer {
  margin-top: 13px;
  padding: 17px 12px;
}

/* Laptop */
@media (max-width: 1150px) {
  .aura-reliability .ar-overview {
    gap: 35px;
  }

  .aura-reliability .ar-growth {
    margin-inline: 0;
    gap: 17px;
  }

  .aura-reliability .ar-growth-stage {
    gap: 12px;
  }

  .aura-reliability .ar-cloud {
    grid-template-columns:
      minmax(0, 1fr) 310px minmax(0, 1.1fr);
    gap: 12px;
    padding-inline: 15px;
  }

  .aura-reliability .ar-server-group {
    gap: 6px;
  }

  .aura-reliability .ar-cloud-center h3 {
    font-size: 18px;
    letter-spacing: 2px;
  }

  .aura-reliability .ar-cloud-center p {
    font-size: 9px;
  }
}

/* Tablet */
@media (max-width: 850px) {
  .aura-reliability {
    padding: 34px 22px 26px;
  }

  .aura-reliability .ar-overview {
    gap: 24px;
  }

  .aura-reliability .ar-overview p {
    font-size: 14px;
    line-height: 1.6;
  }

  .aura-reliability .ar-growth {
    margin: 26px 0 34px;
  }

  .aura-reliability .ar-growth-stage {
    gap: 12px;
  }

  .aura-reliability .ar-security {
    padding: 24px 15px 15px;
    border-radius: 25px;
  }

  .aura-reliability .ar-security-points {
    margin-bottom: 20px;
  }

  .aura-reliability .ar-cloud {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;

    width: 100%;
    height: auto;
    min-height: 190px;
    max-height: none;
    padding: 20px;
    border-radius: 25px;
  }

  .aura-reliability .ar-cloud::before,
  .aura-reliability .ar-cloud::after {
    display: none;
  }

  .aura-reliability .ar-cloud-center {
    height: auto;
    width: 100%;
  }

  .aura-reliability .ar-cloud-center h3 {
    font-size: 20px;
  }

  .aura-reliability .ar-capacity-signal {
    max-width: 420px;
  }

  .aura-reliability .ar-server-small {
    display: none;
  }

  .aura-reliability .ar-server-large {
    width: 100%;
    max-width: 370px;
    height: 59px;
    max-height: 59px;
    gap: 12px;
  }

  .aura-reliability .ar-server-group svg {
    height: 15px;
    min-height: 15px;
    max-height: 15px;
    flex-basis: 15px;
  }

  .aura-reliability .ar-foundation {
    margin-top: 25px;
  }

  .aura-reliability .ar-foundation::before {
    top: -24px;
    height: 24px;
  }
}

/* Mobile */
@media (max-width: 520px) {
  .aura-reliability {
    padding: 30px 16px 24px;
  }

  .aura-reliability h2 {
    font-size: 31px;
    letter-spacing: -1px;
  }

  .aura-reliability .ar-overview {
    grid-template-columns: 1fr;
    gap: 17px;
    margin-top: 18px;
  }

  .aura-reliability .ar-growth {
    margin: 25px 0 35px;
  }

  .aura-reliability .ar-growth-stage {
    gap: 20px;
  }

  .aura-reliability .ar-cloud {
    padding: 20px 14px;
    min-height: 180px;
  }

  .aura-reliability .ar-cloud-center h3 {
    font-size: 17px;
    letter-spacing: 1.8px;
  }

  .aura-reliability .ar-cloud-center>strong {
    font-size: 9px;
    letter-spacing: 1.5px;
  }

  .aura-reliability .ar-cloud-center p {
    max-width: 280px;
    font-size: 9px;
    line-height: 1.5;
  }

  .aura-reliability .ar-server-large {
    gap: 7px;
  }

  .aura-reliability .ar-foundation {
    padding: 7px 18px;
  }

  .aura-reliability .ar-foundation-item {
    min-height: 66px;
  }

  .aura-reliability .ar-foundation-copy {
    font-size: 12px;
    line-height: 1.6;
  }

  .aura-reliability .ar-footer {
    padding: 17px 10px;
  }
}

/* Uses your website font; Inter works well with this design. */
.aura-svg-library {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
  pointer-events: none;
}

.aura-compare {
  --aura-accent: #08ce82;
  --aura-accent-dark: #069f64;
  --aura-accent-light: #e5fbf1;

  --aura-slate: #83978d;
  --aura-slate-dark: #556c62;
  --aura-slate-light: #eff5f2;

  --aura-heading: #082c24;
  --aura-text: #60786d;
  --aura-divider: #dcece7;

  --aura-icon-size: clamp(58px, 5vw, 82px);

  padding: 48px 24px 32px;
  background:
    radial-gradient(ellipse at 50% 42%,
      rgba(8, 206, 130, 0.035),
      transparent 65%),
    #ffffff;

  color: var(--aura-text);
  font-family: "Inter", sans-serif;
}

.aura-compare *,
.aura-compare *::before,
.aura-compare *::after {
  box-sizing: border-box;
}

.aura-compare__container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
}

.aura-compare__header {
  margin-bottom: 44px;
  text-align: center;
}

.aura-compare__eyebrow {
  margin: 0 0 26px;
  color: var(--aura-accent);
  font-size: clamp(13px, 1.45vw, 23px);
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.aura-compare__header h2 {
  margin: 0;
  color: var(--aura-heading);
  font-size: clamp(28px, 3.25vw, 53px);
  font-weight: 750;
  line-height: 1.18;
  letter-spacing: -0.045em;
  text-wrap: balance;
}

.aura-compare__subtitle {
  margin: 18px 0 0;
  color: #79818c;
  font-size: clamp(16px, 1.8vw, 28px);
  line-height: 1.5;
}

.aura-compare__scroll {
  overflow-x: auto;
  padding-bottom: 24px;
  scrollbar-width: thin;
  scrollbar-color: #cfc1ed #f5f2fa;
}

.aura-compare__scroll:focus-visible {
  outline: 2px solid var(--aura-accent);
  outline-offset: 6px;
  border-radius: 8px;
}

.aura-flow {
  display: grid;
  grid-template-columns: 165px minmax(0, 1fr);
  min-width: 1100px;
}

/* Source column */
.aura-flow__source {
  position: relative;
}

.aura-flow__source-content {
  position: absolute;
  z-index: 2;
  top: 156px;
  left: 0;

  display: flex;
  width: 118px;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.aura-flow__phone {
  display: grid;
  width: 112px;
  height: 112px;
  place-items: center;

  border-radius: 50%;
  background: linear-gradient(145deg, #09cf86, #04764b);
  color: #ffffff;
}

.aura-flow__phone svg {
  width: 58px;
  height: 58px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-flow__source-content strong {
  margin-top: 12px;
  color: var(--aura-heading);
  font-size: 17px;
  line-height: 1.25;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}

.aura-flow__branch {
  position: absolute;
  top: calc(54px + var(--aura-icon-size) / 2 - 20px);
  left: 105px;
  width: 60px;
  height: 324px;
  overflow: visible;
}

.aura-flow__branch path {
  fill: none;
  stroke-width: 7;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
}

.aura-flow__branch-top {
  stroke: var(--aura-accent);
}

.aura-flow__branch-bottom {
  stroke: var(--aura-slate);
}

/* Main comparison */
.aura-flow__comparison {
  min-width: 0;
}

.aura-flow__system {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 5px;
  text-transform: uppercase;
}

.aura-flow__system strong {
  color: var(--aura-heading);
  font-size: 21px;
  font-weight: 750;
  line-height: 1.15;
}

.aura-flow__system span {
  margin-top: 5px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
}

.aura-flow__system--ai {
  height: 54px;
}

.aura-flow__system--ai span {
  color: var(--aura-accent);
}

.aura-flow__system--traditional {
  margin-top: 18px;
}

.aura-flow__system--traditional span {
  color: var(--aura-slate);
}

/* Identical grid used for both rows and centre labels */
.aura-flow__row,
.aura-flow__labels {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.aura-flow__row {
  position: relative;
  height: 146px;
  isolation: isolate;
}

/* Connector passes through the centre of every icon */
.aura-flow__row::before {
  position: absolute;
  z-index: -1;
  top: calc(var(--aura-icon-size) / 2 - 4px);
  right: 6.25%;
  left: 0;
  height: 8px;
  background: var(--aura-row-color);
  content: "";
}

/* Arrow immediately before the result */
.aura-flow__row::after {
  position: absolute;
  z-index: -1;
  top: calc(var(--aura-icon-size) / 2 - 12px);
  right: calc(6.25% + var(--aura-icon-size) / 2 + 5px);

  width: 0;
  height: 0;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-left: 19px solid var(--aura-row-color);
  content: "";
}

.aura-flow__row--ai {
  --aura-row-color: var(--aura-accent);
}

.aura-flow__row--traditional {
  --aura-row-color: var(--aura-slate);
}

.aura-flow__item {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  padding-inline: 5px;
  text-align: center;
}

.aura-flow__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--aura-icon-size);
  height: var(--aura-icon-size);
  min-height: var(--aura-icon-size);
  max-height: var(--aura-icon-size);
  flex: 0 0 auto;
  border-radius: 50%;
}

.aura-flow__row--ai .aura-flow__icon {
  background: var(--aura-accent-light);
  color: var(--aura-accent-dark);
}

.aura-flow__row--traditional .aura-flow__icon {
  background: var(--aura-slate-light);
  color: var(--aura-slate-dark);
}

.aura-flow__icon svg {
  width: 46%;
  height: 46%;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.aura-flow__icon--solid svg {
  fill: currentColor;
  stroke-width: 1;
}

.aura-flow__item p {
  margin: 10px 0 0;
  font-size: clamp(13px, 1.08vw, 18px);
  font-weight: 450;
  line-height: 1.4;
}

.aura-flow__row--ai .aura-flow__result .aura-flow__icon {
  background: var(--aura-accent);
  color: #ffffff;
}

.aura-flow__row--traditional .aura-flow__result .aura-flow__icon {
  border: 3px solid var(--aura-slate);
  background: #ffffff;
}

.aura-flow__result p {
  font-size: clamp(12px, 1.05vw, 17px);
  font-weight: 750;
  line-height: 1.35;
  text-transform: uppercase;
}

.aura-flow__row--ai .aura-flow__result p {
  color: var(--aura-accent);
}

.aura-flow__row--traditional .aura-flow__result p {
  color: var(--aura-slate-dark);
}

/* Centre label band */
.aura-flow__labels {
  height: 138px;
  align-items: center;
}

.aura-flow__labels span {
  display: flex;
  min-height: 80px;
  align-items: center;
  justify-content: center;
  padding: 10px 8px;

  color: #5b6573;
  font-size: clamp(13px, 1.08vw, 18px);
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
}

.aura-flow__labels span:nth-child(-n + 6) {
  border-right: 1px dashed var(--aura-divider);
}

.aura-compare__container::after {
  display: block;
  height: 1px;
  margin: 0 6%;
  background: #e5e8ee;
  content: "";
}

.aura-compare__mobile-hint {
  display: none;
}

/* Tablet / mobile:
   retain the diagram's alignment and allow horizontal scrolling. */
@media (max-width: 1100px) {
  .aura-compare {
    --aura-icon-size: 64px;
    padding: 40px 20px 24px;
  }

  .aura-compare__header {
    margin-bottom: 34px;
  }

  .aura-compare__eyebrow {
    margin-bottom: 16px;
  }

  .aura-flow {
    grid-template-columns: 140px minmax(0, 1fr);
    min-width: 1200px;
  }

  .aura-flow__source-content {
    top: 148px;
    width: 100px;
  }

  .aura-flow__phone {
    width: 94px;
    height: 94px;
  }

  .aura-flow__phone svg {
    width: 48px;
    height: 48px;
  }

  .aura-flow__branch {
    left: 88px;
    width: 52px;
  }

  .aura-flow__system strong {
    font-size: 18px;
  }

  .aura-flow__system span {
    font-size: 14px;
  }

  .aura-flow__item p,
  .aura-flow__labels span {
    font-size: 14px;
  }

  .aura-flow__result p {
    font-size: 13px;
  }

  .aura-compare__mobile-hint {
    display: block;
    margin: 0 0 18px;
    color: var(--aura-accent-dark);
    font-size: 12px;
    text-align: center;
  }
}

@media (max-width: 600px) {
  .aura-compare {
    padding-inline: 16px;
  }

  .aura-compare__header h2 {
    font-size: 29px;
    line-height: 1.22;
  }

  .aura-compare__eyebrow {
    font-size: 11px;
    letter-spacing: 0.1em;
  }

  .aura-compare__subtitle {
    font-size: 15px;
  }
}

.avc-section {
  --avc-ink: #062b24;
  --avc-green: #10cd80;
  --avc-dark-green: #00543a;
  --avc-mint: #e6fbf3;
  --avc-mint-border: #c4f4e3;
  --avc-grey: #819196;
  --avc-muted: #66797a;

  padding: 24px 32px 36px;
  background: #fff;
  color: var(--avc-ink);
  font-family: "Inter", sans-serif;
}

.avc-section *,
.avc-section *::before,
.avc-section *::after {
  box-sizing: border-box;
}

.avc-section p,
.avc-section h2,
.avc-section h3 {
  margin: 0;
}

.avc-container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
}

.avc-header {
  text-align: center;
}

.avc-eyebrow {
  color: var(--avc-green);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.5;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}

.avc-header h2 {
  margin-top: 5px;
  font-size: clamp(30px, 3.35vw, 54px);
  font-weight: 750;
  line-height: 1.12;
  letter-spacing: -0.045em;
  text-wrap: balance;
}

.avc-subtitle {
  margin-top: 6px !important;
  color: #54666a;
  font-size: clamp(16px, 1.5vw, 24px);
  line-height: 1.45;
}

/* Customer request */
.avc-request {
  display: flex;
  width: fit-content;
  max-width: 100%;
  min-height: 64px;
  align-items: center;
  gap: 15px;
  margin: 23px auto 0;
  padding: 11px 28px 11px 24px;
  border-radius: 50px;
  background: #ecfcf6;
}

.avc-request-icon {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: #baf4df;
}

.avc-request-icon svg {
  width: 22px;
  height: 22px;
  fill: var(--avc-ink);
}

.avc-request p {
  font-size: 17px;
  line-height: 1.45;
  letter-spacing: -0.025em;
}

.avc-branches {
  width: 52%;
  height: 58px;
  margin-inline: auto;
}

.avc-branches svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.avc-branches path {
  fill: none;
  stroke-width: 1.6;
  vector-effect: non-scaling-stroke;
}

.avc-branch-green {
  stroke: #73e8b7;
}

.avc-branch-grey {
  stroke: #c5cdd0;
}

/* Demo columns */
.avc-demos {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  gap: 38px;
  margin-top: -26px;
}

.avc-voice,
.avc-chat {
  min-width: 0;
}

.avc-product-heading {
  display: flex;
  min-height: 66px;
  align-items: center;
  justify-content: center;
  gap: 18px;
}

.avc-product-heading h3 {
  font-size: 20px;
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.avc-product-heading p {
  margin-top: 5px;
  color: #74958c;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.avc-phone-icon {
  display: grid;
  width: 64px;
  height: 64px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(145deg, #006344, #003c2d);
}

.avc-phone-icon svg {
  width: 32px;
  height: 32px;
  fill: #fff;
}

.avc-product-heading--chat {
  justify-content: flex-start;
  padding-left: 70px;
}

.avc-product-heading--chat h3 {
  font-size: 16px;
  letter-spacing: 0.06em;
}

.avc-bot-heading-icon {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 13px;
  background: #61727a;
  color: #fff;
}

.avc-bot-heading-icon svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Voice illustration */
.avc-voice-stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 178px;
  align-items: center;
  gap: 12px;
  min-height: 262px;
  margin-top: 12px;
}

.avc-audio-area {
  position: relative;
  min-width: 0;
  padding-top: 74px;
}

.avc-speech {
  position: absolute;
  top: 0;
  padding: 13px 15px;
  border-radius: 17px;
  background: var(--avc-mint);
  font-size: clamp(12px, 0.95vw, 16px);
  line-height: 1.35;
  letter-spacing: -0.025em;
}

.avc-speech::after {
  position: absolute;
  bottom: -10px;
  width: 20px;
  height: 14px;
  background: var(--avc-mint);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: "";
}

.avc-speech--caller {
  left: 6%;
}

.avc-speech--caller::after {
  left: 30px;
}

.avc-speech--aura {
  right: 7%;
  top: 5px;
}

.avc-speech--aura::after {
  left: 24px;
}

.avc-waveform {
  display: flex;
  height: 96px;
  align-items: center;
  justify-content: space-between;
  gap: 3px;
}

.avc-waveform span {
  display: block;
  width: 4px;
  height: var(--bar-height);
  min-width: 2px;
  flex: 1 1 0;
  max-width: 5px;
  border-radius: 10px;
  background: linear-gradient(to bottom,
      #8df0c8,
      #08c67b 42%,
      #12d58c 70%,
      #9af3d1);
}

.avc-tags {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: 6px;
}

.avc-tags span {
  padding: 8px 16px;
  border: 1px solid #d1f8e9;
  border-radius: 30px;
  background: var(--avc-mint);
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

/* Voice outcome and connecting line */
.avc-booked {
  position: relative;
  padding-top: 35px;
  text-align: center;
}

.avc-booked::before {
  position: absolute;
  top: 69px;
  left: -15px;
  width: calc(50% - 18px);
  height: 2px;
  background: #35dba0;
  content: "";
}

.avc-booked::after {
  position: absolute;
  top: 66px;
  left: -18px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #13d789;
  content: "";
}

.avc-success-icon {
  position: relative;
  display: grid;
  width: 70px;
  height: 70px;
  place-items: center;
  margin-inline: auto;
  border: 7px solid #a7f5d5;
  border-radius: 50%;
  background: #0acb78;
  color: #fff;
}

.avc-success-icon svg {
  width: 35px;
  height: 35px;
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.avc-booked strong,
.avc-faq strong {
  display: block;
  margin-top: 12px;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.avc-booked strong {
  color: #08a767;
}

.avc-booked p,
.avc-faq p {
  margin-top: 5px;
  color: #719087;
  font-size: 13px;
  line-height: 1.4;
}

/* Chat illustration */
.avc-chat-stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 124px;
  align-items: center;
  gap: 30px;
  margin-top: 12px;
}

.avc-chat-window {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #e5ecef;
  border-radius: 12px;
  background: #fff;
}

.avc-chat-toolbar {
  display: flex;
  height: 27px;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  padding-inline: 17px;
  background: #f0f4f6;
}

.avc-chat-toolbar span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #809097;
}

.avc-chat-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 11px 12px 12px;
}

.avc-message {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.avc-message-avatar {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: #edf2f5;
  color: #556a73;
  font-size: 21px;
}

.avc-message-avatar svg {
  width: 15px;
  height: 15px;
  fill: #526a73;
}

.avc-message-bubble {
  padding: 8px 12px;
  border-radius: 17px;
  background: #edf2f6;
  color: #4a5965;
  font-size: 12px;
  line-height: 1.4;
}

.avc-message-bubble ol {
  margin: 0;
  padding-left: 22px;
}

.avc-message--visitor {
  justify-content: flex-end;
  align-items: center;
}

.avc-message--visitor .avc-message-bubble {
  padding: 7px 12px;
  background: #96a8b0;
  color: #fff;
  font-size: 11px;
}

.avc-input-preview {
  display: flex;
  min-height: 37px;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
  padding: 8px 11px;
  border: 1px solid #e9eef1;
  border-radius: 9px;
  color: #a2adb4;
  font-size: 12px;
}

.avc-input-preview svg {
  width: 22px;
  height: 22px;
  fill: #8c9fa6;
  stroke: #fff;
  stroke-width: 1;
}

.avc-faq {
  position: relative;
  text-align: center;
}

.avc-faq::before {
  position: absolute;
  top: 27px;
  right: calc(50% + 28px);
  width: 65px;
  border-top: 2px dotted #b8c2c5;
  content: "";
}

.avc-faq::after {
  position: absolute;
  top: 24px;
  right: calc(50% + 88px);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #8e9c9e;
  content: "";
}

.avc-faq-icon {
  display: grid;
  width: 55px;
  height: 55px;
  place-items: center;
  margin-inline: auto;
  border-radius: 50%;
  background: #89999b;
  color: #fff;
}

.avc-faq-icon svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.avc-faq strong {
  color: #5a6c75;
}

/* Five aligned comparison rows */
.avc-comparison {
  max-width: 1320px;
  margin: 20px auto 0;
}

.avc-comparison-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.95fr) minmax(0, 1fr);
  align-items: center;
  gap: 30px;
  min-height: 48px;
}

.avc-left-copy,
.avc-right-copy {
  font-size: clamp(13px, 1.05vw, 17px);
  line-height: 1.45;
  letter-spacing: -0.02em;
}

.avc-left-copy {
  text-align: right;
}

.avc-right-copy {
  color: #52616d;
}

.avc-comparison-axis {
  position: relative;
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  isolation: isolate;
}

.avc-comparison-axis::before {
  position: absolute;
  z-index: -1;
  top: 50%;
  right: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(to right,
      #8eebc6 0%,
      #8eebc6 50%,
      #bdc8ca 50%,
      #bdc8ca 100%);
  content: "";
}

.avc-comparison-axis::after {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 4px 50%, #10cf80 4px, transparent 4.5px),
    radial-gradient(circle at calc(100% - 4px) 50%,
      #87979b 4px,
      transparent 4.5px);
  pointer-events: none;
  content: "";
}

.avc-comparison-axis span {
  position: relative;
  z-index: 1;
  display: flex;
  min-width: 150px;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  padding: 7px 18px;
  border: 1px solid var(--avc-mint-border);
  border-radius: 30px;
  background: var(--avc-mint);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

.avc-closing {
  margin-top: 29px !important;
  font-size: clamp(18px, 1.55vw, 25px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -0.035em;
  text-align: center;
}

/* Smaller desktop and tablet */
@media (max-width: 1250px) {
  .avc-demos {
    gap: 24px;
  }

  .avc-voice-stage {
    grid-template-columns: minmax(0, 1fr) 140px;
    gap: 8px;
  }

  .avc-chat-stage {
    grid-template-columns: minmax(0, 1fr) 100px;
    gap: 20px;
  }

  .avc-product-heading--chat {
    padding-left: 15px;
  }

  .avc-tags {
    gap: 6px;
  }

  .avc-tags span {
    padding: 7px 9px;
    font-size: 10px;
  }

  .avc-speech {
    padding: 10px;
    font-size: 11px;
  }

  .avc-booked strong,
  .avc-faq strong {
    font-size: 10px;
  }

  .avc-message-bubble {
    padding: 7px 8px;
    font-size: 11px;
  }

  .avc-message--visitor .avc-message-bubble {
    font-size: 10px;
  }

  .avc-comparison-row {
    grid-template-columns: 1fr minmax(230px, 0.9fr) 1fr;
    gap: 18px;
  }
}

/* Stack demo panels on tablet */
@media (max-width: 950px) {
  .avc-section {
    padding: 40px 24px;
  }

  .avc-branches {
    display: none;
  }

  .avc-demos {
    grid-template-columns: 1fr;
    gap: 38px;
    margin-top: 30px;
  }

  .avc-voice-stage {
    grid-template-columns: minmax(0, 1fr) 165px;
    min-height: 230px;
  }

  .avc-speech {
    font-size: 13px;
  }

  .avc-tags span {
    font-size: 12px;
  }

  .avc-chat {
    max-width: 650px;
    width: 100%;
    margin-inline: auto;
  }

  .avc-product-heading--chat {
    justify-content: center;
    padding-left: 0;
  }

  .avc-chat-stage {
    grid-template-columns: minmax(0, 1fr) 130px;
    gap: 35px;
  }

  .avc-message-bubble {
    font-size: 13px;
  }

  .avc-message--visitor .avc-message-bubble {
    font-size: 12px;
  }

  .avc-comparison {
    margin-top: 36px;
  }

  .avc-comparison-row {
    grid-template-columns: 1fr 190px 1fr;
    gap: 12px;
    min-height: 65px;
  }

  .avc-comparison-axis span {
    min-width: 135px;
    padding-inline: 12px;
    font-size: 12px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .avc-section {
    padding: 32px 16px;
  }

  .avc-eyebrow {
    font-size: 10px;
  }

  .avc-header h2 {
    margin-top: 10px;
    font-size: 31px;
  }

  .avc-subtitle {
    margin-top: 12px !important;
    font-size: 15px;
  }

  .avc-request {
    gap: 10px;
    padding: 12px 15px;
    border-radius: 22px;
  }

  .avc-request p {
    font-size: 13px;
  }

  .avc-request-icon {
    width: 34px;
    height: 34px;
  }

  .avc-product-heading {
    gap: 12px;
  }

  .avc-product-heading h3 {
    font-size: 17px;
  }

  .avc-product-heading p {
    font-size: 10px;
    letter-spacing: 0.12em;
  }

  .avc-phone-icon {
    width: 52px;
    height: 52px;
  }

  .avc-voice-stage {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 24px;
  }

  .avc-audio-area {
    padding-top: 88px;
  }

  .avc-speech {
    max-width: 48%;
    padding: 10px;
    font-size: 11px;
  }

  .avc-speech--caller {
    left: 0;
  }

  .avc-speech--aura {
    right: 0;
  }

  .avc-waveform {
    height: 85px;
    gap: 2px;
  }

  .avc-tags {
    flex-wrap: wrap;
    gap: 6px;
  }

  .avc-tags span {
    padding: 7px 10px;
    font-size: 10px;
  }

  .avc-booked {
    padding-top: 14px;
  }

  .avc-booked::before,
  .avc-booked::after {
    display: none;
  }

  .avc-success-icon {
    width: 58px;
    height: 58px;
    border-width: 5px;
  }

  .avc-booked strong,
  .avc-faq strong {
    font-size: 11px;
  }

  .avc-chat-stage {
    grid-template-columns: minmax(0, 1fr) 85px;
    gap: 15px;
  }

  .avc-chat-body {
    gap: 10px;
    padding: 10px 8px;
  }

  .avc-message {
    gap: 5px;
  }

  .avc-message-avatar {
    width: 22px;
    height: 22px;
  }

  .avc-message-bubble {
    padding: 7px 8px;
    font-size: 10px;
  }

  .avc-message--visitor .avc-message-bubble {
    font-size: 10px;
  }

  .avc-faq::before {
    width: 25px;
  }

  .avc-faq::after {
    right: calc(50% + 49px);
  }

  .avc-faq p {
    font-size: 11px;
  }

  .avc-comparison-row {
    grid-template-columns: minmax(0, 1fr) 110px minmax(0, 1fr);
    gap: 8px;
    min-height: 90px;
    padding-block: 10px;
    border-bottom: 1px solid #edf3f0;
  }

  .avc-left-copy,
  .avc-right-copy {
    font-size: 11px;
    line-height: 1.5;
  }

  .avc-comparison-axis span {
    min-width: 0;
    width: 100%;
    padding: 8px 6px;
    font-size: 10px;
  }

  .avc-comparison-axis::after {
    display: none;
  }

  .avc-closing {
    margin-top: 25px !important;
    font-size: 19px;
    text-wrap: balance;
  }
}

.aura-rollout {
  --ar-ink: #032b23;
  --ar-panel: #042b23;
  --ar-green: #19e59a;
  --ar-white: #eefbf6;
  --ar-muted: #bbd1c9;
  --ar-border: #327565;

  padding: 28px 32px 24px;
  background: #fff;
  color: var(--ar-ink);
  font-family: "Inter", sans-serif;
}

.aura-rollout *,
.aura-rollout *::before,
.aura-rollout *::after {
  box-sizing: border-box;
}

.aura-rollout h2,
.aura-rollout h3,
.aura-rollout p {
  margin: 0;
}

.ar-icon-library {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.ar-container {
  max-width: 1300px;
  margin-inline: auto;
}

/* Heading */
.ar-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 350px;
  align-items: center;
  gap: 40px;
  padding: 0 24px;
  margin-bottom: 26px;
}

.ar-eyebrow {
  margin-bottom: 5px !important;
  color: #25c989;
  font-size: 15px;
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.ar-header h2 {
  font-size: clamp(30px, 4.0vw, 56px);
  font-weight: 750;
  line-height: 1.08;
  letter-spacing: -0.055em;
}

.ar-subtitle {
  margin-top: 8px !important;
  color: #7a8987;
  font-size: clamp(16px, 1.55vw, 25px);
  line-height: 1.45;
}

.ar-header-note {
  display: flex;
  min-height: 86px;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
  padding-left: 55px;
  border-left: 1px solid #cdd8d3;
  text-transform: uppercase;
}

.ar-header-note strong {
  font-size: 18px;
  font-weight: 750;
}

.ar-header-note span {
  color: #82908b;
  font-size: 17px;
  font-weight: 600;
}

/* Main dark panel */
.ar-panel {
  position: relative;
  overflow: hidden;
  padding: 44px 35px 24px;
  border: 1px solid #37675a;
  border-radius: 17px;
  background:
    radial-gradient(ellipse at 24% 63%,
      rgba(10, 108, 71, 0.13),
      transparent 37%),
    radial-gradient(ellipse at 78% 38%,
      rgba(10, 108, 71, 0.11),
      transparent 35%),
    var(--ar-panel);
  color: var(--ar-white);
}

/* Top feedback loop */
.ar-feedback {
  position: absolute;
  top: 25px;
  right: 28px;
  left: 16%;
  height: 380px;
  border-top: 2px solid #18b97c;
  border-right: 2px solid #18b97c;
  border-radius: 28px 32px 32px 0;
  pointer-events: none;
}

.ar-feedback::before {
  position: absolute;
  top: 0;
  left: 0;
  height: 23px;
  border-left: 2px solid #18b97c;
  content: "";
}

.ar-feedback::after {
  position: absolute;
  top: 19px;
  left: -4px;
  width: 8px;
  height: 8px;
  background: #18b97c;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: "";
}

.ar-feedback span {
  position: absolute;
  top: -9px;
  left: 24%;
  padding: 0 18px;
  background: var(--ar-panel);
  color: #22c58a;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

/* Three equal columns */
.ar-columns {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ar-column {
  min-width: 0;
  padding: 0 30px;
}

.ar-column:first-child {
  padding-left: 0;
}

.ar-column:last-child {
  padding-right: 15px;
}

.ar-column+.ar-column {
  border-left: 1px solid #337b65;
}

.ar-phase {
  position: relative;
  padding-bottom: 17px;
  margin-bottom: 17px !important;
  color: #d5e5df;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.25em;
  text-transform: uppercase;
}

.ar-phase::after {
  position: absolute;
  bottom: 4px;
  left: 0;
  width: 32px;
  height: 3px;
  border-radius: 3px;
  background: var(--ar-green);
  content: "";
}

.ar-step {
  min-height: 42px;
  color: #e1eee8;
  font-size: clamp(11px, 0.9vw, 13px);
  font-weight: 400;
  line-height: 1.4;
  text-align: center;
}

.ar-step strong {
  font-weight: 750;
}

.ar-icon {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ar-icon--fill {
  fill: currentColor;
  stroke: none;
}

.ar-three-boxes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.ar-box {
  display: flex;
  min-height: 58px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid var(--ar-border);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.015);
  box-shadow: inset 0 0 12px rgba(45, 174, 115, 0.04);
}

.ar-box span {
  font-size: 11px;
}

/* Discovery diagram */
.ar-discovery {
  margin: 13px 30px 8px;
}

.ar-discovery-lines {
  display: block;
  width: 100%;
  height: 55px;
  overflow: visible;
}

.ar-discovery-lines path,
.ar-script-lines path,
.ar-integration-lines path {
  fill: none;
  stroke: #b7d5c7;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ar-discovery-lines .ar-green-line,
.ar-discovery-lines .ar-arrow {
  stroke: var(--ar-green);
  stroke-width: 2;
}

.ar-discovery-lines circle {
  fill: #fff;
  stroke: var(--ar-green);
  stroke-width: 3;
  filter: drop-shadow(0 0 5px #19e59a);
}

/* Conversation diagram */
.ar-conversation {
  margin: 10px 20px 0;
}

.ar-wave {
  display: flex;
  height: 58px;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.ar-wave span {
  width: 3px;
  height: var(--ar-bar);
  flex: 1 1 0;
  max-width: 4px;
  border-radius: 3px;
  background: #2ae99c;
  box-shadow: 0 0 7px rgba(31, 238, 152, 0.6);
}

.ar-script-lines {
  display: block;
  width: 100%;
  height: 30px;
}

.ar-three-boxes--small {
  gap: 35px;
}

.ar-three-boxes--small span {
  display: grid;
  min-height: 28px;
  place-items: center;
  border: 1px solid var(--ar-border);
  border-radius: 9px;
  color: #dfebe6;
  font-size: 11px;
}

/* Integration diagram */
.ar-integration {
  position: relative;
  margin-top: 13px;
  padding-bottom: 30px;
}

.ar-three-boxes--horizontal {
  gap: 24px;
}

.ar-three-boxes--horizontal .ar-box {
  min-height: 42px;
  flex-direction: row;
  gap: 10px;
}

.ar-three-boxes--horizontal .ar-box span {
  font-size: 11px;
}

.ar-integration-lines {
  display: block;
  width: 100%;
  height: 50px;
}

.ar-agent {
  position: relative;
  display: flex;
  width: 48%;
  min-width: 170px;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: -20px auto 0;
  border: 2px solid #1ee89a;
  border-radius: 17px;
  background: #062e25;
  box-shadow: 0 0 15px rgba(0, 234, 145, 0.17);
}

.ar-agent-mark {
  width: 24px;
  height: 24px;
  fill: #fff;
}

.ar-agent strong {
  font-size: 14px;
  font-weight: 600;
}

.ar-down-arrow {
  position: absolute;
  bottom: 3px;
  left: 50%;
  width: 2px;
  height: 25px;
  background: #18d58c;
  transform: translateX(-50%);
}

.ar-down-arrow::after {
  position: absolute;
  bottom: -1px;
  left: -4px;
  width: 10px;
  height: 8px;
  background: #18d58c;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: "";
}

/* Pilot validation */
.ar-pilot {
  position: relative;
  display: flex;
  min-height: 80px;
  align-items: center;
  gap: 16px;
  margin-top: 15px;
}

.ar-pilot::before {
  position: absolute;
  top: 50%;
  right: 5px;
  left: 0;
  height: 2px;
  background: #1fcf87;
  content: "";
}

.ar-pilot::after {
  position: absolute;
  top: calc(50% - 6px);
  right: 3px;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 8px solid #1fcf87;
  content: "";
}

.ar-pilot-calls {
  position: relative;
  display: flex;
  flex: 1;
  justify-content: space-between;
  gap: 9px;
}

.ar-pilot-calls span,
.ar-call-stack span {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #35dc9b;
  border-radius: 50%;
  background: #063226;
}

.ar-pilot-calls svg,
.ar-call-stack svg {
  width: 17px;
  height: 17px;
  fill: #eafff5;
}

.ar-validation {
  position: relative;
  display: flex;
  min-height: 52px;
  align-items: center;
  gap: 13px;
  margin-right: 25px;
  padding: 10px 15px;
  border: 1px solid #17d486;
  border-radius: 10px;
  background: #062b22;
}

.ar-validation strong {
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
}

.ar-validation span {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 50%;
  background: #28ee9c;
  color: #00432a;
  box-shadow: 0 0 13px rgba(31, 238, 152, 0.35);
}

.ar-validation svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Live deployment */
.ar-deployment {
  position: relative;
  height: 160px;
  margin: 12px 6px 13px;
}

.ar-call-routing {
  position: absolute;
  top: 0;
  width: 100%;
  height: 130px;
}

.ar-call-routing path {
  fill: none;
  stroke: #9cd6ba;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.ar-call-routing .ar-outgoing {
  stroke: #19dc90;
}

.ar-call-stack {
  position: absolute;
  top: 5px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.ar-call-stack--in {
  left: 0;
}

.ar-call-stack--out {
  right: 0;
}

.ar-call-stack span {
  width: 24px;
  height: 24px;
}

.ar-call-stack svg {
  width: 13px;
  height: 13px;
}

.ar-deployment-agent {
  position: absolute;
  top: 30px;
  left: 43%;
  display: flex;
  width: 78px;
  height: 78px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  border: 2px solid #19e59a;
  border-radius: 50%;
  background: #062c23;
  box-shadow: 0 0 27px rgba(11, 231, 139, 0.28);
  transform: translateX(-50%);
}

.ar-deployment-agent svg {
  width: 30px;
  height: 30px;
  fill: #fff;
}

.ar-deployment-agent span {
  font-size: 9px;
}

.ar-live {
  position: absolute;
  top: 52px;
  left: 57%;
  padding: 4px 10px;
  border-radius: 7px;
  background: #2bfa9f;
  color: #02472d;
  box-shadow: 0 0 19px rgba(11, 231, 139, 0.35);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.ar-call-captions {
  position: absolute;
  right: 0;
  bottom: 14px;
  left: 0;
  display: flex;
  justify-content: space-between;
  color: #d5e5df;
  font-size: 10px;
}

/* Optimization chart */
.ar-insights {
  position: relative;
  display: flex;
  min-height: 80px;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
  margin-top: 15px;
  padding: 14px 18px;
  border: 1px solid var(--ar-border);
  border-radius: 11px;
}

.ar-insights-curve {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.ar-insights-curve path {
  fill: none;
  stroke: #20e59a;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 5px rgba(25, 229, 154, 0.7));
}

.ar-insights-copy {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: -12px;
}

.ar-insights-copy svg {
  width: 33px;
  height: 33px;
  color: #25f1a3;
  stroke-width: 3;
}

.ar-insights-copy span,
.ar-insights p {
  position: relative;
  font-size: 11px;
  line-height: 1.45;
}

.ar-insights p {
  margin-top: 20px;
}

/* Bottom milestone line */
.ar-progress {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 34px;
}

.ar-progress::before {
  position: absolute;
  top: 11px;
  right: -8px;
  left: -8px;
  height: 6px;
  border-radius: 10px;
  background: #27f3a0;
  box-shadow: 0 0 12px rgba(22, 238, 151, 0.55);
  content: "";
}

.ar-progress>div {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 13px;
}

.ar-progress span {
  width: 26px;
  height: 26px;
  border: 4px solid #36f4aa;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 14px #15e48e;
}

.ar-progress strong {
  color: #d2e6dc;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.2em;
  text-align: center;
  text-transform: uppercase;
}

/* Benefits */
.ar-benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 26px;
  padding: 0 50px;
}

.ar-benefits>div {
  display: flex;
  min-height: 58px;
  align-items: center;
  justify-content: center;
  gap: 22px;
}

.ar-benefits>div+div {
  border-left: 1px solid #d6e0da;
}

.ar-benefits svg {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  fill: none;
  stroke: #083c30;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ar-benefits span {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.025em;
}

/* Compact desktop */
@media (max-width: 1250px) {
  .ar-header {
    grid-template-columns: minmax(0, 1fr) 260px;
    gap: 25px;
    padding-inline: 10px;
  }

  .ar-header-note {
    padding-left: 25px;
  }

  .ar-header-note span {
    font-size: 14px;
  }

  .ar-panel {
    padding-inline: 24px;
  }

  .ar-column {
    padding-inline: 18px;
  }

  .ar-column:last-child {
    padding-right: 8px;
  }

  .ar-discovery,
  .ar-conversation {
    margin-inline: 0;
  }

  .ar-three-boxes,
  .ar-three-boxes--horizontal {
    gap: 12px;
  }

  .ar-three-boxes--horizontal .ar-box {
    gap: 6px;
  }

  .ar-three-boxes--horizontal .ar-icon {
    width: 19px;
    height: 19px;
  }

  .ar-agent {
    min-width: 145px;
  }

  .ar-pilot {
    gap: 10px;
  }

  .ar-pilot-calls {
    gap: 4px;
  }

  .ar-pilot-calls span {
    width: 27px;
    height: 27px;
  }

  .ar-validation {
    gap: 7px;
    padding: 8px;
    margin-right: 16px;
  }

  .ar-validation strong {
    font-size: 10px;
  }

  .ar-validation span {
    width: 27px;
    height: 27px;
  }

  .ar-deployment-agent {
    width: 75px;
    height: 75px;
    top: 43px;
  }

  .ar-live {
    padding-inline: 9px;
    font-size: 11px;
  }

  .ar-insights {
    padding-inline: 12px;
  }

  .ar-insights-copy {
    gap: 8px;
  }

  .ar-feedback span {
    font-size: 8px;
    padding-inline: 10px;
  }

  .ar-benefits {
    padding-inline: 0;
  }

  .ar-benefits>div {
    gap: 15px;
  }

  .ar-benefits span {
    font-size: 15px;
  }
}

/* Tablet and mobile: stack phases for readability */
@media (max-width: 1000px) {
  .aura-rollout {
    padding: 35px 22px 25px;
  }

  .ar-header {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 0;
  }

  .ar-header h2 {
    font-size: clamp(36px, 6vw, 58px);
  }

  .ar-header-note {
    min-height: 0;
    padding-left: 16px;
  }

  .ar-header-note strong {
    font-size: 14px;
  }

  .ar-header-note span {
    font-size: 12px;
  }

  .ar-panel {
    padding: 28px;
  }

  .ar-feedback {
    position: static;
    height: auto;
    margin-bottom: 28px;
    padding: 12px;
    border: 1px solid #237252;
    border-radius: 9px;
    text-align: center;
  }

  .ar-feedback::before,
  .ar-feedback::after {
    display: none;
  }

  .ar-feedback span {
    position: static;
    padding: 0;
    background: transparent;
    font-size: 10px;
  }

  .ar-columns {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .ar-column,
  .ar-column:first-child,
  .ar-column:last-child {
    width: 100%;
    max-width: 570px;
    margin-inline: auto;
    padding: 0;
  }

  .ar-column+.ar-column {
    padding-top: 28px;
    border-left: 0;
    border-top: 1px solid #337b65;
  }

  .ar-phase {
    font-size: 13px;
  }

  .ar-step {
    min-height: 0;
    font-size: 15px;
  }

  .ar-discovery,
  .ar-conversation {
    margin-inline: 20px;
  }

  .ar-three-boxes {
    gap: 22px;
  }

  .ar-box {
    min-height: 72px;
  }

  .ar-three-boxes--horizontal .ar-box {
    min-height: 55px;
  }

  .ar-three-boxes--horizontal .ar-box span {
    font-size: 12px;
  }

  .ar-agent {
    min-width: 180px;
  }

  .ar-pilot {
    margin-top: 20px;
  }

  .ar-pilot-calls span {
    width: 36px;
    height: 36px;
  }

  .ar-validation {
    gap: 15px;
    padding: 12px 18px;
    margin-right: 26px;
  }

  .ar-validation strong {
    font-size: 12px;
  }

  .ar-deployment {
    margin-top: 20px;
  }

  .ar-deployment-agent {
    top: 35px;
    width: 92px;
    height: 92px;
  }

  .ar-live {
    padding: 7px 14px;
    font-size: 13px;
  }

  .ar-progress {
    margin-top: 32px;
  }

  .ar-progress strong {
    font-size: 9px;
    letter-spacing: 0.1em;
  }

  .ar-benefits {
    gap: 15px;
  }

  .ar-benefits>div {
    flex-direction: column;
    gap: 10px;
    text-align: center;
  }

  .ar-benefits span {
    font-size: 13px;
  }

  .ar-benefits svg {
    width: 34px;
    height: 34px;
  }
}

@media (max-width: 480px) {
  .aura-rollout {
    padding-inline: 16px;
  }

  .ar-eyebrow {
    font-size: 11px;
  }

  .ar-header h2 {
    font-size: 39px;
  }

  .ar-subtitle {
    font-size: 15px;
  }

  .ar-panel {
    padding: 22px 16px;
    border-radius: 14px;
  }

  .ar-step {
    font-size: 13px;
  }

  .ar-discovery,
  .ar-conversation {
    margin-inline: 0;
  }

  .ar-three-boxes {
    gap: 12px;
  }

  .ar-three-boxes--horizontal .ar-box {
    gap: 5px;
  }

  .ar-three-boxes--horizontal .ar-box span {
    font-size: 10px;
  }

  .ar-agent {
    min-width: 155px;
  }

  .ar-agent strong {
    font-size: 13px;
  }

  .ar-pilot {
    gap: 10px;
  }

  .ar-pilot-calls span {
    width: 25px;
    height: 25px;
  }

  .ar-pilot-calls svg {
    width: 14px;
    height: 14px;
  }

  .ar-validation {
    gap: 7px;
    padding: 9px;
    margin-right: 15px;
  }

  .ar-validation strong {
    font-size: 10px;
  }

  .ar-deployment-agent {
    top: 43px;
    width: 75px;
    height: 75px;
  }

  .ar-live {
    padding: 6px 9px;
    font-size: 11px;
  }

  .ar-progress span {
    width: 22px;
    height: 22px;
  }

  .ar-progress::before {
    top: 9px;
    height: 5px;
  }

  .ar-progress strong {
    max-width: 85px;
    font-size: 8px;
    line-height: 1.6;
  }

  .ar-benefits {
    gap: 8px;
  }

  .ar-benefits span {
    font-size: 11px;
    line-height: 1.4;
  }
}

.aura-pricing {
  --ap-ink: #072a26;
  --ap-muted: #6d7e7d;
  --ap-green: #08ce83;
  --ap-mint: #e7faf3;
  --ap-border: #e0ebe7;

  padding: 46px 40px 38px;
  background: #fff;
  color: var(--ap-ink);
  font-family: "Inter", sans-serif;
}

.aura-pricing *,
.aura-pricing *::before,
.aura-pricing *::after {
  box-sizing: border-box;
}

.aura-pricing h2,
.aura-pricing h3,
.aura-pricing p {
  margin: 0;
}

.ap-icon-library {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.ap-container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
}

/* Header */
.ap-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 35px;
}

.ap-heading {
  min-width: 0;
}

.ap-eyebrow {
  margin-bottom: 10px !important;
  color: #29c78c;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.ap-header h2 {
  font-size: clamp(26px, 3.2vw, 50px);
  font-weight: 750;
  line-height: 1.12;
  letter-spacing: -0.045em;
}

.ap-header-note {
  flex: 0 0 auto;
  padding-top: 3px;
  color: #788582;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.8;
  letter-spacing: 0.08em;
  text-align: right;
  text-transform: uppercase;
}

.ap-description {
  max-width: 1110px;
  margin-top: 11px !important;
  color: #596d6b;
  font-size: clamp(14px, 1.25vw, 19px);
  line-height: 1.43;
  letter-spacing: -0.015em;
}

/*
  Shared 500px diagram height aligns the input dots,
  connector curves, scope engine and output arrow.
*/
.ap-layout {
  display: grid;
  grid-template-columns:
    minmax(0, 40fr) minmax(0, 11fr) minmax(0, 16fr) minmax(0, 6fr) minmax(0, 27fr);
  align-items: center;
  margin-top: 28px;
}

/* Five input rows */
.ap-inputs {
  position: relative;
  display: grid;
  height: 380px;
  grid-template-rows: repeat(5, 64px);
  row-gap: 15px;
}

.ap-factor {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 16px;
  padding: 6px 18px 6px 6px;
  border: 1px solid var(--ap-border);
  border-radius: 32px;
  background: #fff;
}

.ap-factor-icon {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: var(--ap-mint);
  color: #174c40;
}

.ap-factor-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ap-factor-icon .ap-chart-icon {
  stroke-width: 4;
  stroke-linecap: butt;
}

.ap-factor-content {
  min-width: 0;
  flex: 1;
}

.ap-factor h3 {
  margin-bottom: 8px;
  color: #274c48;
  font-size: clamp(10px, 0.85vw, 13px);
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

/* Decorative scale: matches the reference */
.ap-track {
  position: relative;
  height: 6px;
  border-radius: 10px;
  background: #d8e8e2;
}

.ap-track::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--ap-value);
  border-radius: inherit;
  background: linear-gradient(to right, #d8eee5, #9fe7ce);
  content: "";
}

.ap-track span {
  position: absolute;
  top: 50%;
  left: var(--ap-value);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--ap-green);
  box-shadow: 0 0 4px rgba(8, 206, 131, 0.18);
  transform: translate(-50%, -50%);
}

.ap-scale {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-top: 6px;
  color: #768581;
  font-size: 11px;
  line-height: 1.2;
}

.ap-input-caption {
  position: absolute;
  top: calc(100% + 11px);
  left: 20px;
  color: #7a8884;
  font-size: 12px;
  line-height: 1.4;
}

/* Curved connectors */
.ap-connectors {
  height: 380px;
}

.ap-connectors svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.ap-connector-paths path {
  fill: none;
  stroke: #8bb2a5;
  stroke-width: 1.8;
  vector-effect: non-scaling-stroke;
}

.ap-connector-dots {
  fill: #619a87;
}

/* Scope engine */
.ap-engine-column {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 380px;
}

.ap-engine {
  display: flex;
  width: 100%;
  min-height: 160px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 16px 12px;
  border: 2px solid #5de1ab;
  border-radius: 20px;
  background:
    radial-gradient(ellipse at 50% 55%,
      rgba(1, 133, 78, 0.18),
      transparent 70%),
    #042c22;
  box-shadow:
    0 0 0 2px rgba(130, 233, 189, 0.22),
    0 0 32px rgba(5, 205, 123, 0.18);
  color: #e4f4eb;
}

.ap-engine h3 {
  font-size: 14px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ap-engine-label {
  margin-top: 4px !important;
  color: #c1d9cc;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: 0.23em;
  text-transform: uppercase;
}

.ap-engine-wave {
  width: 86%;
  height: 60px;
  margin-top: 8px;
  overflow: visible;
}

.ap-engine-wave path {
  fill: none;
  stroke: #06df83;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 4px rgba(6, 223, 131, 0.55));
}

.ap-engine-caption {
  margin-top: 3px !important;
  color: #c2d9cf;
  font-size: 8px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.14em;
  text-align: center;
  text-transform: uppercase;
}

/* Arrow to quote */
.ap-output-arrow {
  padding-inline: 2px 12px;
}

.ap-output-arrow svg {
  display: block;
  width: 100%;
  height: 24px;
  overflow: visible;
}

.ap-output-arrow path {
  fill: none;
  stroke: #245a48;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Quote card */
.ap-quote {
  margin-block: -28px -12px;
  padding: 24px 24px 20px;
  border: 2px solid #315c4e;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 7px 22px rgba(19, 61, 45, 0.05);
  text-align: center;
}

.ap-quote-icon {
  display: block;
  width: 38px;
  height: 48px;
  margin: 0 auto 12px;
  fill: none;
  stroke: #18553e;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ap-quote h3 {
  font-size: clamp(16px, 1.4vw, 22px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.025em;
  text-transform: uppercase;
}

.ap-quote-subtitle {
  margin-top: 6px !important;
  color: #657872;
  font-size: 12px;
  line-height: 1.4;
}

.ap-quote-list {
  margin: 15px 0 20px;
  padding: 0;
  list-style: none;
  text-align: left;
}

.ap-quote-list li {
  display: flex;
  min-height: 36px;
  align-items: center;
  gap: 16px;
  padding: 6px 12px;
  color: #294a45;
  font-size: 13px;
  line-height: 1.3;
}

.ap-quote-list li+li {
  border-top: 1px solid #e1e9e5;
}

.ap-quote-list li>span {
  display: grid;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: #d4f8e9;
  color: #1c7855;
}

.ap-quote-list svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ap-button {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 12px;
  background: #08cb80;
  color: #fff;
  font-size: 16px;
  font-weight: 650;
  line-height: 1.3;
  text-decoration: none;
  transition: background 180ms ease, transform 180ms ease;
}

.ap-button svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ap-button:hover {
  background: #06b873;
  transform: translateY(-2px);
}

.ap-button:focus-visible {
  outline: 3px solid #18553e;
  outline-offset: 4px;
}

.ap-quote-footnote {
  margin-top: 10px !important;
  color: #73827b;
  font-size: 11px;
  line-height: 1.4;
}

/* Bottom text and trust strip */
.ap-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  margin-top: 53px;
  padding-top: 32px;
  border-top: 1px solid #e0e9e5;
}

.ap-footer>p {
  max-width: 850px;
  color: #6a7e77;
  font-size: 17px;
  line-height: 1.5;
}

.ap-trust {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
}

.ap-trust>span {
  display: flex;
  align-items: center;
  gap: 11px;
  padding-inline: 22px;
  color: #5e756c;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: 0.055em;
  white-space: nowrap;
  text-transform: uppercase;
}

.ap-trust>span:first-child {
  padding-left: 0;
}

.ap-trust>span:last-child {
  padding-right: 0;
}

.ap-trust>span+span {
  border-left: 1px solid #dce7e1;
}

.ap-trust svg {
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  fill: none;
  stroke: #31564a;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Compact desktop */
@media (max-width: 1250px) {
  .aura-pricing {
    padding-inline: 28px;
  }

  .ap-header-note {
    font-size: 11px;
  }

  .ap-factor {
    gap: 12px;
    padding-right: 16px;
  }

  .ap-factor-icon {
    width: 48px;
    height: 48px;
  }

  .ap-factor-icon svg {
    width: 24px;
    height: 24px;
  }

  .ap-factor h3 {
    font-size: 11px;
    margin-bottom: 10px;
  }

  .ap-scale {
    font-size: 11px;
  }

  .ap-engine {
    min-height: 190px;
    border-radius: 20px;
  }

  .ap-engine h3 {
    font-size: 13px;
  }

  .ap-engine-label {
    font-size: 10px;
  }

  .ap-engine-caption {
    font-size: 7px;
  }

  .ap-quote {
    padding: 24px 18px 20px;
  }

  .ap-quote-subtitle {
    font-size: 12px;
  }

  .ap-quote-list li {
    gap: 12px;
    padding-inline: 5px;
    font-size: 14px;
  }

  .ap-button {
    gap: 8px;
    font-size: 15px;
  }

  .ap-quote-footnote {
    font-size: 11px;
  }

  .ap-footer {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
}

/* Tablet: inputs above engine and quote */
@media (max-width: 950px) {
  .ap-header {
    flex-direction: column;
    gap: 12px;
  }

  .ap-header-note {
    text-align: left;
  }

  .ap-description {
    margin-top: 18px !important;
    font-size: 16px;
  }

  .ap-layout {
    grid-template-columns: minmax(0, 1fr) 65px minmax(0, 1.4fr);
    gap: 0;
    margin-top: 28px;
  }

  .ap-inputs {
    grid-column: 1 / -1;
    height: auto;
    grid-template-rows: repeat(5, auto);
    row-gap: 14px;
    margin-bottom: 52px;
  }

  .ap-factor {
    min-height: 90px;
    gap: 20px;
    padding-right: 25px;
  }

  .ap-factor-icon {
    width: 60px;
    height: 60px;
  }

  .ap-factor h3 {
    font-size: 14px;
  }

  .ap-scale {
    font-size: 13px;
  }

  .ap-connectors {
    display: none;
  }

  .ap-engine-column {
    height: auto;
  }

  .ap-engine {
    max-width: 260px;
    min-height: 220px;
  }

  .ap-engine h3 {
    font-size: 17px;
  }

  .ap-engine-label {
    font-size: 12px;
  }

  .ap-engine-caption {
    font-size: 9px;
  }

  .ap-quote {
    margin: 0;
    padding: 26px;
  }

  .ap-quote h3 {
    font-size: 24px;
  }

  .ap-quote-list li {
    font-size: 15px;
  }

  .ap-button {
    font-size: 17px;
  }

  .ap-footer {
    margin-top: 32px;
    padding-top: 24px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .aura-pricing {
    padding: 32px 16px;
  }

  .ap-eyebrow {
    font-size: 11px;
  }

  .ap-header h2 {
    font-size: 34px;
    line-height: 1.13;
  }

  .ap-description {
    font-size: 14px;
    line-height: 1.65;
  }

  .ap-layout {
    grid-template-columns: 1fr;
  }

  .ap-factor {
    min-height: 96px;
    gap: 12px;
    padding: 12px;
    border-radius: 24px;
  }

  .ap-factor-icon {
    width: 44px;
    height: 44px;
  }

  .ap-factor-icon svg {
    width: 23px;
    height: 23px;
  }

  .ap-factor h3 {
    margin-bottom: 12px;
    font-size: 12px;
    line-height: 1.35;
  }

  .ap-track {
    height: 6px;
  }

  .ap-track span {
    width: 16px;
    height: 16px;
  }

  .ap-scale {
    margin-top: 8px;
    font-size: 11px;
  }

  .ap-input-caption {
    left: 12px;
    font-size: 11px;
  }

  .ap-engine {
    width: 240px;
  }

  .ap-output-arrow {
    display: flex;
    height: 65px;
    align-items: center;
    justify-content: center;
    padding: 0;
  }

  .ap-output-arrow svg {
    width: 50px;
    height: 24px;
    transform: rotate(90deg);
  }

  .ap-quote {
    width: 100%;
    max-width: 420px;
    margin-inline: auto;
    padding: 26px 22px;
  }

  .ap-quote-subtitle {
    font-size: 13px;
  }

  .ap-quote-list li {
    min-height: 47px;
    gap: 15px;
  }

  .ap-quote-footnote {
    font-size: 12px;
  }

  .ap-footer>p {
    font-size: 14px;
  }

  .ap-trust {
    width: 100%;
    flex-wrap: wrap;
    gap: 15px 18px;
  }

  .ap-trust>span,
  .ap-trust>span:first-child,
  .ap-trust>span:last-child {
    padding: 0;
    font-size: 9px;
  }

  .ap-trust>span+span {
    border-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ap-button {
    transition: none;
  }

  .ap-button:hover {
    transform: none;
  }
}

.aura-gains {
  --ag-ink: #052a25;
  --ag-text: #506562;
  --ag-green: #12c982;
  --ag-before-bg: #e6e9e9;
  --ag-after-bg: #effbf6;
  --ag-line: #cbded7;

  padding: 30px 28px 24px;
  background: #fff;
  color: var(--ag-ink);
  font-family: "Inter", sans-serif;
}

.aura-gains *,
.aura-gains *::before,
.aura-gains *::after {
  box-sizing: border-box;
}

.aura-gains h2,
.aura-gains p {
  margin: 0;
}

.ag-icon-library {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.ag-container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
}

/* Heading and description */
.ag-header {
  padding-inline: 18px;
  margin-bottom: 20px;
}

.ag-eyebrow {
  margin-bottom: 7px !important;
  color: var(--ag-green);
  font-size: 14px;
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ag-header h2 {
  font-size: clamp(30px, 3.5vw, 57px);
  font-weight: 750;
  line-height: 1.12;
  letter-spacing: -0.045em;
}

.ag-description {
  margin-top: 10px !important;
  color: #697975;
  font-size: clamp(15px, 1.46vw, 24px);
  line-height: 1.33;
  letter-spacing: -0.012em;
}

/* Main comparison panel */
.ag-board {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px;
}

.ag-main {
  min-width: 0;
  background: linear-gradient(to right,
      var(--ag-before-bg) 0%,
      var(--ag-before-bg) 33.333%,
      var(--ag-after-bg) 33.333%,
      var(--ag-after-bg) 100%);
}

.ag-column-headings,
.ag-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
}

.ag-column-headings {
  min-height: 62px;
}

.ag-column-headings p {
  display: flex;
  align-items: center;
  padding: 16px 26px;
  color: #435c58;
  font-size: 17px;
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.ag-column-headings p+p {
  padding-left: 36px;
  border-left: 1px solid #bdd3ca;
  color: var(--ag-green);
}

.ag-row {
  min-height: 88px;
}

.ag-row+.ag-row {
  border-top: 1px solid var(--ag-line);
}

/* Before column */
.ag-before {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 25px;
  padding: 15px 25px;
}

.ag-before p {
  color: #596e69;
  font-size: clamp(13px, 1.12vw, 18px);
  line-height: 1.4;
  letter-spacing: -0.02em;
}

.ag-icon {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  overflow: visible;
  fill: none;
  stroke: #4a6560;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* After column */
.ag-after {
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr) 110px;
  align-items: center;
  gap: 18px;
  min-width: 0;
  padding: 15px 20px 15px 24px;
  border-left: 1px solid #bdd3ca;
}

.ag-transformation {
  display: grid;
  grid-template-columns: 60px 30px 65px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ag-mini {
  display: block;
  width: 43px;
  height: 40px;
  overflow: visible;
  margin-inline: auto;
  fill: none;
  stroke: #4e6f65;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ag-mini--wide {
  width: 65px;
}

.ag-mini--dotted {
  width: 60px;
  stroke-dasharray: 1 3;
}

.ag-mini--muted {
  color: #c0d3ca;
  stroke: currentColor;
}

.ag-mini--green {
  color: var(--ag-green);
  stroke: currentColor;
}

.ag-mini--bars {
  stroke-width: 4;
}

.ag-accent {
  stroke: var(--ag-green);
}

.ag-bolt {
  fill: var(--ag-green);
  stroke: none;
}

.ag-arrow {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: var(--ag-green);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ag-result {
  position: relative;
  padding-bottom: 13px;
  color: #12372d;
  font-size: clamp(13px, 1.12vw, 18px);
  font-weight: 650;
  line-height: 1.35;
  letter-spacing: -0.02em;
}

.ag-result::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 88px;
  height: 3px;
  background: var(--ag-green);
  content: "";
}

.ag-category {
  color: #22bd7d;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: 0.045em;
  text-align: right;
  text-transform: uppercase;
}

/* Dark green value strip */
.ag-value {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  padding: 40px 8px 25px;
  background: #00392b;
}

.ag-value svg {
  width: 48px;
  height: 64px;
  fill: none;
  stroke: #0ed583;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ag-value-line {
  width: 2px;
  height: 145px;
  margin-top: 16px;
  background: #078b58;
}

.ag-value p {
  margin-top: 22px;
  color: #d9ece3;
  font-size: 15px;
  font-weight: 750;
  line-height: 1.5;
  letter-spacing: 0.1em;
  text-align: center;
  text-transform: uppercase;
}

/* Closing statement */
.ag-closing {
  padding-inline: 18px;
  margin-top: 22px !important;
  font-size: clamp(23px, 2.1vw, 35px);
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: -0.045em;
}

/* Smaller desktop */
@media (max-width: 1300px) {
  .ag-board {
    grid-template-columns: minmax(0, 1fr) 90px;
  }

  .ag-after {
    grid-template-columns: 145px minmax(0, 1fr) 85px;
    gap: 12px;
    padding-inline: 16px;
  }

  .ag-transformation {
    grid-template-columns: 42px 24px 48px;
    gap: 8px;
  }

  .ag-mini {
    width: 35px;
    height: 35px;
  }

  .ag-mini--wide,
  .ag-mini--dotted {
    width: 47px;
  }

  .ag-arrow {
    width: 22px;
    height: 22px;
  }

  .ag-before {
    gap: 16px;
    padding-inline: 18px;
  }

  .ag-icon {
    width: 37px;
    height: 37px;
  }

  .ag-category {
    font-size: 10px;
  }

  .ag-value p {
    font-size: 12px;
  }

  .ag-column-headings p {
    font-size: 14px;
  }
}

/* Tablet */
@media (max-width: 1000px) {
  .aura-gains {
    padding: 32px 20px;
  }

  .ag-header,
  .ag-closing {
    padding-inline: 0;
  }

  .ag-header h2 {
    font-size: 38px;
  }

  .ag-description {
    font-size: 16px;
    line-height: 1.6;
  }

  .ag-board {
    grid-template-columns: minmax(0, 1fr) 72px;
  }

  .ag-after {
    grid-template-columns: 105px minmax(0, 1fr);
    gap: 10px 14px;
  }

  .ag-transformation {
    grid-template-columns: 30px 20px 35px;
    gap: 5px;
    grid-row: 1 / 3;
  }

  .ag-mini {
    width: 28px;
    height: 30px;
  }

  .ag-mini--wide,
  .ag-mini--dotted {
    width: 35px;
  }

  .ag-arrow {
    width: 19px;
    height: 19px;
  }

  .ag-result {
    font-size: 13px;
  }

  .ag-category {
    grid-column: 2;
    text-align: left;
  }

  .ag-before {
    gap: 12px;
    padding: 18px 12px;
  }

  .ag-before p {
    font-size: 13px;
  }

  .ag-icon {
    width: 31px;
    height: 31px;
  }

  .ag-column-headings p {
    padding-inline: 14px;
    font-size: 11px;
  }

  .ag-column-headings p+p {
    padding-left: 18px;
  }

  .ag-value {
    padding-top: 36px;
  }

  .ag-value svg {
    width: 35px;
  }

  .ag-value p {
    font-size: 10px;
    letter-spacing: 0.08em;
  }
}

/* Mobile: each before/after pair stays together */
@media (max-width: 650px) {
  .aura-gains {
    padding: 28px 16px;
  }

  .ag-eyebrow {
    font-size: 11px;
  }

  .ag-header h2 {
    font-size: 32px;
    line-height: 1.15;
  }

  .ag-description {
    font-size: 14px;
    line-height: 1.65;
  }

  .ag-board {
    display: block;
  }

  .ag-main {
    background: transparent;
  }

  .ag-column-headings {
    display: none;
  }

  .ag-row {
    grid-template-columns: 1fr;
    overflow: hidden;
    margin-bottom: 14px;
    border: 1px solid #d9e6df;
    border-radius: 14px;
  }

  .ag-row+.ag-row {
    border-top: 1px solid #d9e6df;
  }

  .ag-before {
    position: relative;
    min-height: 92px;
    gap: 15px;
    padding: 36px 18px 16px;
    background: var(--ag-before-bg);
  }

  .ag-before::before {
    position: absolute;
    top: 13px;
    left: 18px;
    color: #63736e;
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    content: "Without Agent Aura";
  }

  .ag-before p {
    font-size: 14px;
  }

  .ag-icon {
    width: 32px;
    height: 32px;
  }

  .ag-after {
    position: relative;
    grid-template-columns: 90px minmax(0, 1fr);
    gap: 10px 15px;
    padding: 40px 16px 18px;
    border-top: 1px solid #d3e5dc;
    border-left: 0;
    background: var(--ag-after-bg);
  }

  .ag-after::before {
    position: absolute;
    top: 15px;
    left: 16px;
    color: #10aa6d;
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    content: "With Agent Aura";
  }

  .ag-transformation {
    grid-template-columns: 28px 17px 31px;
    gap: 4px;
  }

  .ag-mini {
    width: 25px;
    height: 28px;
  }

  .ag-mini--wide,
  .ag-mini--dotted {
    width: 31px;
  }

  .ag-arrow {
    width: 17px;
  }

  .ag-result {
    font-size: 13px;
    line-height: 1.5;
  }

  .ag-result::after {
    width: 55px;
    height: 2px;
  }

  .ag-category {
    font-size: 9px;
  }

  .ag-value {
    flex-direction: row;
    justify-content: center;
    gap: 20px;
    padding: 18px;
    border-radius: 12px;
  }

  .ag-value svg {
    width: 27px;
    height: 40px;
  }

  .ag-value-line {
    width: 70px;
    height: 2px;
    margin: 0;
  }

  .ag-value p {
    margin: 0;
    font-size: 12px;
    text-align: left;
  }

  .ag-closing {
    margin-top: 22px !important;
    font-size: 25px;
    line-height: 1.35;
  }
}

.gs-journey {
  --gj-ink: #092c26;
  --gj-green: #0acb7e;
  --gj-muted: #71837d;
  --gj-label-width: 280px;
  --gj-band-height: 155px;

  padding: 40px 26px 32px;
  background: #fff;
  color: var(--gj-ink);
  font-family: "Inter", sans-serif;
}

.gs-journey *,
.gs-journey *::before,
.gs-journey *::after {
  box-sizing: border-box;
}

.gs-journey h2,
.gs-journey h3,
.gs-journey p {
  margin: 0;
}

.gj-icon-library {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.gj-container {
  max-width: 1300px;
  margin-inline: auto;
}

/* Header */
.gj-header {
  padding-inline: 22px;
  margin-bottom: 36px;
}

.gj-topline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 25px;
  margin-bottom: 13px;
}

.gj-eyebrow {
  color: #24c98d;
  font-size: 15px;
  font-weight: 750;
  line-height: 1.5;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.gj-note {
  color: #788580;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gj-header h2 {
  font-size: clamp(30px, 2.9vw, 48px);
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -0.045em;
}

.gj-description {
  max-width: 1390px;
  margin-top: 17px !important;
  color: #6e7b75;
  font-size: clamp(15px, 1.39vw, 23px);
  line-height: 1.35;
  letter-spacing: -0.012em;
}

/* Horizontally scrollable diagram */
.gj-scroll {
  overflow-x: auto;
  padding-bottom: 8px;
  scrollbar-width: thin;
  scrollbar-color: #a9d9c3 #f1f8f4;
}

.gj-scroll:focus-visible {
  outline: 2px solid var(--gj-green);
  outline-offset: 4px;
  border-radius: 14px;
}

.gj-diagram {
  min-width: 1180px;
}

/* Top and bottom bands */
.gj-band {
  display: grid;
  grid-template-columns: var(--gj-label-width) minmax(0, 1fr);
  height: var(--gj-band-height);
  border-radius: 15px;
}

.gj-band--team {
  background: #f2f5f3;
}

.gj-band--growthspell {
  background: #ecfbf4;
}

.gj-band-label {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 25px;
}

.gj-band-label h3 {
  font-size: 20px;
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}

.gj-band-label p {
  margin-top: 5px;
  color: #799087;
  font-size: 14px;
  line-height: 1.4;
  white-space: nowrap;
}

/* Client input track */
.gj-team-track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  height: 100%;
  margin-right: 25px;
}

.gj-team-track::before {
  position: absolute;
  top: 95px;
  right: 0;
  left: 0;
  height: 2px;
  background: #bccbc4;
  content: "";
}

.gj-team-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 14px;
  padding-top: 34px;
}

.gj-team-item::after {
  position: absolute;
  top: 89px;
  left: 50%;
  width: 13px;
  height: 13px;
  border: 2px solid #f2f5f3;
  border-radius: 50%;
  background: #1a5c48;
  transform: translateX(-50%);
  content: "";
}

.gj-team-item svg,
.gj-delivery-item svg {
  width: 29px;
  height: 29px;
  flex: 0 0 auto;
  overflow: visible;
  fill: none;
  stroke: #245b49;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gj-team-item p {
  color: #31594a;
  font-size: 14px;
  line-height: 1.3;
}

/* Middle journey */
.gj-middle {
  display: grid;
  grid-template-columns: var(--gj-label-width) minmax(0, 1fr);
  height: 190px;
}

.gj-middle-label {
  align-self: center;
  padding-left: 25px;
  color: #798680;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.3;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gj-timeline {
  position: relative;
  margin-right: 25px;
}

.gj-wave {
  position: absolute;
  top: 27px;
  left: 0;
  width: 100%;
  height: 100px;
  overflow: visible;
}

.gj-wave-baseline {
  fill: none;
  stroke: #b4d2c3;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.gj-wave-early {
  fill: none;
  stroke: #9edbc0;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.gj-wave-filled {
  fill: url(#gj-wave-fill);
  stroke: #8ce3bb;
  stroke-width: 0.6;
}

/* Milestone alignment */
.gj-milestone {
  position: absolute;
  top: 55px;
  width: 245px;
  text-align: center;
  transform: translateX(-50%);
}

.gj-milestone--discovery,
.gj-guide--discovery {
  left: 6%;
}

.gj-milestone--pilot,
.gj-guide--pilot {
  left: 39.6%;
}

.gj-milestone--live,
.gj-guide--live {
  left: 62.5%;
}

.gj-milestone--review,
.gj-guide--review {
  left: 89.5%;
}

.gj-node {
  position: relative;
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  margin-inline: auto;
  border: 1px solid #8abfa9;
  border-radius: 50%;
  background: rgba(248, 255, 251, 0.97);
}

.gj-node i {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #32765c;
}

.gj-node--live {
  width: 59px;
  height: 59px;
  margin-top: -7px;
  margin-bottom: -6px;
  border: 4px solid #0ccc7c;
  background: #e4fff0;
}

.gj-node--live i {
  width: 40px;
  height: 40px;
  background: #004631;
}

.gj-milestone h3 {
  margin-top: 10px;
  color: #254d3e;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.3;
  text-transform: uppercase;
}

.gj-milestone p {
  margin-top: 3px;
  color: #829087;
  font-size: 12px;
  line-height: 1.4;
}

/* Dashed links across rows */
.gj-guide {
  position: absolute;
  top: -60px;
  bottom: -40px;
  width: 1px;
  background: repeating-linear-gradient(to bottom,
      #afc9bb 0,
      #afc9bb 7px,
      transparent 7px,
      transparent 13px);
}

.gj-guide--live {
  top: 4px;
}

/* Recurring review loop */
.gj-review-loop {
  position: absolute;
  top: 22px;
  right: -16px;
  width: 108px;
  height: 108px;
  transform: translateX(22%);
}

.gj-review-loop svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: #53c899;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gj-review-loop p {
  position: absolute;
  inset: 0;
  display: grid;
  align-content: center;
  padding-left: 5px;
  color: #375c4d;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.25;
  text-align: center;
  text-transform: uppercase;
}

/* GrowthSpell delivery track */
.gj-delivery-track {
  position: relative;
  height: 100%;
  margin-right: 25px;
}

.gj-delivery-track::before {
  position: absolute;
  top: 40px;
  right: 0;
  left: 0;
  height: 1px;
  background: #9dddc0;
  content: "";
}

.gj-delivery-item {
  position: absolute;
  top: 57px;
  left: var(--gj-position);
  display: flex;
  width: 130px;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  transform: translateX(-50%);
}

.gj-delivery-item::before {
  position: absolute;
  top: -23px;
  left: 50%;
  width: 13px;
  height: 13px;
  border: 2px solid #ecfbf4;
  border-radius: 50%;
  background: #0acb7e;
  transform: translateX(-50%);
  content: "";
}

.gj-delivery-item p {
  color: #2b5744;
  font-size: 14px;
  line-height: 1.3;
  text-align: center;
}

.gj-delivery-item--analytics svg {
  stroke: #0bb77a;
  stroke-width: 3;
}

/* Bottom statement */
.gj-closing {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-top: 42px;
  padding-inline: 22px;
}

.gj-closing>span {
  height: 1px;
  flex: 1;
  background: #bfcfc6;
}

.gj-closing p {
  color: #284d3f;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -0.02em;
  text-align: center;
}

.gj-mobile-hint {
  display: none;
}

/* Compact desktop */
@media (max-width: 1400px) {
  .gs-journey {
    --gj-label-width: 235px;
  }

  .gj-band-label {
    padding-left: 20px;
  }

  .gj-band-label h3 {
    font-size: 18px;
  }

  .gj-band-label p {
    font-size: 11px;
  }

  .gj-team-item {
    gap: 9px;
  }

  .gj-team-item p,
  .gj-delivery-item p {
    font-size: 12px;
  }

  .gj-team-item svg,
  .gj-delivery-item svg {
    width: 26px;
    height: 26px;
  }

  .gj-milestone {
    width: 215px;
  }

  .gj-milestone h3 {
    font-size: 12px;
  }

  .gj-milestone p {
    font-size: 10px;
  }

  .gj-review-loop {
    width: 90px;
    height: 90px;
    top: 31px;
    right: 0;
  }

  .gj-review-loop p {
    font-size: 9px;
  }
}

@media (max-width: 1200px) {
  .gj-mobile-hint {
    display: block;
    margin-top: 10px !important;
    color: #52816b;
    font-size: 12px;
    text-align: center;
  }
}

/* Mobile typography; diagram scrolls without breaking alignment */
@media (max-width: 700px) {
  .gs-journey {
    padding: 30px 16px;
  }

  .gj-header {
    padding-inline: 0;
    margin-bottom: 25px;
  }

  .gj-topline {
    flex-direction: column;
    gap: 12px;
  }

  .gj-eyebrow {
    font-size: 11px;
  }

  .gj-note {
    font-size: 9px;
  }

  .gj-header h2 {
    font-size: 31px;
    line-height: 1.18;
  }

  .gj-description {
    margin-top: 15px !important;
    font-size: 14px;
    line-height: 1.65;
  }

  .gj-closing {
    gap: 12px;
    margin-top: 26px;
    padding: 0;
  }

  .gj-closing>span {
    flex: 0 0 15px;
  }

  .gj-closing p {
    font-size: 14px;
    line-height: 1.6;
  }
}

.aura-testimonial {
  --at-ink: #062d25;
  --at-green: #06d77a;
  --at-muted: #718a80;

  padding: 80px 48px 40px;
  overflow: hidden;
  background: #fff;
  color: var(--at-ink);
  font-family: "Inter", sans-serif;
}

.aura-testimonial *,
.aura-testimonial *::before,
.aura-testimonial *::after {
  box-sizing: border-box;
}

.aura-testimonial p,
.aura-testimonial figure,
.aura-testimonial blockquote {
  margin: 0;
}

.at-container {
  position: relative;
  max-width: 1300px;
  margin-inline: auto;
  isolation: isolate;
}

/* Faint background word */
.at-watermark {
  position: absolute;
  z-index: -1;
  top: -85px;
  right: -24px;

  color: #f0f7f3;
  font-family: "Inter", sans-serif;
  font-size: clamp(100px, 15vw, 240px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.045em;
  pointer-events: none;
  user-select: none;
}

.at-eyebrow {
  margin: 0 0 24px 24px !important;
  color: var(--at-green);
  font-size: 14px;
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

/* Testimonial typography */
.at-quote-opening,
.at-quote-closing {
  color: var(--at-ink);
  font-size: clamp(24px, 3.2vw, 48px);
  font-weight: 650;
  line-height: 1.18;
  letter-spacing: -0.045em;
}

.at-quote-opening {
  padding-left: 24px;
}

.at-quote-closing {
  padding-left: 48px;
  margin-top: 30px !important;
}

/* Voice preview + waveform + client */
.at-voice-row {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr) 220px;
  align-items: center;
  gap: 16px;
  margin-top: 30px;
}

.at-voice-preview {
  display: flex;
  align-items: center;
  gap: 16px;
}

.at-play {
  position: relative;
  display: grid;
  width: 64px;
  height: 64px;
  flex: 0 0 auto;
  place-items: center;

  border: 8px solid #d6fbe7;
  border-radius: 50%;
  background: #a0f0c3;
  box-shadow:
    0 0 0 2px #effcf4,
    0 0 0 10px #f2fcf6;
}

.at-play::before {
  position: absolute;
  inset: 0;
  border: 2px solid rgba(255, 255, 255, 0.95);
  border-radius: inherit;
  content: "";
}

.at-play svg {
  width: 18px;
  height: 18px;
  margin-left: 4px;
  fill: #063727;
}

.at-voice-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.at-voice-label strong {
  color: #6b857b;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: 0.1em;
  white-space: nowrap;
  text-transform: uppercase;
}

.at-voice-label span {
  color: #7c9288;
  font-size: 11px;
}

/* Included waveform */
.at-waveform {
  display: flex;
  min-width: 0;
  height: 70px;
  align-items: center;
  justify-content: space-between;
  gap: 3px;
}

.at-waveform span {
  display: block;
  width: 4px;
  height: var(--at-bar-height);
  min-width: 1px;
  max-width: 4px;
  flex: 1 1 0;
  border-radius: 4px;
  background: var(--at-green);
}

/* Client attribution */
.at-client {
  display: flex;
  align-items: center;
  gap: 14px;
}

.at-avatar {
  position: relative;
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: #e1f7e9;
  color: #103c2b;
  font-size: 18px;
  font-weight: 650;
}

.at-avatar i {
  position: absolute;
  top: 1px;
  right: -1px;
  width: 13px;
  height: 13px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--at-green);
}

.at-client-details {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.at-client-details strong {
  color: #173f2f;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
}

.at-client-details>span {
  color: #799087;
  font-size: 12px;
  line-height: 1.4;
}

/* Discovery → Build → Deployment → Partnership */
.at-journey {
  display: flex;
  width: min(940px, calc(100% - 80px));
  align-items: center;
  gap: 40px;
  margin: 40px 0 0 40px;
  padding: 0;
  list-style: none;
}

.at-journey li {
  display: flex;
  min-width: 0;
  flex: 1;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.at-journey li:last-child {
  flex: 0 0 auto;
}

.at-journey span {
  color: #64867a;
  font-size: 16px;
  font-weight: 650;
  line-height: 1.4;
}

.at-journey li:last-child span {
  color: var(--at-green);
}

.at-journey svg {
  width: 54px;
  height: 16px;
  flex: 0 0 auto;
  fill: none;
  stroke: #9cb8ad;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Internal note from reference */
.at-content-note {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-top: 60px;
  padding: 24px 30px 0;
  border-top: 1px solid #d5e2db;
}

.at-content-note strong {
  flex: 0 0 auto;
  padding-right: 24px;
  border-right: 1px solid #ccdcd2;
  color: #7e968b;
  font-size: 9px;
  font-weight: 750;
  line-height: 2;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.at-content-note p {
  color: #98a6ab;
  font-size: 13px;
  line-height: 1.5;
}

/* Smaller desktop */
@media (max-width: 1250px) {
  .aura-testimonial {
    padding: 100px 40px 40px;
  }

  .at-watermark {
    top: -75px;
  }

  .at-voice-row {
    grid-template-columns: 180px minmax(0, 1fr) 215px;
    gap: 15px;
  }

  .at-voice-preview {
    gap: 17px;
  }

  .at-play {
    width: 70px;
    height: 70px;
    border-width: 8px;
  }

  .at-avatar {
    width: 52px;
    height: 52px;
    font-size: 19px;
  }

  .at-client {
    gap: 13px;
  }

  .at-client-details strong {
    font-size: 16px;
  }

  .at-client-details>span {
    font-size: 12px;
  }

  .at-journey {
    gap: 35px;
  }

  .at-journey li {
    gap: 20px;
  }

  .at-journey span {
    font-size: 17px;
  }

  .at-journey svg {
    width: 55px;
  }
}

/* Tablet */
@media (max-width: 900px) {
  .aura-testimonial {
    padding: 70px 28px 32px;
  }

  .at-eyebrow,
  .at-quote-opening,
  .at-quote-closing {
    padding-left: 0;
    margin-left: 0 !important;
  }

  .at-eyebrow {
    font-size: 13px;
    margin-bottom: 22px !important;
  }

  .at-quote-opening,
  .at-quote-closing {
    font-size: 40px;
  }

  .at-desktop-break {
    display: none;
  }

  .at-voice-row {
    grid-template-columns: 175px minmax(0, 1fr);
    margin-top: 30px;
  }

  .at-client {
    grid-column: 1 / -1;
    justify-self: end;
    margin-top: 5px;
  }

  .at-waveform {
    gap: 2px;
  }

  .at-quote-closing {
    margin-top: 28px !important;
  }

  .at-journey {
    width: 100%;
    gap: 20px;
    margin: 35px 0 0;
  }

  .at-journey li {
    gap: 12px;
  }

  .at-journey span {
    font-size: 15px;
  }

  .at-journey svg {
    width: 35px;
  }

  .at-content-note {
    align-items: flex-start;
    gap: 20px;
    margin-top: 60px;
    padding-inline: 0;
  }

  .at-content-note strong {
    padding-right: 20px;
  }

  .at-content-note p {
    font-size: 12px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .aura-testimonial {
    padding: 50px 20px 28px;
  }

  .at-watermark {
    top: -25px;
    right: -10px;
    font-size: 125px;
    color: #f2f8f4;
  }

  .at-quote-opening,
  .at-quote-closing {
    font-size: 31px;
    line-height: 1.25;
    letter-spacing: -0.04em;
  }

  .at-voice-row {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .at-voice-preview {
    gap: 20px;
    padding-left: 10px;
  }

  .at-play {
    width: 62px;
    height: 62px;
    border-width: 7px;
    box-shadow: 0 0 0 8px #f2fcf6;
  }

  .at-play svg {
    width: 21px;
    height: 21px;
  }

  .at-waveform {
    height: 100px;
    gap: 2px;
  }

  .at-client {
    grid-column: auto;
    justify-self: start;
    margin-top: 0;
  }

  .at-client-details strong {
    font-size: 16px;
  }

  .at-client-details>span {
    font-size: 13px;
  }

  .at-quote-closing {
    margin-top: 30px !important;
  }

  .at-journey {
    flex-wrap: wrap;
    gap: 20px 12px;
    margin-top: 30px;
  }

  .at-journey li {
    flex: 0 0 calc(50% - 6px);
    justify-content: flex-start;
    gap: 15px;
  }

  .at-journey li:last-child {
    flex: 0 0 calc(50% - 6px);
  }

  .at-journey span {
    font-size: 14px;
  }

  .at-journey svg {
    width: 30px;
  }

  .at-content-note {
    flex-direction: column;
    gap: 10px;
    margin-top: 40px;
    padding-top: 22px;
  }

  .at-content-note strong {
    padding-right: 0;
    border-right: 0;
    font-size: 9px;
  }
}

.aura-call-cta {
  --acc-green: #03dc83;
  --acc-white: #f3fbf6;
  --acc-muted: #b3cbc0;

  padding: 60px 40px;
  background: #fff;
  font-family: "Inter", sans-serif;
}

.aura-call-cta *,
.aura-call-cta *::before,
.aura-call-cta *::after {
  box-sizing: border-box;
}

.aura-call-cta h2,
.aura-call-cta h3,
.aura-call-cta p {
  margin: 0;
}

.acc-card {
  position: relative;
  max-width: 1300px;
  margin-inline: auto;
  overflow: hidden;
  padding: 30px 40px 20px;

  border: 1px solid #376354;
  border-top: 4px solid var(--acc-green);
  border-radius: 24px;

  background:
    radial-gradient(ellipse at 74% 44%,
      rgba(10, 110, 67, 0.19),
      transparent 45%),
    linear-gradient(110deg, #032a20, #042b21);

  color: var(--acc-white);
}

/* Content and graphic */
.acc-main {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  align-items: center;
  gap: 24px;
  min-height: 480px;
}

.acc-content {
  position: relative;
  z-index: 2;
  padding-block: 20px;
}

.acc-eyebrow {
  margin-bottom: 20px !important;
  color: var(--acc-green);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}

.acc-content h2 {
  font-size: clamp(28px, 3.5vw, 54px);
  font-weight: 700;
  line-height: 1.07;
  letter-spacing: -0.045em;
}

.acc-description {
  max-width: 600px;
  margin-top: 20px !important;
  color: var(--acc-muted);
  font-size: clamp(14px, 1.3vw, 18px);
  line-height: 1.45;
  letter-spacing: -0.015em;
}

/* Buttons */
.acc-actions {
  display: flex;
  align-items: stretch;
  gap: 16px;
  margin-top: 30px;
}

.acc-button {
  display: inline-flex;
  min-height: 60px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 14px 20px;
  border: 2px solid transparent;
  border-radius: 12px;

  font-size: clamp(14px, 1.3vw, 18px);
  font-weight: 650;
  line-height: 1.3;
  letter-spacing: -0.025em;
  text-align: center;
  text-decoration: none;

  transition: background 180ms ease, border-color 180ms ease;
}

.acc-button--primary {
  flex: 1.6;
  background: var(--acc-green);
  color: #032c20;
}

.acc-button--primary:hover {
  background: #30eca0;
}

.acc-button--secondary {
  flex: 1;
  border-color: #b4cec0;
  background: #042c22;
  color: #f1fbf5;
}

.acc-button--secondary:hover {
  border-color: var(--acc-green);
  background: #0b3d2e;
}

.acc-button svg {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.acc-button:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 5px;
}

/* Circular graphic */
.acc-visual {
  position: relative;
  width: 100%;
  max-width: 480px;
  aspect-ratio: 1;
  justify-self: center;
  isolation: isolate;
}

.acc-orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.acc-orbit--outer {
  width: 98%;
  height: 98%;
  border: 2px dotted rgba(3, 220, 131, 0.48);
}

.acc-orbit--middle {
  width: 83%;
  height: 83%;
  border: 1px solid rgba(13, 171, 105, 0.34);
  background: rgba(10, 112, 64, 0.055);
}

.acc-orbit--inner {
  width: 61%;
  height: 61%;
  border: 2px solid rgba(3, 220, 131, 0.45);
  background: radial-gradient(circle,
      rgba(22, 172, 93, 0.16),
      rgba(3, 75, 44, 0.18));
  box-shadow: inset 0 0 35px rgba(3, 220, 131, 0.07);
}

.acc-connector {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.acc-connector path {
  fill: none;
  stroke: var(--acc-green);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.acc-call-line {
  stroke-dasharray: 7 5;
  opacity: 0.65;
}

.acc-connector circle {
  fill: var(--acc-green);
}

.acc-connector .acc-entry-dot {
  fill: #b2ddc9;
}

/* Incoming call at the top */
.acc-next-call {
  position: absolute;
  z-index: 3;
  top: -1%;
  left: 50%;
  display: flex;
  align-items: center;
  gap: 12px;
  transform: translateX(-24px);
  white-space: nowrap;
}

.acc-phone {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  place-items: center;
  border: 2px solid #bedac9;
  border-radius: 50%;
  background: #073b28;
}

.acc-phone svg {
  width: 20px;
  height: 20px;
  fill: #fff;
}

.acc-next-call>span:last-child {
  color: #d1e4d7;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}

/* Answered / qualified / booked markers */
.acc-status {
  position: absolute;
  z-index: 4;
  display: flex;
  align-items: center;
  gap: 12px;
}

.acc-status i {
  display: block;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  border: 3px solid #003f2b;
  border-radius: 50%;
  background: var(--acc-green);
  box-shadow:
    0 0 0 2px rgba(3, 220, 131, 0.7),
    0 0 17px rgba(3, 220, 131, 0.3);
}

.acc-status span {
  color: #d2e6d9;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.3;
  text-transform: uppercase;
}

.acc-status--answered {
  top: 19.5%;
  left: 50%;
  transform: translate(-10px, -50%);
}

.acc-status--qualified {
  top: 50%;
  left: 80.5%;
  transform: translate(-10px, -50%);
}

.acc-status--booked {
  top: 80.5%;
  left: 50%;
  flex-direction: column;
  gap: 8px;
  transform: translate(-50%, -10px);
}

/* Agent Aura centre */
.acc-core {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;

  display: flex;
  width: 46%;
  height: 46%;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  border: 2px solid #438d69;
  border-radius: 50%;
  background: #03281f;
  transform: translate(-50%, -50%);
}

.acc-core h3 {
  color: #e3f1e8;
  font-size: clamp(10px, 1.1vw, 15px);
  font-weight: 650;
  line-height: 1.3;
  text-transform: uppercase;
}

.acc-live {
  margin-top: 3px !important;
  color: var(--acc-green);
  font-size: clamp(9px, 1vw, 14px);
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
}

.acc-wave {
  display: flex;
  width: 74%;
  height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 3px;
  margin-top: 5px;
}

.acc-wave span {
  width: 3px;
  height: var(--acc-height);
  flex: 0 1 3px;
  border-radius: 3px;
  background: #0bdc86;
}

.acc-wave span:first-child,
.acc-wave span:last-child {
  background: #65997f;
}

.acc-wave .acc-wave-white {
  background: #d3f4e3;
}

.acc-ready {
  margin-top: 6px !important;
  color: #aac7b6;
  font-size: clamp(7px, 0.75vw, 11px);
  font-weight: 600;
  line-height: 1.3;
  text-transform: uppercase;
}

.acc-timer {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px !important;
  color: #cadfd1;
  font-size: 12px;
}

.acc-timer i {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--acc-green);
}

/* Bottom feature strip */
.acc-features {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #1b5944;
}

.acc-features>div {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding-inline: 15px;
}

.acc-features>div+div {
  border-left: 1px solid #557567;
}

.acc-features svg {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  fill: none;
  stroke: #d2e9db;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.acc-features span {
  color: #d1e4d9;
  font-size: 14px;
  line-height: 1.4;
}

/* Compact desktop */
@media (max-width: 1250px) {
  .aura-call-cta {
    padding: 65px 32px;
  }

  .acc-card {
    padding: 35px 40px 28px;
  }

  .acc-main {
    min-height: 460px;
    gap: 20px;
  }

  .acc-actions {
    gap: 14px;
  }

  .acc-button {
    min-height: 64px;
    padding: 15px 18px;
    font-size: 16px;
  }

  .acc-next-call>span:last-child {
    font-size: 11px;
  }

  .acc-phone {
    width: 44px;
    height: 44px;
  }

  .acc-next-call {
    transform: translateX(-22px);
    gap: 10px;
  }

  .acc-status span {
    font-size: 10px;
  }

  .acc-status {
    gap: 10px;
  }

  .acc-core {
    width: 45%;
    height: 45%;
  }

  .acc-wave {
    height: 52px;
    transform: scaleY(0.85);
    margin-top: 0;
  }

  .acc-timer {
    font-size: 12px;
    margin-top: 7px !important;
  }

  .acc-features>div {
    gap: 14px;
  }

  .acc-features span {
    font-size: 14px;
  }
}

/* Tablet */
@media (max-width: 950px) {
  .acc-card {
    padding: 40px 35px 28px;
  }

  .acc-main {
    grid-template-columns: 1fr;
    gap: 40px;
    min-height: 0;
  }

  .acc-content {
    padding: 0;
  }

  .acc-content h2 {
    font-size: clamp(38px, 6vw, 58px);
  }

  .acc-description {
    max-width: 660px;
    font-size: 18px;
  }

  .acc-eyebrow {
    margin-bottom: 22px !important;
  }

  .acc-actions {
    max-width: 650px;
    margin-top: 28px;
  }

  .acc-visual {
    width: min(100%, 500px);
    margin-top: 15px;
    margin-bottom: 10px;
  }

  .acc-entry-line {
    display: none;
  }

  .acc-core h3 {
    font-size: 17px;
  }

  .acc-live {
    font-size: 16px;
  }

  .acc-ready {
    font-size: 11px;
  }

  .acc-wave {
    transform: none;
    height: 62px;
  }

  .acc-next-call>span:last-child {
    font-size: 12px;
  }

  .acc-status span {
    font-size: 11px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .aura-call-cta {
    padding: 40px 16px;
  }

  .acc-card {
    padding: 30px 22px 24px;
    border-radius: 23px;
  }

  .acc-main {
    gap: 35px;
  }

  .acc-eyebrow {
    font-size: 15px;
  }

  .acc-content h2 {
    font-size: clamp(31px, 7.9vw, 44px);
    line-height: 1.13;
  }

  .acc-description {
    margin-top: 20px !important;
    font-size: 15px;
    line-height: 1.65;
  }

  .acc-actions {
    flex-direction: column;
    gap: 12px;
    margin-top: 25px;
  }

  .acc-button {
    min-height: 57px;
    flex: auto;
    font-size: 15px;
    border-radius: 12px;
  }

  .acc-visual {
    width: 100%;
    max-width: 360px;
  }

  .acc-next-call {
    gap: 8px;
  }

  .acc-next-call>span:last-child {
    font-size: 9px;
  }

  .acc-phone {
    width: 40px;
    height: 40px;
  }

  .acc-phone svg {
    width: 20px;
    height: 20px;
  }

  .acc-next-call {
    transform: translateX(-20px);
  }

  .acc-status {
    gap: 6px;
  }

  .acc-status i {
    width: 19px;
    height: 19px;
  }

  .acc-status span {
    font-size: 8px;
  }

  .acc-status--answered,
  .acc-status--qualified {
    transform: translate(-9.5px, -50%);
  }

  .acc-status--booked {
    transform: translate(-50%, -9.5px);
  }

  .acc-core {
    width: 45%;
    height: 45%;
  }

  .acc-core h3 {
    font-size: 12px;
  }

  .acc-live {
    font-size: 11px;
  }

  .acc-wave {
    height: 40px;
    gap: 2px;
    margin-block: -3px;
    transform: scaleY(0.6);
  }

  .acc-ready {
    margin-top: 3px !important;
    font-size: 7px;
  }

  .acc-timer {
    gap: 6px;
    margin-top: 6px !important;
    font-size: 10px;
  }

  .acc-timer i {
    width: 8px;
    height: 8px;
  }

  .acc-features {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 15px;
    padding-top: 22px;
  }

  .acc-features>div {
    justify-content: flex-start;
    gap: 15px;
    padding: 0;
  }

  .acc-features>div+div {
    border-left: 0;
  }

  .acc-features svg {
    width: 27px;
    height: 27px;
  }

  .acc-features span {
    font-size: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .acc-button {
    transition: none;
  }
}

/* =========================================================
   FREQUENTLY ASKED QUESTIONS (FAQ)
========================================================= */
.gs-faq-section {
  --faq-green: #00d977;
  --faq-green-dark: #00be68;
  --faq-deep-green: #06271e;
  --faq-dark: #071814;
  --faq-text: #5d6a66;
  --faq-border: #dce7e2;
  --faq-soft: #f3f8f5;
  --faq-white: #ffffff;

  position: relative;
  width: 100%;
  padding: 80px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 10% 20%, rgba(0, 217, 119, 0.05), transparent 25%),
    linear-gradient(135deg, #f8fbf9 0%, #ffffff 55%, #f5faf7 100%);
  font-family: "Inter", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.gs-faq-container {
  display: grid;
  grid-template-columns: minmax(280px, 0.82fr) minmax(440px, 1.18fr);
  gap: clamp(30px, 4.5vw, 70px);
  width: min(1300px, calc(100% - 96px));
  max-width: 1300px;
  margin: 0 auto;
}

.gs-faq-intro {
  position: relative;
  align-self: start;
  padding-top: 5px;
}

.gs-faq-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--faq-green-dark);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.gs-faq-eyebrow::before {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: var(--faq-green);
  content: "";
}

.gs-faq-intro h2 {
  max-width: 530px;
  margin: 0;
  color: var(--faq-deep-green);
  font-size: clamp(26px, 2.3vw, 36px);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.04em;
}

.gs-faq-intro > p {
  max-width: 440px;
  margin: 14px 0 0;
  color: var(--faq-text);
  font-size: 14px;
  line-height: 1.6;
}

.gs-faq-contact {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  color: var(--faq-deep-green);
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
}

.gs-faq-contact:hover {
  color: var(--faq-green-dark);
}

.gs-faq-contact-icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #e6f7f0;
  color: var(--faq-green-dark);
}

.gs-faq-contact-icon svg {
  width: 16px;
  height: 16px;
}

.gs-faq-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.gs-faq-item {
  border: 1px solid var(--faq-border);
  border-radius: 12px;
  background: var(--faq-white);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  overflow: hidden;
}

.gs-faq-item[open] {
  border-color: var(--faq-green-dark);
  box-shadow: 0 4px 20px rgba(0, 190, 104, 0.08);
}

.gs-faq-summary {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  cursor: pointer;
  list-style: none;
  font-weight: 600;
  color: var(--faq-deep-green);
  user-select: none;
}

.gs-faq-summary::-webkit-details-marker {
  display: none;
}

.gs-faq-number {
  font-size: 13px;
  font-weight: 700;
  color: var(--faq-green-dark);
  opacity: 0.8;
}

.gs-faq-question {
  flex: 1;
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 1.4;
}

.gs-faq-toggle {
  position: relative;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.gs-faq-toggle::before,
.gs-faq-toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: var(--faq-deep-green);
  transition: transform 0.2s ease;
}

.gs-faq-toggle::before {
  width: 12px;
  height: 2px;
  margin-top: -1px;
  margin-left: -6px;
}

.gs-faq-toggle::after {
  width: 2px;
  height: 12px;
  margin-top: -6px;
  margin-left: -1px;
}

.gs-faq-item[open] .gs-faq-toggle::after {
  transform: rotate(90deg);
  opacity: 0;
}

.gs-faq-answer {
  padding: 0 24px 20px 53px;
  color: var(--faq-text);
  font-size: 14.5px;
  line-height: 1.65;
}

.gs-faq-answer p {
  margin: 0;
}

@media (max-width: 900px) {
  .gs-faq-container {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}