/* The public software and workspace tour share a brighter visual language. */
body.software-services-page {
  background: #fff;
}

body.software-services-page .lm-product-hero {
  min-height: 0;
  padding: clamp(62px, 6vw, 96px) 0 clamp(80px, 8vw, 124px) !important;
  background: #fff !important;
}

body.software-services-page .lm-product-hero::before {
  display: block;
  z-index: 0;
  opacity: .72;
  background-image:
    linear-gradient(#1b29200b 1px, transparent 1px),
    linear-gradient(90deg, #1b29200b 1px, transparent 1px),
    linear-gradient(#1b292007 1px, transparent 1px),
    linear-gradient(90deg, #1b292007 1px, transparent 1px);
  background-size: 72px 72px, 72px 72px, 12px 12px, 12px 12px;
  mask-image: linear-gradient(90deg, transparent 12%, #000 74%);
}

body.software-services-page .lm-product-hero::after {
  content: "";
  position: absolute;
  z-index: 0;
  width: min(72vw, 880px);
  aspect-ratio: 1;
  top: -38%;
  right: -16%;
  border-radius: 50%;
  background: conic-gradient(from 32deg, #c1f58e, #8ac9e8 18%, #8789ed 38%, #d3a0dd 58%, #ffae89 80%, #c1f58e);
  filter: blur(1px);
  opacity: .62;
  pointer-events: none;
  animation: ss-orb-drift 16s ease-in-out infinite alternate;
}

body.software-services-page .lm-product-hero-grid {
  position: relative;
  z-index: 1;
  grid-template-columns: minmax(310px, .8fr) minmax(0, 1.2fr);
  gap: clamp(32px, 4vw, 72px);
}

body.software-services-page .lm-product-copy h1 {
  font-size: clamp(54px, 6.3vw, 96px);
}

body.software-services-page .lm-product-lead {
  color: #414b44;
}

body.software-services-page .lm-product-window {
  box-shadow: 0 34px 85px #172a2a22, 0 0 0 12px #fff9;
}

body.software-services-page .ss-overview-window::after {
  display: none;
}

.ss-overview-window .lm-window-bar {
  border-bottom: 1px solid #ffffff22;
}

.ss-overview-window .lm-window-bar em {
  padding: 5px 9px;
  border: 1px solid #b7ec8c77;
  border-radius: 30px;
  color: #c9f7ad;
  font: 700 9px/1 'Instrument Sans', Arial, sans-serif;
  font-style: normal;
  letter-spacing: .02em;
}

.ss-overview-window .lm-window-bar small {
  margin-left: auto;
}

.ss-overview {
  display: grid;
  grid-template-columns: 143px minmax(0, 1fr);
  min-height: 430px;
  color: #18211e;
  font-family: 'Instrument Sans', Arial, sans-serif;
}

.ss-overview-rail {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 20px 11px 16px;
  background: #17251f;
  color: #eff9ed;
}

.ss-overview-brand {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 35px 3px;
  font-size: 11px;
  letter-spacing: -.035em;
}

body.software-services-page .ss-overview-brand img {
  width: 24px !important;
  height: 24px !important;
  aspect-ratio: 1 !important;
  object-fit: contain !important;
}

.ss-overview-rail-label {
  padding: 0 10px 7px;
  color: #a3baad;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .14em;
}

.ss-overview-rail > div:not(.ss-overview-brand) {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 8px;
  border-radius: 6px;
  color: #d7e0da;
  font-size: 10px;
  font-weight: 650;
}

.ss-overview-rail > div.is-active {
  background: #b6ee86;
  color: #14231c;
}

.ss-overview-rail > div > span {
  width: 14px;
  font-size: 15px;
  text-align: center;
}

.ss-overview-rail-footer {
  margin-top: auto;
  padding: 12px 4px 0;
  border-top: 1px solid #ffffff22;
  color: #a7c4b1;
  font-size: 8px;
}

.ss-overview-main {
  padding: clamp(17px, 2vw, 30px);
  background: #f7f8f4;
}

.ss-overview-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 21px;
}

.ss-overview-heading small,
.ss-overview-card-heading > span,
.ss-overview-chart-foot {
  color: #68786b;
  font-size: 8px;
  font-weight: 750;
  letter-spacing: .08em;
}

.ss-overview-heading h2 {
  margin: 6px 0 3px;
  color: #18211e;
  font-size: clamp(23px, 2.5vw, 34px);
  font-weight: 700;
  letter-spacing: -.06em;
  line-height: 1.05;
}

.ss-overview-heading p {
  margin: 0;
  color: #6b746c;
  font-size: 10px;
}

.ss-overview-live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 8px;
  border: 1px solid #b2d4b5;
  border-radius: 30px;
  background: #ecf9e7;
  color: #356342;
  white-space: nowrap;
  font-size: 8px;
  font-weight: 750;
}

.ss-overview-live i,
.ss-track-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #6eca55;
  box-shadow: 0 0 0 4px #6eca5527;
}

.ss-overview-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-bottom: 10px;
}

.ss-overview-stats > div {
  display: flex;
  flex-direction: column;
  min-height: 92px;
  padding: 12px;
  border: 1px solid #dbe1d8;
  border-radius: 9px;
  background: #fff;
}

.ss-overview-stats > div:nth-child(2) {
  background: #ecf7dd;
}

.ss-overview-stats > div:nth-child(3) {
  background: #e6f1f7;
}

.ss-overview-stats small {
  color: #576458;
  font-size: 9px;
}

.ss-overview-stats strong {
  margin-top: auto;
  font-size: clamp(21px, 2.5vw, 31px);
  letter-spacing: -.07em;
  line-height: 1;
}

.ss-overview-stats span {
  margin-top: 4px;
  color: #6e776e;
  font-size: 8px;
}

.ss-overview-insights {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 9px;
}

.ss-overview-chart,
.ss-overview-next {
  min-height: 180px;
  padding: 13px;
  border: 1px solid #dbe1d8;
  border-radius: 9px;
  background: #fff;
}

.ss-overview-card-heading {
  display: flex;
  justify-content: space-between;
  gap: 7px;
  align-items: center;
}

.ss-overview-card-heading strong {
  font-size: 10px;
}

.ss-overview-bars {
  display: flex;
  align-items: end;
  gap: 7px;
  height: 107px;
  margin: 12px 0 4px;
  padding: 0 3px;
  border-bottom: 1px solid #cbd3ca;
  background: repeating-linear-gradient(to top, #e8ece8 0 1px, transparent 1px 27px);
}

.ss-overview-bars i {
  flex: 1;
  height: var(--bar);
  border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, #8c97ed, #586fd1);
  transform-origin: bottom;
  animation: ss-bar-rise 1.1s cubic-bezier(.2,.7,.2,1) both;
}

.ss-overview-bars i:nth-child(2n) { background: linear-gradient(180deg, #a8e889, #5ea768); }
.ss-overview-bars i:nth-child(3n) { background: linear-gradient(180deg, #f8bc9a, #e88674); }
.ss-overview-bars i:nth-child(2) { animation-delay: .08s; }
.ss-overview-bars i:nth-child(3) { animation-delay: .16s; }
.ss-overview-bars i:nth-child(4) { animation-delay: .24s; }
.ss-overview-bars i:nth-child(5) { animation-delay: .32s; }
.ss-overview-bars i:nth-child(6) { animation-delay: .4s; }
.ss-overview-bars i:nth-child(7) { animation-delay: .48s; }
.ss-overview-bars i:nth-child(8) { animation-delay: .56s; }

.ss-overview-chart-foot {
  display: flex;
  justify-content: space-between;
}

.ss-overview-next p {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 10px 0;
  padding-bottom: 8px;
  border-bottom: 1px solid #edf0ea;
  font-size: 9px;
  font-weight: 650;
}

.ss-overview-next p b {
  color: #678572;
  font-size: 8px;
}

.ss-overview-next-link {
  display: block;
  margin-top: 11px;
  color: #375e59;
  font-size: 9px;
  font-weight: 750;
}

.software-services-page .ss-catalogue,
.software-services-page .ss-accounting {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #fff;
}

.software-services-page .ss-catalogue::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 590px;
  aspect-ratio: 1;
  top: -280px;
  right: -190px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 35%, #f8e3dc, #e5dcf6 45%, #d7eff0 72%, transparent 73%);
  opacity: .65;
}

.software-services-page .ss-app {
  border-color: #1a241c18;
  border-radius: 18px;
  box-shadow: 0 8px 24px #263d2d0a;
  transition: transform .24s ease, box-shadow .24s ease;
}

.software-services-page .ss-app:hover,
.software-services-page .ss-app:focus-visible {
  transform: translateY(-6px);
  box-shadow: 0 20px 34px #263d2d1a;
}

.software-services-page .ss-project-map {
  background: linear-gradient(145deg, #f7ebdf, #e5f1ea 54%, #e4e8f6);
}

.software-services-page .ss-accounting .ss-screen {
  box-shadow: 18px 18px 0 #d9eaf8, 0 22px 50px #19321d15;
}

.software-services-page .lm-track-anything {
  isolation: isolate;
  background: #161d27;
}

.software-services-page .lm-track-anything::before {
  z-index: -1;
  background-image:
    linear-gradient(#ffffff15 1px, transparent 1px),
    linear-gradient(90deg, #ffffff15 1px, transparent 1px),
    linear-gradient(#ffffff08 1px, transparent 1px),
    linear-gradient(90deg, #ffffff08 1px, transparent 1px);
  background-size: 72px 72px, 72px 72px, 12px 12px, 12px 12px;
  mask-image: linear-gradient(90deg, #000, transparent 85%);
}

.software-services-page .lm-track-anything::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: min(56vw, 650px);
  aspect-ratio: 1;
  left: -21%;
  top: -44%;
  border-radius: 50%;
  background: conic-gradient(#a6f48e, #7dcae8, #8d8deb, #e3a8cc, #f6b896, #a6f48e);
  opacity: .42;
  filter: blur(8px);
  pointer-events: none;
  animation: ss-orb-drift 18s ease-in-out infinite alternate-reverse;
}

.software-services-page .lm-track-anything-copy > p:not(.lm-platform-eyebrow) {
  color: #d8dee5;
}

.software-services-page .ss-track-demo {
  transform: none;
  background: #f8f9f6;
  box-shadow: 24px 27px 0 #89a9ee24, 0 32px 90px #0006;
}

.ss-track-surface {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: 11px;
  padding: 18px;
  background: linear-gradient(145deg, #e7f0ed, #f8eee8 52%, #e8e9f8);
  font-family: 'Instrument Sans', Arial, sans-serif;
}

.ss-track-focus,
.ss-track-tasks {
  min-width: 0;
  padding: 21px;
  border: 1px solid #17251f17;
  border-radius: 15px;
  background: #fff;
}

.ss-track-eyebrow,
.ss-track-tasks-head small {
  color: #617166;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
}

.ss-track-timer {
  display: grid;
  place-items: center;
  margin: 18px auto 16px;
}

.ss-track-ring {
  display: grid;
  place-items: center;
  width: min(12vw, 150px);
  min-width: 112px;
  aspect-ratio: 1;
  padding: 9px;
  border-radius: 50%;
  background: conic-gradient(#aaef89 0 27%, #8acfe4 27% 49%, #8c86e7 49% 75%, #f0a9b1 75% 88%, #e7ece5 88%);
  box-shadow: 0 12px 32px #53807229;
}

.ss-track-ring > span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #fff;
  color: #17251f;
  letter-spacing: -.06em;
  padding: 0;
}

.ss-track-ring strong { font-size: clamp(24px, 3vw, 38px); line-height: 1; }
.ss-track-ring small { align-self: center; padding-top: 7px; font-size: 12px; }
.ss-track-focus h3 { margin: 8px 0 4px; font-size: 19px; letter-spacing: -.045em; }
.ss-track-focus > p { margin: 0; color: #647066; font-size: 11px; }
.ss-track-focus > p span { margin: 0 4px; }

.ss-track-status {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 18px;
}

.ss-track-status > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 9px;
  border-radius: 30px;
  background: #e7f6e1;
  color: #345c3d;
  font-size: 9px;
  font-weight: 750;
}

.ss-track-status > span:last-child { background: #f3edf9; color: #584c77; }

.ss-track-tasks-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.ss-track-tasks-head strong {
  padding: 5px 8px;
  border-radius: 30px;
  background: #e9ebf9;
  color: #494d8d;
  font-size: 9px;
}

.ss-track-tasks ul {
  display: grid;
  gap: 8px;
  padding: 0;
  margin: 19px 0;
  list-style: none;
}

.ss-track-tasks li {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 56px;
  padding: 8px;
  border: 1px solid #e1e8e1;
  border-radius: 9px;
  background: #fafbf9;
}

.ss-track-tasks li:nth-child(2) { background: #edf7e7; border-color: #cde4c4; }
.ss-track-tasks li > span { display: grid; place-items: center; width: 24px; aspect-ratio: 1; border-radius: 50%; background: #e9ede8; color: #536957; font-size: 10px; }
.ss-track-tasks li:nth-child(2) > span { background: #a8e77d; color: #173823; }
.ss-track-tasks li strong { display: block; font-size: 10px; }
.ss-track-tasks li small { color: #617166; font-size: 9px; }
.ss-track-tasks > p { padding-top: 13px; border-top: 1px solid #dfe5de; color: #4e5e54; font-size: 10px; font-weight: 700; }
.ss-track-tasks > p span { margin: 0 5px; color: #725cb4; }

body.software-services-page #workspace-plans .enterprise-price-heading,
body.workspace-demo-page #workspace-plans .enterprise-price-heading {
  max-width: 1160px;
  margin-bottom: 30px;
}

body.software-services-page #workspace-plans .enterprise-price-heading h2,
body.workspace-demo-page #workspace-plans .enterprise-price-heading h2 {
  max-width: none;
  font-size: clamp(36px, 5.2vw, 72px);
  white-space: nowrap;
  letter-spacing: -.065em;
}

body.software-services-page #workspace-plans .enterprise-price-heading > p:last-child,
body.workspace-demo-page #workspace-plans .enterprise-price-heading > p:last-child {
  max-width: none;
  margin-bottom: 0;
  font-size: 16px;
}

/* Public workspace tour */
body.workspace-demo-page .demo-local-intro {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .68fr);
  align-items: center;
  gap: 30px;
  min-height: 300px;
  margin-top: 24px;
  margin-bottom: 32px;
  padding: clamp(28px, 4vw, 52px);
  overflow: hidden;
  border: 1px solid #cde3d1;
  border-radius: 24px;
  background: #f4f9f2;
  box-shadow: 0 22px 50px #21332411;
}

body.workspace-demo-page .demo-local-intro::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image:
    linear-gradient(#2039280b 1px, transparent 1px),
    linear-gradient(90deg, #2039280b 1px, transparent 1px),
    linear-gradient(#20392808 1px, transparent 1px),
    linear-gradient(90deg, #20392808 1px, transparent 1px);
  background-size: 72px 72px, 72px 72px, 12px 12px, 12px 12px;
  mask-image: linear-gradient(90deg, transparent, #000);
}

.demo-intro-copy { position: relative; z-index: 1; }
body.workspace-demo-page .demo-local-intro h2 { max-width: 17ch; margin: 10px 0 12px; font-size: clamp(32px, 3.4vw, 52px); letter-spacing: -.06em; line-height: 1.02; }
body.workspace-demo-page .demo-local-intro p:not(.co-kicker) { max-width: 56ch; color: #536557; }
body.workspace-demo-page .demo-local-intro .co-button { margin-top: 12px; }

.demo-intro-art {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 230px;
}

.demo-intro-orb {
  display: grid;
  place-items: center;
  width: min(26vw, 270px);
  min-width: 195px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: conic-gradient(from 35deg, #a9eb85, #78cadb 22%, #8d8ae6 43%, #e4a5d0 65%, #f8b593 84%, #a9eb85);
  box-shadow: inset 0 0 45px #ffffff55, 0 30px 46px #536f8550;
  animation: ss-orb-drift 12s ease-in-out infinite alternate;
}

.demo-intro-orb::after {
  content: "";
  width: 34%;
  aspect-ratio: 1;
  border: 1px solid #ffffffaa;
  border-radius: 50%;
  background: #ffffff9c;
  box-shadow: 0 0 0 28px #ffffff28, 0 0 0 58px #ffffff20;
}

.demo-intro-chip {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px 12px;
  border: 1px solid #ffffffbb;
  border-radius: 10px;
  background: #ffffffeb;
  box-shadow: 0 9px 25px #1c312324;
  color: #1b2a22;
  font-size: 10px;
  font-weight: 750;
}

.demo-intro-chip i { display: block; width: 7px; height: 7px; border-radius: 50%; background: #77cc68; }
.demo-intro-chip--one { top: 10%; left: -2%; transform: rotate(-5deg); }
.demo-intro-chip--two { right: -1%; top: 35%; transform: rotate(4deg); }
.demo-intro-chip--three { left: 10%; bottom: 7%; transform: rotate(3deg); }

body.workspace-demo-page .demo-chapter { background: #fff; }
body.workspace-demo-page .demo-chapter--sage { background: #f5f9f3; }
body.workspace-demo-page .demo-screenshot {
  position: relative;
  padding: clamp(9px, 1.4vw, 18px);
  border: 1px solid #cfdcd2;
  border-radius: 20px;
  background: linear-gradient(135deg, #edf4dd, #e1edf6 43%, #f5e7e6 82%);
  box-shadow: 0 24px 60px #293b301c;
  transition: transform .3s ease, box-shadow .3s ease;
}

body.workspace-demo-page .demo-screenshot:hover {
  transform: translateY(-4px);
  box-shadow: 0 32px 64px #293b3028;
}

body.workspace-demo-page .demo-screenshot > a {
  border: 1px solid #1b2b271f;
  border-radius: 9px;
  background: #fff;
}

body.workspace-demo-page .demo-screenshot img { height: auto; }
body.workspace-demo-page .demo-screenshot figcaption { color: #344a3c; font-weight: 650; }
body.workspace-demo-page .demo-screenshot figcaption > span:first-child::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 8px;
  border-radius: 50%;
  background: #a2de76;
  box-shadow: 0 0 0 4px #a2de7640;
}

@keyframes ss-orb-drift {
  from { transform: translate3d(0, 0, 0) rotate(0deg); }
  to { transform: translate3d(-22px, 15px, 0) rotate(13deg); }
}

@keyframes ss-bar-rise {
  from { transform: scaleY(.1); opacity: .45; }
  to { transform: scaleY(1); opacity: 1; }
}

@media (max-width: 1050px) {
  body.software-services-page .lm-product-hero-grid { grid-template-columns: 1fr; }
  body.software-services-page .lm-product-hero::after { top: 15%; right: -26%; }
}

@media (max-width: 700px) {
  body.software-services-page .lm-product-hero { padding: 56px 0 82px !important; }
  body.software-services-page .lm-product-hero::after { width: 115vw; top: 33%; right: -55%; opacity: .4; }
  .ss-overview { grid-template-columns: 50px minmax(0, 1fr); min-height: 0; }
  .ss-overview-rail { padding: 12px 7px; }
  .ss-overview-brand { margin: 0 auto 19px; }
  .ss-overview-brand strong,
  .ss-overview-rail-label,
  .ss-overview-rail-footer,
  .ss-overview-rail > div:not(.ss-overview-brand) { font-size: 0; }
  .ss-overview-rail > div:not(.ss-overview-brand) { justify-content: center; padding: 8px 2px; }
  .ss-overview-rail > div > span { font-size: 16px; }
  .ss-overview-main { padding: 13px; }
  .ss-overview-heading h2 { font-size: 22px; }
  .ss-overview-heading p,
  .ss-overview-live,
  .ss-overview-next,
  .ss-overview-stats > div:nth-child(3) { display: none; }
  .ss-overview-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ss-overview-stats > div { min-height: 82px; padding: 9px; }
  .ss-overview-stats strong { font-size: 23px; }
  .ss-overview-insights { grid-template-columns: 1fr; }
  .ss-overview-chart { min-height: 0; }
  .ss-overview-bars { height: 92px; }
  .ss-track-surface { grid-template-columns: 1fr; }
  .ss-track-ring { width: 140px; }
  body.software-services-page #workspace-plans .enterprise-price-heading h2,
  body.workspace-demo-page #workspace-plans .enterprise-price-heading h2 { white-space: normal; font-size: clamp(35px, 8vw, 50px); }
  body.workspace-demo-page .demo-local-intro { grid-template-columns: 1fr; padding: 28px; }
  .demo-intro-art { min-height: 180px; }
  .demo-intro-orb { min-width: 170px; width: 170px; }
}

@media (prefers-reduced-motion: reduce) {
  body.software-services-page .lm-product-hero::after,
  .software-services-page .lm-track-anything::after,
  .demo-intro-orb,
  .ss-overview-bars i { animation: none; }
  .software-services-page .ss-app,
  body.workspace-demo-page .demo-screenshot { transition: none; }
}
