:root {
  --ink:#102039;
  --muted:#61718a;
  --blue:#286df4;
  --blue-dark:#1554d1;
  --cyan:#28c4ed;
  --pale:#f5f8fd;
  --line:#e4eaf3;
  --navy:#091a35;
  --font-body:"DM Sans",sans-serif;
  --font-display:"Manrope",sans-serif;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:92px;
}

body {
  margin:0;
  background:#fff;
  color:var(--ink);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
}

a {
  color:inherit;
  text-decoration:none;
}

button,input,select {
  font:inherit;
}

.container {
  width:min(1160px,calc(100% - 48px));
  margin-inline:auto;
}

.skip-link {
  position:absolute;
  top:-60px;
  left:16px;
  z-index:100;
  background:#fff;
  padding:12px 16px;
  border-radius:8px;
}

.skip-link:focus {
  top:16px;
}

.site-header {
  height:82px;
  position:sticky;
  top:0;
  z-index:30;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(220,228,240,.75);
}

.header-inner {
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.brand {
  display:inline-flex;
  align-items:center;
}

.brand img {
  display:block;
  width:152px;
  height:auto;
}

.primary-nav {
  display:flex;
  align-items:center;
  gap:33px;
}

.primary-nav>a:not(.button) {
  font-size:13px;
  font-weight:600;
  color:#53637b;
  transition:color .2s;
}

.primary-nav>a:not(.button):hover {
  color:var(--blue);
}

.button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  padding:15px 21px;
  border-radius:8px;
  font-size:13px;
  font-weight:700;
  line-height:1;
  transition:transform .2s,box-shadow .2s,background .2s;
  border:1px solid transparent;
  cursor:pointer;
}

.button:hover {
  transform:translateY(-2px);
}

.button-primary {
  background:linear-gradient(110deg,#337df8,#2364e5);
  color:#fff;
  box-shadow:0 8px 18px rgba(38,109,244,.2);
}

.button-primary:hover {
  box-shadow:0 11px 24px rgba(38,109,244,.3);
}

.button-small {
  padding:12px 16px;
  font-size:12px;
}

.button-outline {
  border-color:#d8e1ef;
  color:var(--ink);
  background:#fff;
}

.button-outline:hover {
  border-color:#a9c4f5;
}

.button-text {
  padding:13px 3px;
  color:#31445f;
}

.button-text:hover {
  color:var(--blue);
}

.button-text>span:last-child {
  font-size:10px;
}

.button-white {
  color:#0d397b;
  background:#fff;
  box-shadow:0 8px 22px rgba(3,17,40,.16);
}

.button-white:hover {
  background:#f0f6ff;
}

.menu-toggle {
  display:none;
  border:0;
  background:none;
  padding:8px;
}

.menu-toggle span {
  display:block;
  width:22px;
  height:2px;
  margin:5px;
  background:var(--ink);
}

.hero {
  position:relative;
  overflow:hidden;
  background:linear-gradient(120deg,#f8faff 0%,#f5f9ff 58%,#edf5ff 100%);
  padding:83px 0 76px;
}

.hero:before {
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(72,118,187,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(72,118,187,.035) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(90deg,transparent 0%,#000 50%,#000 100%);
  pointer-events:none;
}

.hero-orb {
  position:absolute;
  border-radius:50%;
  filter:blur(1px);
  pointer-events:none;
}

.hero-orb-one {
  width:440px;
  height:440px;
  right:2%;
  top:7%;
  background:radial-gradient(circle,rgba(73,157,255,.12),transparent 70%);
}

.hero-orb-two {
  width:330px;
  height:330px;
  left:30%;
  bottom:-35%;
  background:radial-gradient(circle,rgba(42,202,238,.08),transparent 70%);
}

.hero-grid {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  gap:45px;
  align-items:center;
}

.hero-copy {
  padding:10px 0 18px;
}

.eyebrow,.section-kicker {
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:#2f70e8;
  font-size:11px;
  font-weight:700;
  letter-spacing:.105em;
  text-transform:uppercase;
}

.eyebrow {
  padding:8px 12px 8px 9px;
  border:1px solid #dce9ff;
  border-radius:99px;
  background:rgba(255,255,255,.75);
  font-size:10px;
  letter-spacing:.06em;
}

.eyebrow-dot {
  width:7px;
  height:7px;
  border-radius:50%;
  background:#2eb9e6;
  box-shadow:0 0 0 4px #dbf7ff;
}

.hero h1 {
  font:800 clamp(42px,5vw,62px)/1.1 var(--font-display);
  letter-spacing:-.055em;
  color:#10223f;
  margin:25px 0 19px;
  max-width:600px;
}

.hero h1 span {
  color:#2d72ef;
}

.hero-lede {
  max-width:470px;
  color:#5e6e87;
  font-size:15px;
  line-height:1.8;
  margin:0;
}

.hero-actions {
  display:flex;
  align-items:center;
  gap:25px;
  margin-top:29px;
}

.hero-note {
  display:flex;
  align-items:center;
  gap:9px;
  color:#718098;
  font-size:11px;
  font-weight:500;
  margin-top:30px;
}

.check-mark {
  display:grid;
  place-items:center;
  color:#148b70;
  background:#ddf6ed;
  width:19px;
  height:19px;
  border-radius:50%;
  font-size:11px;
  font-weight:700;
}

.hero-visual {
  position:relative;
  padding:27px 2px 33px 15px;
  min-width:0;
}

.visual-glow {
  position:absolute;
  z-index:-1;
  inset:10% 3% 8% 11%;
  border-radius:40px;
  background:linear-gradient(135deg,rgba(76,143,255,.17),rgba(42,210,236,.14));
  filter:blur(30px);
}

.dashboard-window {
  position:relative;
  z-index:1;
  overflow:hidden;
  background:#fff;
  border:1px solid #dce5f2;
  border-radius:13px;
  box-shadow:0 28px 75px rgba(32,67,119,.18),0 4px 12px rgba(20,57,103,.06);
  transform:perspective(1400px) rotateY(-4deg) rotateX(1deg);
}

.dash-topbar {
  height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 13px;
  border-bottom:1px solid #edf1f7;
  background:#fbfcfe;
  color:#9aa7b8;
  font-size:8px;
  letter-spacing:.02em;
}

.window-dots {
  display:flex;
  gap:4px;
}

.window-dots i {
  width:6px;
  height:6px;
  border-radius:50%;
  background:#d6dfea;
}

.window-dots i:first-child {
  background:#ff9589;
}

.window-dots i:nth-child(2) {
  background:#ffd36c;
}

.window-dots i:nth-child(3) {
  background:#82d7ae;
}

.dash-avatar {
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#eaf1ff;
  color:#3a6fd1;
  font-size:7px;
  font-weight:800;
}

.dash-body {
  display:flex;
  min-height:363px;
}

.dash-sidebar {
  width:42px;
  flex:none;
  background:#f9fbfe;
  border-right:1px solid #edf1f6;
  display:flex;
  align-items:center;
  flex-direction:column;
  padding:13px 0 10px;
  gap:14px;
}

.dash-logo-mark {
  display:grid;
  place-items:center;
  width:19px;
  height:19px;
  background:linear-gradient(140deg,#286df4,#28c4ed);
  color:#fff;
  border-radius:6px;
  font:800 11px var(--font-display);
  margin-bottom:8px;
}

.dash-side-item {
  display:grid;
  place-items:center;
  color:#aab6c5;
  font-size:13px;
  width:25px;
  height:25px;
  border-radius:7px;
}

.dash-side-item.active {
  background:#e9f0ff;
  color:#286df4;
}

.dash-side-bottom {
  margin-top:auto;
  color:#97a5b6;
  font-size:13px;
}

.dash-content {
  flex:1;
  padding:18px 19px 14px;
  min-width:0;
}

.dash-greeting {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  margin-bottom:14px;
}

.dash-greeting small {
  font-size:6px;
  letter-spacing:.1em;
  color:#95a3b5;
  font-weight:700;
}

.dash-greeting h3 {
  font:700 16px var(--font-display);
  letter-spacing:-.03em;
  margin:4px 0 0;
  color:#192a43;
}

.dash-filter {
  color:#697991;
  border:1px solid #e6ebf2;
  border-radius:5px;
  padding:6px 7px;
  font-size:7px;
}

.dash-filter span {
  padding-left:8px;
}

.dash-stat-row {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}

.dash-stat {
  border:1px solid #e9eef5;
  border-radius:6px;
  padding:9px 9px 8px;
  min-width:0;
}

.stat-label {
  display:flex;
  justify-content:space-between;
  color:#718096;
  font-size:7px;
}

.stat-label span {
  color:#8aa0bd;
}

.dash-stat>strong {
  display:block;
  margin:7px 0 4px;
  color:#172942;
  font:700 21px var(--font-display);
  letter-spacing:-.04em;
}

.dash-stat>strong small {
  font-size:11px;
}

.dash-stat>small {
  color:#97a3b2;
  font-size:6px;
  white-space:nowrap;
}

.dash-stat>small em {
  font-style:normal;
}

.green {
  color:#17a47e;
}

.blue {
  color:#3478f6;
}

.dash-lower {
  display:grid;
  grid-template-columns:1.65fr .8fr;
  gap:8px;
  margin-top:9px;
}

.dash-chart-card,.dash-priority-card {
  border:1px solid #e9eef5;
  border-radius:6px;
  padding:9px 9px 7px;
  min-width:0;
}

.chart-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#43546c;
  font-size:7px;
  font-weight:700;
}

.chart-legend {
  color:#8b9ab0;
  font-size:6px;
  font-weight:500;
}

.chart-legend i {
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#3478f6;
  margin-right:4px;
}

.chart-area {
  height:75px;
  display:flex;
  gap:7px;
  margin-top:8px;
}

.chart-y {
  width:13px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  color:#b4bfcd;
  font-size:5px;
  padding-bottom:2px;
}

.chart-area svg {
  width:calc(100% - 20px);
  height:100%;
  overflow:visible;
  border-bottom:1px solid #edf1f6;
  background:repeating-linear-gradient(to bottom,transparent,transparent 23px,#f0f3f8 24px);
}

.chart-x {
  display:flex;
  justify-content:space-between;
  margin:4px 0 0 19px;
  color:#aab5c3;
  font-size:5px;
}

.more {
  color:#8d9bad;
  font-size:14px;
  line-height:7px;
}

.priority-donut {
  width:70px;
  height:70px;
  margin:10px auto 7px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:conic-gradient(#3478f6 0 25%,#8f7cf7 25% 69%,#d9e7fa 69% 100%);
  position:relative;
}

.priority-donut:before {
  content:"";
  position:absolute;
  inset:8px;
  background:#fff;
  border-radius:50%;
}

.donut-center {
  position:relative;
  z-index:1;
  text-align:center;
}

.donut-center strong {
  display:block;
  font:700 14px var(--font-display);
  color:#1b2c45;
}

.donut-center small {
  font-size:5px;
  color:#8c9aab;
}

.priority-legend {
  display:grid;
  gap:4px;
}

.priority-legend span {
  display:flex;
  align-items:center;
  gap:4px;
  color:#8895a6;
  font-size:5px;
}

.priority-legend i {
  width:5px;
  height:5px;
  border-radius:50%;
}

.priority-legend b {
  margin-left:auto;
  color:#53647a;
  font-weight:700;
}

.p-high {
  background:#3478f6;
}

.p-medium {
  background:#8f7cf7;
}

.p-low {
  background:#d9e7fa;
}

.dash-table {
  margin-top:9px;
  border:1px solid #e9eef5;
  border-radius:6px;
  overflow:hidden;
}

.table-title {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:7px 9px;
  color:#43546c;
  font-size:7px;
  font-weight:700;
  border-bottom:1px solid #eff2f6;
}

.table-title span {
  color:#3478f6;
  font-size:6px;
}

.table-row {
  display:grid;
  grid-template-columns:.55fr 1.8fr 1fr 18px;
  align-items:center;
  gap:5px;
  padding:6px 9px;
  color:#58677c;
  font-size:6px;
  border-bottom:1px solid #f1f3f7;
}

.table-row:last-child {
  border:0;
}

.ticket-id {
  color:#8191a5;
  font-weight:600;
}

.status-pill {
  padding:3px 5px;
  border-radius:4px;
  width:max-content;
  max-width:100%;
  font-size:5px;
  white-space:nowrap;
}

.status-progress {
  background:#eaf1ff;
  color:#4c78cc;
}

.status-waiting {
  background:#fff5e2;
  color:#bd8429;
}

.assignee {
  display:grid;
  place-items:center;
  width:15px;
  height:15px;
  border-radius:50%;
  background:#e6f5f7;
  color:#318697;
  font-size:5px;
  font-weight:700;
}

.assignee.purple {
  background:#f0ebff;
  color:#8066c5;
}

.float-tag {
  position:absolute;
  z-index:3;
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 13px;
  border:1px solid rgba(219,230,244,.9);
  border-radius:9px;
  background:rgba(255,255,255,.96);
  box-shadow:0 12px 28px rgba(26,57,101,.12);
}

.float-tag-top {
  top:3px;
  right:-15px;
}

.float-tag-bottom {
  bottom:20px;
  left:-4px;
}

.float-tag b,.float-tag small {
  display:block;
}

.float-tag b {
  font-size:9px;
  color:#243650;
}

.float-tag small {
  font-size:7px;
  color:#8291a5;
  margin-top:3px;
}

.float-icon {
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:7px;
  font-size:14px;
  font-weight:700;
}

.icon-blue {
  color:#286df4;
  background:#edf3ff;
}

.sla-ring {
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  border:2px solid #8de0cc;
  border-radius:50%;
  color:#119879;
  font-size:12px;
}

.visual-caption {
  position:absolute;
  right:13px;
  bottom:8px;
  color:#9ba9ba;
  font-size:8px;
}

.hero-bottom-line {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  height:1px;
  background:linear-gradient(90deg,transparent,#d4e4f8,transparent);
}

.value-strip {
  border-bottom:1px solid #edf1f6;
  background:#fff;
}

.value-grid {
  min-height:90px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.value-intro {
  font:500 14px var(--font-display);
  color:#54647b;
}

.value-intro strong {
  color:#1e3454;
}

.value-item {
  display:flex;
  align-items:center;
  gap:9px;
  color:#5f7089;
  font-size:11px;
  font-weight:600;
}

.value-icon {
  display:grid;
  place-items:center;
  width:29px;
  height:29px;
  border:1px solid #e4ecf8;
  border-radius:8px;
  background:#f8fbff;
  color:#3d7aed;
  font-size:15px;
}

.section {
  padding:107px 0;
}

.section-heading {
  max-width:680px;
}

.centered {
  text-align:center;
  margin:0 auto;
}

.section-kicker {
  font-size:10px;
  letter-spacing:.13em;
}

.section-heading h2,.managers-copy h2,.faq-intro h2 {
  font:750 clamp(32px,4vw,44px)/1.18 var(--font-display);
  letter-spacing:-.045em;
  color:#142641;
  margin:15px 0;
}

.section-heading h2 span,.managers-copy h2 span {
  color:#3174ee;
}

.section-heading p,.managers-copy>p,.faq-intro>p {
  color:#75839a;
  font-size:14px;
  line-height:1.8;
  margin:0;
}

.features-section {
  background:#fff;
}

.feature-grid {
  display:grid;
  grid-template-columns:1.1fr .95fr .95fr;
  gap:17px;
  margin-top:47px;
}

.feature-card {
  position:relative;
  overflow:hidden;
  min-height:413px;
  border:1px solid #e6ecf4;
  border-radius:12px;
  padding:26px 24px;
  background:#fff;
  box-shadow:0 9px 28px rgba(21,51,94,.035);
}

.feature-card-tall {
  background:linear-gradient(150deg,#fff 25%,#f5f9ff 100%);
}

.feature-icon {
  display:grid;
  place-items:center;
  width:39px;
  height:39px;
  border-radius:10px;
  margin-bottom:21px;
}

.feature-icon svg {
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.feature-icon-blue {
  background:#eaf1ff;
  color:#3478f6;
}

.feature-icon-cyan {
  background:#e7faff;
  color:#1eabc9;
}

.feature-icon-violet {
  background:#f0edff;
  color:#8069dc;
}

.feature-label {
  display:block;
  color:#8b99ad;
  font-size:9px;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
  margin-bottom:7px;
}

.feature-card h3 {
  font:700 19px var(--font-display);
  color:#1c2e48;
  letter-spacing:-.025em;
  margin:0 0 9px;
}

.feature-card>p {
  font-size:11px;
  line-height:1.7;
  color:#75839a;
  margin:0;
  min-height:57px;
}

.ticket-preview,.sla-preview,.bi-preview {
  margin-top:21px;
  border:1px solid #e5ebf4;
  border-radius:8px;
  background:rgba(255,255,255,.94);
  box-shadow:0 6px 17px rgba(35,66,112,.04);
}

.ticket-preview {
  padding:10px 11px;
}

.ticket-preview-head,.sla-preview-top,.bi-preview-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#40526c;
  font-size:8px;
  font-weight:700;
}

.tiny-pill {
  border-radius:4px;
  background:#edf3ff;
  color:#4d78cb;
  font-size:6px;
  font-weight:600;
  padding:4px 5px;
}

.mini-ticket {
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 0;
  border-bottom:1px solid #eff3f8;
}

.mini-ticket:last-child {
  border-bottom:0;
  padding-bottom:1px;
}

.mini-ticket-icon {
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:6px;
  font-size:11px;
}

.blue-tile {
  background:#edf3ff;
  color:#4680ed;
}

.violet-tile {
  background:#f1edff;
  color:#8a73dc;
}

.cyan-tile {
  background:#e8fafe;
  color:#2bafc5;
}

.mini-ticket b,.mini-ticket small {
  display:block;
}

.mini-ticket b {
  font-size:7px;
  color:#44536a;
  font-weight:600;
}

.mini-ticket small {
  font-size:6px;
  color:#9aa6b5;
  margin-top:3px;
}

.mini-status {
  margin-left:auto;
  width:6px;
  height:6px;
  border-radius:50%;
}

.status-dot-blue {
  background:#5d8ff2;
}

.status-dot-amber {
  background:#f2b853;
}

.status-dot-green {
  background:#39bb94;
}

.sla-preview {
  padding:11px;
}

.sla-calendar {
  color:#9aa8b9;
}

.sla-progress-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:13px 0 6px;
  color:#53637a;
  font-size:7px;
}

.sla-progress-row b {
  color:#40526a;
  font-size:8px;
}

.sla-label {
  display:flex;
  align-items:center;
  gap:5px;
}

.sla-dot {
  width:6px;
  height:6px;
  border-radius:50%;
}

.dot-red {
  background:#f07878;
}

.dot-amber {
  background:#eeb84f;
}

.dot-green {
  background:#40bf98;
}

.progress-track {
  height:4px;
  border-radius:9px;
  background:#f0f3f7;
  overflow:hidden;
}

.progress-track i {
  height:100%;
  display:block;
  border-radius:9px;
}

.progress-red {
  width:31%;
  background:#ee8580;
}

.progress-amber {
  width:62%;
  background:#efbd57;
}

.progress-green {
  width:81%;
  background:#4bc49f;
}

.demo-label {
  display:block;
  text-align:right;
  color:#a4afbd;
  font-size:6px;
  margin-top:10px;
}

.bi-preview {
  padding:11px 11px 9px;
}

.bi-period {
  padding:4px 6px;
  border:1px solid #edf0f5;
  border-radius:4px;
  color:#8d9aac;
  font-size:6px;
  font-weight:500;
}

.bi-bars {
  height:93px;
  display:flex;
  align-items:flex-end;
  justify-content:space-around;
  gap:8px;
  padding:14px 6px 0;
  border-bottom:1px solid #e9eef5;
  background:repeating-linear-gradient(to bottom,transparent,transparent 24px,#f1f4f8 25px);
}

.bi-bars div {
  display:flex;
  align-items:center;
  flex-direction:column;
  justify-content:flex-end;
  height:100%;
  gap:5px;
}

.bi-bars i {
  display:block;
  width:15px;
  border-radius:4px 4px 0 0;
  background:linear-gradient(180deg,#51c8e8,#3980f2);
}

.bi-bars small {
  font-size:5px;
  color:#a4afbd;
}

.bi-caption {
  display:flex;
  align-items:center;
  gap:5px;
  color:#8492a6;
  font-size:6px;
  margin-top:9px;
}

.bi-caption i {
  width:6px;
  height:6px;
  border-radius:50%;
  background:#3980f2;
}

.bi-caption b {
  margin-left:auto;
  font-weight:500;
  color:#a2adbb;
  font-size:5px;
}

.feature-more {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:30px;
  color:#75839a;
  font-size:11px;
}

.more-chips {
  display:flex;
  gap:9px;
}

.more-chips span {
  padding:9px 12px;
  border-radius:6px;
  border:1px solid #e6ecf4;
  background:#fbfcfe;
  color:#586a83;
  font-size:9px;
  font-weight:600;
}

.platform-section {
  position:relative;
  overflow:hidden;
  padding:91px 0;
  background:#0c1e3a;
  color:#fff;
}

.platform-section:before {
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse at 75% 45%,rgba(28,91,184,.26),transparent 55%),linear-gradient(110deg,transparent 45%,rgba(31,85,155,.1));
  pointer-events:none;
}

.platform-section:after {
  content:"";
  position:absolute;
  width:500px;
  height:500px;
  right:-220px;
  top:-280px;
  border:1px solid rgba(120,176,247,.1);
  border-radius:50%;
  box-shadow:0 0 0 45px rgba(120,176,247,.025),0 0 0 100px rgba(120,176,247,.02);
}

.platform-grid {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:80px;
  align-items:center;
}

.kicker-light {
  color:#72d6ef;
}

.platform-copy h2 {
  font:750 clamp(34px,4vw,46px)/1.17 var(--font-display);
  letter-spacing:-.045em;
  margin:17px 0;
}

.platform-copy h2 span {
  color:#61cdec;
}

.platform-copy>p {
  max-width:420px;
  color:#a5b4c9;
  font-size:13px;
  line-height:1.85;
  margin:0;
}

.platform-points {
  display:grid;
  gap:13px;
  list-style:none;
  padding:0;
  margin:25px 0 29px;
  color:#d1dceb;
  font-size:11px;
}

.platform-points li {
  display:flex;
  align-items:center;
  gap:10px;
}

.platform-points li span {
  display:grid;
  place-items:center;
  width:17px;
  height:17px;
  border:1px solid rgba(85,212,193,.4);
  border-radius:50%;
  color:#5cddbc;
  font-size:9px;
}

.workflow-visual {
  min-height:350px;
  border:1px solid rgba(169,196,230,.16);
  border-radius:12px;
  background:linear-gradient(135deg,rgba(27,49,82,.94),rgba(17,38,69,.97));
  box-shadow:0 24px 60px rgba(0,0,0,.22);
  overflow:hidden;
}

.workflow-topline {
  height:44px;
  padding:0 17px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid rgba(174,198,229,.12);
  color:#cfdae9;
  font-size:9px;
  font-weight:600;
}

.workflow-menu {
  color:#91a5c1;
  font-size:16px;
}

.workflow-canvas {
  height:259px;
  position:relative;
  background-image:radial-gradient(rgba(149,183,227,.18) .7px,transparent .7px);
  background-size:16px 16px;
  overflow:hidden;
}

.flow-node {
  position:absolute;
  z-index:2;
  display:flex;
  align-items:center;
  gap:8px;
  width:143px;
  height:52px;
  padding:8px;
  background:#f7f9fd;
  border:1px solid #dfe7f1;
  border-radius:7px;
  box-shadow:0 8px 18px rgba(3,16,35,.2);
}

.flow-node small,.flow-node b {
  display:block;
}

.flow-node small {
  font-size:5px;
  color:#8c9bb0;
  letter-spacing:.08em;
  font-weight:700;
  margin-bottom:4px;
}

.flow-node b {
  font-size:8px;
  color:#34475f;
}

.flow-node>i {
  margin-left:auto;
  color:#32ae8c;
  font-size:9px;
  font-style:normal;
}

.node-start {
  left:7%;
  top:41px;
}

.node-review {
  left:39%;
  top:41px;
}

.node-work {
  left:39%;
  top:144px;
}

.node-done {
  right:5%;
  top:144px;
}

.node-approval {
  left:7%;
  top:192px;
  width:135px;
}

.node-symbol {
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  border-radius:6px;
  font-size:13px;
}

.symbol-cyan {
  color:#16a9c9;
  background:#e2f9fc;
}

.symbol-blue {
  color:#3875e8;
  background:#eaf0ff;
}

.symbol-violet {
  color:#8167ce;
  background:#f0ebff;
}

.symbol-green {
  color:#1a9a79;
  background:#e2f7ef;
}

.symbol-amber {
  color:#bd8a2d;
  background:#fff4dc;
}

.node-ellipsis {
  color:#9baabe!important;
  letter-spacing:1px;
}

.flow-line {
  position:absolute;
  z-index:1;
  border-color:#7598c7;
  border-style:dashed;
  opacity:.75;
}

.line-one {
  left:calc(7% + 143px);
  top:67px;
  width:calc(32% - 143px);
  border-top-width:1px;
}

.line-two {
  left:calc(39% + 71px);
  top:93px;
  height:51px;
  border-left-width:1px;
}

.line-three {
  left:calc(39% + 143px);
  top:170px;
  width:calc(42% - 143px);
  border-top-width:1px;
}

.flow-branch {
  position:absolute;
  left:7%;
  top:125px;
  width:135px;
  height:49px;
  padding:7px 9px;
  border:1px solid rgba(139,164,198,.3);
  border-radius:6px;
  background:#1d385f;
  color:#c5d3e6;
  font-size:6px;
}

.flow-branch b {
  position:absolute;
  left:95px;
  top:24px;
  color:#7ce1c5;
  font-size:6px;
}

.flow-branch i {
  position:absolute;
  left:65px;
  top:29px;
  font-style:normal;
  color:#90abc9;
}

.flow-person {
  position:absolute;
  z-index:3;
  display:grid;
  place-items:center;
  width:21px;
  height:21px;
  border-radius:50%;
  background:#d8e6ff;
  border:2px solid #263c5e;
  color:#426db5;
  font-size:6px;
  font-weight:700;
}

.person-one {
  left:calc(39% + 95px);
  top:157px;
}

.person-two {
  right:6%;
  top:184px;
  background:#e7e1ff;
  color:#795fc3;
}

.workflow-footer {
  height:46px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 17px;
  border-top:1px solid rgba(174,198,229,.12);
  color:#9caec6;
  font-size:8px;
}

.workflow-live {
  display:flex;
  align-items:center;
  gap:6px;
  color:#bad2e9;
}

.workflow-live i {
  width:6px;
  height:6px;
  border-radius:50%;
  background:#4bd1a3;
  box-shadow:0 0 0 3px rgba(75,209,163,.14);
}

.workflow-footer b {
  color:#73d6ec;
  padding-left:5px;
}

.managers-section {
  padding:102px 0;
}

.managers-grid {
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:100px;
  align-items:center;
}

.managers-copy h2 {
  font-size:39px;
}

.managers-copy>p {
  max-width:410px;
  font-size:13px;
}

.inline-link {
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:22px;
  color:#3477ee;
  font-size:11px;
  font-weight:700;
}

.inline-link span {
  font-size:14px;
  transition:transform .2s;
}

.inline-link:hover span {
  transform:translate(2px,-2px);
}

.manager-cards {
  display:grid;
  gap:11px;
}

.manager-card {
  display:flex;
  align-items:center;
  gap:15px;
  padding:17px 18px;
  border:1px solid #e7edf5;
  border-radius:9px;
  background:#fff;
  box-shadow:0 7px 22px rgba(29,56,95,.035);
  transition:transform .2s,box-shadow .2s;
}

.manager-card:hover {
  transform:translateX(3px);
  box-shadow:0 10px 24px rgba(29,56,95,.08);
}

.manager-icon {
  display:grid;
  place-items:center;
  flex:none;
  width:39px;
  height:39px;
  border-radius:9px;
  font-size:18px;
}

.manager-icon-blue {
  background:#edf3ff;
  color:#3876ed;
}

.manager-icon-cyan {
  background:#e8fafd;
  color:#20a9bf;
}

.manager-icon-violet {
  background:#f1edff;
  color:#8066d6;
}

.manager-card h3 {
  font:700 12px var(--font-display);
  color:#293c58;
  margin:0 0 5px;
}

.manager-card p {
  font-size:10px;
  line-height:1.6;
  color:#7a899e;
  margin:0;
}

.manager-arrow {
  margin-left:auto;
  color:#9babc0;
  font-size:14px;
}

.apps-section {
  padding:43px 0;
  border-top:1px solid #eaf0f7;
  border-bottom:1px solid #eaf0f7;
  background:#f7f9fd;
}

.apps-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:34px;
}

.apps-copy {
  max-width:470px;
}

.apps-copy h2 {
  margin:10px 0 7px;
  color:#192c48;
  font:700 22px/1.3 var(--font-display);
  letter-spacing:-.035em;
}

.apps-copy p {
  margin:0;
  color:#74839a;
  font-size:11px;
  line-height:1.7;
}

.app-platforms {
  display:flex;
  gap:10px;
}

.app-platform-card {
  display:flex;
  align-items:center;
  gap:10px;
  min-width:184px;
  padding:10px 12px;
  border:1px solid #e1e8f1;
  border-radius:8px;
  background:#fff;
  color:inherit;
  font:inherit;
  text-align:left;
  cursor:not-allowed;
}

.platform-device {
  display:grid;
  place-items:center;
  flex:none;
  width:31px;
  height:31px;
  border-radius:7px;
}

.platform-device svg {
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-width:1.7;
}

.device-android {
  background:#e8f7ef;
  color:#27966a;
}

.device-ios {
  background:#edf2fa;
  color:#53647e;
}

.platform-name strong,
.platform-name small {
  display:block;
}

.platform-name strong {
  color:#30435e;
  font:700 10px var(--font-display);
}

.platform-name small {
  margin-top:3px;
  color:#8795a8;
  font-size:8px;
}

.store-coming {
  margin-left:auto;
  padding:5px 7px;
  border-radius:4px;
  background:#f0f5fc;
  color:#6680a2;
  font-size:7px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  white-space:nowrap;
}

.quote-cta {
  position:relative;
  overflow:hidden;
  background:linear-gradient(110deg,#1853bf,#286fe3 58%,#2387d9);
  padding:72px 0;
  color:#fff;
  text-align:center;
}

.quote-cta:before {
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:radial-gradient(ellipse at center,#000,transparent 80%);
}

.quote-orb {
  position:absolute;
  width:400px;
  height:400px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:50%;
  top:-260px;
  left:calc(50% - 200px);
  box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.02);
}

.quote-inner {
  position:relative;
}

.quote-inner h2 {
  font:750 clamp(30px,4vw,43px)/1.18 var(--font-display);
  letter-spacing:-.04em;
  margin:15px 0;
}

.quote-inner>p {
  max-width:500px;
  margin:0 auto 24px;
  color:#deebff;
  font-size:12px;
  line-height:1.75;
}

.quote-actions {
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
}

.button-glass {
  border-color:rgba(255,255,255,.36);
  background:rgba(10,43,109,.16);
  color:#fff;
}

.button-glass:hover {
  background:rgba(10,43,109,.32);
}

.quote-inner>small {
  display:block;
  margin-top:13px;
  color:#c4dcff;
  font-size:9px;
}

.faq-section {
  padding:99px 0;
}

.faq-grid {
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:100px;
}

.faq-intro h2 {
  font-size:35px;
  margin-top:14px;
}

.faq-intro>p {
  font-size:12px;
  max-width:330px;
}

.faq-intro .inline-link {
  margin-top:17px;
}

.faq-list {
  border-top:1px solid #e7edf5;
}

.faq-item {
  border-bottom:1px solid #e7edf5;
}

.faq-item summary {
  position:relative;
  list-style:none;
  cursor:pointer;
  padding:19px 40px 19px 0;
  color:#293b56;
  font:700 12px var(--font-display);
}

.faq-item summary::-webkit-details-marker {
  display:none;
}

.faq-toggle {
  position:absolute;
  right:2px;
  top:17px;
  width:21px;
  height:21px;
  border:1px solid #e3eaf3;
  border-radius:50%;
  background:#fafcff;
}

.faq-toggle:before,.faq-toggle:after {
  content:"";
  position:absolute;
  left:6px;
  top:9px;
  width:7px;
  height:1px;
  background:#6681a5;
}

.faq-toggle:after {
  transform:rotate(90deg);
  transition:transform .2s;
}

.faq-item[open] .faq-toggle:after {
  transform:rotate(0);
}

.faq-item p {
  max-width:600px;
  color:#74839a;
  font-size:11px;
  line-height:1.8;
  margin:-2px 35px 18px 0;
}

.site-footer {
  background:#f6f8fc;
  border-top:1px solid #e8edf4;
}

.footer-main {
  display:flex;
  align-items:flex-start;
  padding:38px 0 31px;
}

.footer-brand {
  flex:1;
}

.footer-brand .brand img {
  width:135px;
}

.footer-brand p {
  font-size:10px;
  line-height:1.8;
  color:#8592a6;
  margin:12px 0 0;
}

.footer-links {
  display:flex;
  gap:70px;
  margin:3px 60px 0 0;
}

.footer-links>div {
  display:grid;
  gap:10px;
  align-content:start;
}

.footer-links b {
  color:#3b4d67;
  font-size:9px;
  margin-bottom:3px;
}

.footer-links a {
  color:#77869a;
  font-size:9px;
}

.footer-links a:hover {
  color:#3478f6;
}

.footer-social {
  display:grid;
  align-content:start;
  gap:11px;
  margin:3px 24px 0 0;
}

.footer-social>b {
  color:#3b4d67;
  font-size:9px;
}

.footer-social-icons {
  display:flex;
  gap:7px;
}

.social-icon {
  display:grid;
  place-items:center;
  width:29px;
  height:29px;
  border:1px solid #e1e8f1;
  border-radius:7px;
  background:#fff;
  color:#70819a;
}

.social-icon svg {
  display:block;
  width:13px;
  height:13px;
  fill:currentColor;
}

.social-icon:nth-child(2) svg {
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
}

.social-icon:nth-child(2) .instagram-dot {
  fill:currentColor;
  stroke:none;
}

.back-top {
  font-size:9px;
  color:#6e7e95;
  margin-top:4px;
}

.footer-bottom {
  min-height:43px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-top:1px solid #e4eaf2;
  color:#95a1b1;
  font-size:8px;
}

.demo-dialog {
  width:min(100% - 36px,480px);
  border:0;
  border-radius:14px;
  padding:0;
  color:var(--ink);
  box-shadow:0 25px 90px rgba(10,30,65,.28);
  max-height:calc(100% - 32px);
  overflow:auto;
}

.demo-dialog::backdrop {
  background:rgba(9,23,46,.6);
  backdrop-filter:blur(4px);
}

.dialog-content {
  padding:34px;
}

.dialog-close-form {
  position:absolute;
  top:12px;
  right:12px;
}

.dialog-close {
  width:30px;
  height:30px;
  border:1px solid #e5ebf3;
  border-radius:50%;
  background:#fff;
  color:#6d7d92;
  font-size:20px;
  line-height:1;
  cursor:pointer;
}

.dialog-content h2 {
  font:750 28px var(--font-display);
  letter-spacing:-.04em;
  margin:11px 0 8px;
}

.dialog-content>p {
  color:#75839a;
  font-size:12px;
  line-height:1.7;
  margin:0 0 21px;
}

.demo-form {
  display:grid;
  gap:13px;
}

.demo-form label {
  display:grid;
  gap:6px;
  color:#44556d;
  font-size:10px;
  font-weight:700;
}

.demo-form input,.demo-form select {
  width:100%;
  border:1px solid #dfe6f0;
  border-radius:7px;
  padding:11px 12px;
  color:#263a56;
  background:#fff;
  font-size:11px;
  outline:0;
}

.demo-form input:focus,.demo-form select:focus {
  border-color:#78a6f6;
  box-shadow:0 0 0 3px #edf4ff;
}

.demo-form input::placeholder {
  color:#a2adbc;
}

.form-submit {
  margin-top:3px;
  width:100%;
}

.demo-form>small {
  color:#98a4b4;
  font-size:8px;
  line-height:1.5;
  text-align:center;
}

.form-success {
  text-align:center;
  padding:23px 2px 4px;
}

.form-success>span {
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:50%;
  margin:0 auto 12px;
  background:#e3f8f0;
  color:#199774;
  font-size:22px;
}

.form-success h3 {
  font:700 20px var(--font-display);
  margin:0 0 8px;
}

.form-success p {
  font-size:11px;
  line-height:1.7;
  color:#718098;
  margin:0 auto 18px;
  max-width:340px;
}

@media(max-width:1000px) {

  .container {
    width:min(100% - 40px,900px);
  }

  .hero-grid {
    grid-template-columns:.85fr 1.15fr;
    gap:22px;
  }

  .hero h1 {
    font-size:50px;
  }

  .primary-nav {
    gap:20px;
  }

  .primary-nav>a:not(.button) {
    font-size:12px;
  }

  .float-tag-top {
    right:-3px;
  }

  .platform-grid {
    gap:40px;
  }

  .managers-grid {
    gap:55px;
  }

  .feature-grid {
    gap:12px;
  }

  .feature-card {
    padding:22px 18px;
  }

  .feature-card>p {
    min-height:75px;
  }
}

@media(max-width:760px) {

  html {
    scroll-padding-top:72px;
  }

  .container {
    width:min(100% - 36px,580px);
  }

  .site-header {
    height:70px;
  }

  .brand img {
    width:132px;
  }

  .menu-toggle {
    display:block;
    cursor:pointer;
  }

  .primary-nav {
    position:absolute;
    display:none;
    top:69px;
    left:0;
    right:0;
    padding:14px 20px 20px;
    background:#fff;
    border-bottom:1px solid #e8edf4;
    box-shadow:0 12px 22px rgba(15,41,77,.08);
    align-items:stretch;
    gap:0;
  }

  .primary-nav.is-open {
    display:flex;
    flex-direction:column;
  }

  .primary-nav>a:not(.button) {
    padding:13px 3px;
    border-bottom:1px solid #f0f3f8;
  }

  .primary-nav .button {
    margin-top:13px;
  }

  .hero {
    padding:58px 0 44px;
  }

  .hero-grid {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:25px;
  }

  .hero-copy {
    padding:0;
  }

  .hero h1 {
    max-width:540px;
    font-size:clamp(42px,10vw,58px);
    margin:20px 0 15px;
  }

  .hero-lede {
    font-size:14px;
  }

  .hero-actions {
    gap:18px;
    margin-top:23px;
    flex-wrap:wrap;
  }

  .hero-note {
    margin-top:21px;
  }

  .hero-visual {
    padding:20px 6px 32px;
  }

  .dashboard-window {
    transform:none;
  }

  .float-tag-top {
    right:-2px;
    top:-2px;
  }

  .float-tag-bottom {
    left:-1px;
    bottom:16px;
  }

  .visual-caption {
    right:10px;
  }

  .dash-body {
    min-height:310px;
  }

  .dash-content {
    padding:14px 12px 11px;
  }

  .dash-sidebar {
    width:34px;
  }

  .dash-lower {
    grid-template-columns:1.55fr .8fr;
  }

  .dash-stat {
    padding:7px 6px;
  }

  .dash-stat>strong {
    font-size:17px;
  }

  .dash-stat>small {
    font-size:5px;
  }

  .table-row {
    grid-template-columns:.55fr 1.5fr 1fr 16px;
  }

  .value-grid {
    padding:19px 0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
  }

  .value-intro {
    grid-column:1/-1;
    font-size:13px;
  }

  .value-item {
    font-size:9px;
  }

  .value-icon {
    width:25px;
    height:25px;
    font-size:13px;
  }

  .section {
    padding:76px 0;
  }

  .section-heading h2 {
    font-size:36px;
  }

  .section-heading p {
    font-size:12px;
  }

  .feature-grid {
    grid-template-columns:1fr;
    gap:12px;
    margin-top:33px;
  }

  .feature-card {
    min-height:0;
    padding:23px;
  }

  .feature-card>p {
    min-height:0;
    max-width:460px;
  }

  .ticket-preview,.sla-preview,.bi-preview {
    max-width:420px;
    margin-top:18px;
  }

  .feature-more {
    align-items:flex-start;
    flex-direction:column;
    gap:13px;
  }

  .more-chips {
    flex-wrap:wrap;
  }

  .more-chips span {
    font-size:8px;
    padding:8px 9px;
  }

  .platform-section {
    padding:70px 0;
  }

  .platform-grid {
    grid-template-columns:1fr;
    gap:38px;
  }

  .platform-copy h2 {
    font-size:38px;
  }

  .platform-copy>p {
    font-size:12px;
  }

  .workflow-visual {
    min-height:320px;
  }

  .workflow-canvas {
    height:229px;
  }

  .node-start {
    left:5%;
    top:35px;
  }

  .node-review {
    left:37%;
    top:35px;
  }

  .node-work {
    left:37%;
    top:125px;
  }

  .node-done {
    right:3%;
    top:125px;
  }

  .node-approval {
    left:5%;
    top:170px;
  }

  .line-one {
    left:calc(5% + 143px);
    top:61px;
    width:calc(32% - 143px);
  }

  .line-two {
    left:calc(37% + 71px);
    top:87px;
    height:38px;
  }

  .line-three {
    left:calc(37% + 143px);
    top:151px;
    width:calc(45% - 143px);
  }

  .flow-branch {
    left:5%;
    top:108px;
  }

  .person-one {
    left:calc(37% + 95px);
    top:137px;
  }

  .person-two {
    right:4%;
    top:164px;
  }

  .managers-section {
    padding:76px 0;
  }

  .managers-grid {
    grid-template-columns:1fr;
    gap:29px;
  }

  .managers-copy h2 {
    font-size:35px;
  }

  .managers-copy>p {
    font-size:12px;
  }

  .manager-card {
    padding:14px;
  }

  .apps-inner {
    align-items:flex-start;
    flex-direction:column;
    gap:21px;
  }

  .app-platforms {
    width:100%;
  }

  .app-platform-card {
    flex:1;
  }

  .quote-cta {
    padding:61px 0;
  }

  .quote-inner h2 {
    font-size:34px;
  }

  .quote-inner>p {
    font-size:11px;
  }

  .quote-actions {
    flex-direction:column;
  }

  .quote-actions .button {
    width:min(100%,320px);
  }

  .faq-section {
    padding:76px 0;
  }

  .faq-grid {
    grid-template-columns:1fr;
    gap:28px;
  }

  .faq-intro h2 {
    font-size:32px;
  }

  .faq-intro>p {
    max-width:460px;
  }

  .faq-item summary {
    font-size:11px;
  }

  .footer-main {
    flex-wrap:wrap;
    gap:25px;
    padding:31px 0 24px;
  }

  .footer-brand {
    flex-basis:100%;
  }

  .footer-links {
    margin:0 auto 0 0;
    gap:45px;
  }

  .back-top {
    align-self:flex-end;
  }

  .footer-bottom {
    min-height:52px;
    gap:10px;
    font-size:7px;
  }

  .dialog-content {
    padding:30px 24px;
  }
}

@media(max-width:440px) {

  .app-platforms {
    flex-direction:column;
  }

  .app-platform-card {
    min-width:0;
  }

  .container {
    width:calc(100% - 30px);
  }

  .hero h1 {
    font-size:41px;
  }

  .eyebrow {
    font-size:8px;
  }

  .hero-actions {
    align-items:flex-start;
    flex-direction:column;
    gap:9px;
  }

  .hero-actions .button-primary {
    width:100%;
  }

  .hero-actions .button-text {
    padding-left:4px;
  }

  .hero-visual {
    padding-inline:0;
  }

  .dash-topbar {
    height:34px;
  }

  .dash-body {
    min-height:260px;
  }

  .dash-sidebar {
    width:27px;
    gap:11px;
  }

  .dash-side-item {
    width:21px;
    height:21px;
    font-size:11px;
  }

  .dash-content {
    padding:11px 8px 8px;
  }

  .dash-greeting h3 {
    font-size:13px;
  }

  .dash-stat-row {
    gap:4px;
  }

  .dash-stat {
    padding:6px 5px;
  }

  .stat-label {
    font-size:6px;
  }

  .dash-stat>strong {
    font-size:15px;
    margin:6px 0 3px;
  }

  .dash-stat>small {
    white-space:normal;
    line-height:1.4;
  }

  .dash-lower {
    grid-template-columns:1.4fr .8fr;
    gap:4px;
  }

  .dash-chart-card,.dash-priority-card {
    padding:7px 6px 5px;
  }

  .chart-area {
    height:58px;
  }

  .priority-donut {
    width:58px;
    height:58px;
  }

  .dash-table {
    margin-top:5px;
  }

  .table-title {
    padding:6px;
    font-size:6px;
  }

  .table-row {
    padding:5px 6px;
    grid-template-columns:.6fr 1.3fr 1fr 15px;
    font-size:5px;
  }

  .status-pill {
    font-size:4px;
    padding:3px;
  }

  .float-tag {
    padding:8px 9px;
    gap:6px;
  }

  .float-tag b {
    font-size:7px;
  }

  .float-tag small {
    font-size:6px;
  }

  .value-grid {
    column-gap:8px;
  }

  .value-item {
    font-size:8px;
    gap:6px;
  }

  .feature-card h3 {
    font-size:18px;
  }

  .section-heading h2 {
    font-size:32px;
  }

  .workflow-visual {
    min-height:290px;
  }

  .workflow-canvas {
    height:199px;
  }

  .flow-node {
    width:125px;
    height:47px;
    gap:6px;
    padding:6px;
  }

  .flow-node b {
    font-size:7px;
  }

  .node-symbol {
    width:22px;
    height:22px;
  }

  .node-start {
    left:3%;
    top:30px;
  }

  .node-review {
    left:36%;
    top:30px;
  }

  .node-work {
    left:36%;
    top:112px;
  }

  .node-done {
    right:2%;
    top:112px;
  }

  .node-approval {
    left:3%;
    top:150px;
    width:120px;
  }

  .line-one {
    left:calc(3% + 125px);
    top:53px;
    width:calc(33% - 125px);
  }

  .line-two {
    left:calc(36% + 62px);
    top:77px;
    height:35px;
  }

  .line-three {
    left:calc(36% + 125px);
    top:135px;
    width:calc(48% - 125px);
  }

  .flow-branch {
    left:3%;
    top:95px;
    width:120px;
  }

  .flow-branch b {
    left:80px;
  }

  .flow-branch i {
    left:55px;
  }

  .person-one {
    left:calc(36% + 82px);
    top:123px;
  }

  .person-two {
    right:2%;
    top:148px;
  }

  .workflow-topline,.workflow-footer {
    padding-inline:12px;
  }

  .workflow-footer {
    font-size:7px;
  }

  .footer-links {
    gap:25px;
  }

  .back-top {
    font-size:8px;
  }

  .footer-bottom span:last-child {
    text-align:right;
  }
}

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

  html {
    scroll-behavior:auto;
  }

  *,*:before,*:after {
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}