:root {
  --brand-lime: #d9e889;
  --brand-lime-strong: #cfe46a;
  --brand-pink: #f2bfde;
  --brand-cream: #fffaf0;
  --ink-950: #0b1020;
  --ink-800: #1c2740;
  --ink-650: #465775;
  --ink-500: #71809a;
  --surface: #f4f9fd;
  --surface-strong: #ffffff;
  --border: rgba(15, 23, 42, 0.12);
  --shadow-sm: 0 8px 20px rgba(15, 23, 42, 0.08);
  --shadow-md: 0 18px 45px rgba(15, 23, 42, 0.13);
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --container: 1220px;
}

.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  margin: 0;
  color: var(--ink-950);
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.98), rgba(244, 249, 253, 0.92) 44rem),
    linear-gradient(180deg, #f6fbff 0%, #eef6fb 100%);
  font-family: "Manrope", "Segoe UI", sans-serif;
  line-height: 1.5;
  overflow-x: hidden;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(15, 23, 42, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 23, 42, 0.035) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, transparent, #000 14%, #000 72%, transparent);
}

a {
  color: inherit;
}

code {
  padding: 0.15rem 0.35rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.75);
}

.skip-link {
  position: fixed;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 100;
  padding: 0.75rem 1rem;
  border-radius: 999px;
  color: var(--ink-950);
  background: var(--surface-strong);
  box-shadow: var(--shadow-sm);
  transform: translateY(-160%);
  transition: transform 180ms ease;
}

.skip-link:focus {
  transform: translateY(0);
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  border-bottom: 1px solid rgba(15, 23, 42, 0.09);
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(18px);
}

.nav-shell {
  width: min(calc(100% - 2rem), var(--container));
  min-height: 82px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1rem;
}

.brand-mark {
  grid-column: 2;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  letter-spacing: -0.06em;
  line-height: 0.86;
}

.brand-word {
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: clamp(2rem, 4vw, 3.15rem);
  font-weight: 700;
}

.brand-word span:first-child {
  color: var(--brand-lime-strong);
}

.brand-word span:last-child {
  color: var(--brand-pink);
}

.brand-subtitle {
  margin-top: 0.18rem;
  color: var(--ink-800);
  font-size: 0.88rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.nav-links {
  grid-column: 3;
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--ink-650);
  font-size: 0.93rem;
  font-weight: 700;
}

.nav-links a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.nav-links > a:not(.nav-button) {
  padding: 0 0.35rem;
}

.nav-links > a:hover {
  color: var(--ink-950);
}

.nav-button {
  padding: 0.7rem 1rem;
  border: 1px solid var(--border);
  border-radius: 9px;
}

.nav-button--primary {
  color: var(--ink-950);
  background: var(--brand-lime);
  border-color: color-mix(in srgb, var(--brand-lime) 80%, #899639);
}

main {
  width: min(calc(100% - 2rem), var(--container));
  margin: 0 auto;
}

.hero {
  max-width: 760px;
  margin: 0 auto;
  padding: clamp(4rem, 7vw, 6.8rem) 0 3rem;
  text-align: center;
}

.suite-pill,
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  width: fit-content;
  min-height: 34px;
  padding: 0.42rem 0.8rem;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 999px;
  color: var(--ink-650);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
  font-size: 0.9rem;
  font-weight: 700;
}

.suite-pill__dot {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 3px;
  background:
    linear-gradient(90deg, transparent 35%, var(--ink-650) 35% 65%, transparent 65%),
    linear-gradient(transparent 35%, var(--ink-650) 35% 65%, transparent 65%);
  opacity: 0.72;
}

.hero h1 {
  max-width: 680px;
  margin: 1.2rem auto 1rem;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: clamp(2.8rem, 7.5vw, 5.25rem);
  line-height: 0.94;
  letter-spacing: -0.075em;
}

.hero-copy {
  max-width: 680px;
  margin: 0 auto;
  color: var(--ink-650);
  font-size: clamp(1rem, 2vw, 1.18rem);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 1.65rem;
}

.button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: 0.74rem 1rem;
  border: 1px solid transparent;
  border-radius: 10px;
  font-family: inherit;
  font-size: 0.93rem;
  font-weight: 800;
  text-decoration: none;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    background-color 180ms ease,
    border-color 180ms ease;
}

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

.button:focus-visible,
.nav-links a:focus-visible,
.brand-mark:focus-visible,
.app-card__launch-overlay:focus-visible {
  outline: 3px solid rgba(11, 16, 32, 0.78);
  outline-offset: 4px;
}

.button--primary,
.button--launch {
  color: var(--ink-950);
  background: var(--brand-lime);
  border-color: color-mix(in srgb, var(--brand-lime) 75%, #8d973d);
  box-shadow: 0 12px 22px rgba(154, 172, 64, 0.2);
}

.button--primary::before {
  content: "";
  width: 0.58rem;
  height: 0.58rem;
  border: 1.8px solid currentColor;
  border-radius: 999px;
  box-shadow: inset -3px 0 0 currentColor;
}

.button--secondary {
  color: var(--ink-950);
  background: rgba(255, 255, 255, 0.42);
  border-color: var(--ink-950);
}

.button--disabled {
  color: rgba(11, 16, 32, 0.58);
  background: rgba(217, 232, 137, 0.72);
  cursor: not-allowed;
}

.button--launch.is-disabled {
  color: rgba(11, 16, 32, 0.54);
  background: rgba(217, 232, 137, 0.5);
  border-color: rgba(113, 128, 154, 0.2);
  box-shadow: none;
  cursor: wait;
  pointer-events: none;
}

.button:disabled {
  transform: none;
  box-shadow: none;
}

.button--light {
  color: var(--ink-950);
  background: #fff;
}

.external-note {
  padding: 0.1rem 0.34rem;
  border: 1px solid rgba(11, 16, 32, 0.14);
  border-radius: 999px;
  color: rgba(11, 16, 32, 0.74);
  background: rgba(255, 255, 255, 0.38);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.apps-section {
  padding: 1rem 0 1.25rem;
}

.section-heading {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 1.5rem;
  margin-bottom: 1.2rem;
}

.section-heading h2 {
  margin: 0.6rem 0 0;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: clamp(2rem, 4vw, 3rem);
  letter-spacing: -0.055em;
}

.section-heading p {
  max-width: 440px;
  margin: 0;
  color: var(--ink-650);
  font-weight: 600;
}

.app-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.app-card {
  min-height: 280px;
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  animation: card-reveal 460ms ease both;
  animation-delay: var(--reveal-delay, 0ms);
  transition:
    transform 190ms ease,
    box-shadow 190ms ease,
    border-color 190ms ease;
}

.reveal-delay-0 {
  --reveal-delay: 0ms;
}

.reveal-delay-1 {
  --reveal-delay: 55ms;
}

.reveal-delay-2 {
  --reveal-delay: 110ms;
}

.reveal-delay-3 {
  --reveal-delay: 165ms;
}

.reveal-delay-4 {
  --reveal-delay: 220ms;
}

.reveal-delay-5 {
  --reveal-delay: 275ms;
}

.reveal-delay-6 {
  --reveal-delay: 330ms;
}

.app-card:hover {
  transform: translateY(-5px);
  border-color: rgba(15, 23, 42, 0.19);
  box-shadow: var(--shadow-md);
}

.app-card.is-pressed {
  transform: translateY(-2px) scale(0.995);
}

.app-card.is-disabled {
  opacity: 0.72;
}

.app-card.is-unavailable {
  filter: saturate(0.82);
}

.app-card.is-unavailable .app-card__art {
  opacity: 0.88;
}

.app-card.is-disabled:hover {
  transform: none;
  box-shadow: var(--shadow-sm);
}

.app-card__art {
  --tile-bg: #e9f9fd;
  --tile-line: rgba(14, 165, 176, 0.16);
  min-height: 112px;
  position: relative;
  display: flex;
  align-items: center;
  padding: 1rem;
  background:
    radial-gradient(circle at 88% 18%, rgba(255, 255, 255, 0.9), transparent 3.5rem),
    repeating-linear-gradient(135deg, var(--tile-line) 0 2px, transparent 2px 26px),
    var(--tile-bg);
}

.app-icon {
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center;
  border: 8px solid rgba(255, 255, 255, 0.72);
  border-radius: 24px;
  color: #111;
  background: #fff;
  box-shadow:
    0 10px 22px rgba(15, 23, 42, 0.1),
    0 0 0 1px rgba(15, 23, 42, 0.08);
}

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

.status {
  position: absolute;
  top: 1rem;
  right: 1rem;
  padding: 0.28rem 0.58rem;
  border-radius: 999px;
  color: var(--ink-950);
  background: var(--brand-lime);
  border: 1px solid rgba(15, 23, 42, 0.12);
  font-size: 0.75rem;
  font-weight: 900;
}

.status--online {
  color: #fff;
  background: #12805c;
}

.status--offline {
  color: #fff;
  background: #9f1239;
}

.status--checking {
  background: #ffb13b;
}

.status--configured {
  background: #d8dee9;
}

.app-card__body {
  position: relative;
  z-index: 0;
  flex: 1;
  padding: 1rem 1.05rem 0.5rem;
}

.app-card__launch-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  text-decoration: none;
  pointer-events: none;
}

.app-card__launch-overlay:not(.is-disabled) {
  pointer-events: auto;
}

.app-card__launch-overlay:focus-visible {
  outline-offset: -6px;
}

.app-category {
  margin: 0 0 0.42rem;
  color: var(--ink-500);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.app-card h3 {
  margin: 0 0 0.55rem;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: 1.12rem;
  letter-spacing: -0.035em;
}

.app-card__body p:last-child {
  margin: 0;
  color: var(--ink-650);
  font-size: 0.92rem;
}

.app-card__actions {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 1rem;
}

.app-card__actions .button {
  min-height: 40px;
  padding: 0.62rem 0.85rem;
  font-size: 0.82rem;
}

.theme-compliance .app-card__art {
  --tile-bg: #dff9fc;
  --tile-line: rgba(14, 165, 176, 0.16);
}

.theme-send .app-card__art {
  --tile-bg: #f8fbff;
  --tile-line: rgba(52, 111, 178, 0.14);
  background:
    radial-gradient(circle at 85% 85%, rgba(255, 255, 255, 0.92), transparent 4rem),
    linear-gradient(90deg, transparent 0 65%, rgba(52, 111, 178, 0.06) 65%),
    repeating-linear-gradient(0deg, var(--tile-line) 0 1px, transparent 1px 24px),
    var(--tile-bg);
}

.theme-coresync .app-card__art {
  --tile-bg: #e8f2ff;
  --tile-line: rgba(28, 126, 214, 0.15);
  background:
    repeating-linear-gradient(0deg, transparent 0 30px, var(--tile-line) 30px 33px),
    var(--tile-bg);
}

.theme-flexidesk .app-card__art {
  --tile-bg: #f5e9ff;
  --tile-line: rgba(122, 79, 183, 0.12);
  background:
    linear-gradient(90deg, var(--tile-line) 1px, transparent 1px),
    linear-gradient(var(--tile-line) 1px, transparent 1px),
    var(--tile-bg);
  background-size: 22px 22px;
}

.theme-admissions .app-card__art {
  --tile-bg: #fff8dd;
  --tile-line: rgba(176, 129, 0, 0.14);
  background:
    radial-gradient(circle at 20px 20px, rgba(176, 129, 0, 0.1) 2px, transparent 2px),
    repeating-linear-gradient(15deg, transparent 0 28px, var(--tile-line) 28px 30px),
    var(--tile-bg);
  background-size: 42px 42px, auto, auto;
}

.theme-meals .app-card__art {
  --tile-bg: #fff1e5;
  --tile-line: rgba(217, 110, 0, 0.14);
  background:
    repeating-radial-gradient(ellipse at center, var(--tile-line) 0 2px, transparent 2px 13px),
    var(--tile-bg);
}

.operator-panel,
.access-panel {
  margin: 1rem 0;
  display: grid;
  align-items: center;
  gap: 1rem;
  border-radius: var(--radius-md);
}

.operator-panel {
  grid-template-columns: 160px 1fr auto;
  padding: 1.3rem 1.45rem;
  color: #fff;
  background: #11172a;
  box-shadow: var(--shadow-sm);
}

.operator-mark {
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.05em;
}

.operator-panel h2,
.access-panel h2 {
  margin: 0;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  letter-spacing: -0.045em;
}

.operator-panel p,
.access-panel p {
  margin: 0.25rem 0 0;
  color: rgba(255, 255, 255, 0.78);
}

.access-panel {
  grid-template-columns: 1fr auto;
  padding: 1.25rem 1.45rem;
  background: var(--brand-lime);
}

.access-panel p {
  color: rgba(11, 16, 32, 0.68);
  font-weight: 600;
}

.empty-state,
.legal-page {
  max-width: 760px;
  margin: 4rem auto;
  padding: 2rem;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  text-align: center;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: var(--shadow-sm);
}

.legal-page h1 {
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: clamp(2.4rem, 6vw, 4rem);
  letter-spacing: -0.06em;
}

.site-footer {
  margin-top: 1rem;
  padding: 1.6rem 1rem 2.2rem;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  color: #5b6b82;
  background: rgba(255, 255, 255, 0.75);
  text-align: center;
  font-size: 0.86rem;
}

.site-footer p {
  margin: 0.2rem 0;
}

.site-footer a {
  color: #45556b;
  font-weight: 800;
  text-decoration: none;
}

.site-footer a:hover {
  color: var(--ink-950);
  text-decoration: underline;
}

.ambient-blobs {
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  overflow: hidden;
}

.blob {
  position: absolute;
  width: clamp(26rem, 44vw, 48rem);
  aspect-ratio: 1;
  border-radius: 57% 43% 45% 55% / 44% 57% 43% 56%;
  opacity: 0.28;
  filter: blur(1px);
  animation: blob-morph 42s ease-in-out infinite alternate;
}

.blob--lime {
  top: 18vh;
  left: -18rem;
  background: color-mix(in srgb, var(--brand-lime) 58%, white);
}

.blob--pink {
  top: 15vh;
  right: -18rem;
  background: color-mix(in srgb, var(--brand-pink) 48%, white);
  animation-delay: -12s;
}

.blob--blue {
  right: 8vw;
  bottom: -24rem;
  background: #e9eefb;
  animation-delay: -24s;
}

@keyframes blob-morph {
  0% {
    border-radius: 57% 43% 45% 55% / 44% 57% 43% 56%;
    transform: translate3d(0, 0, 0) rotate(0deg) scale(1);
  }

  50% {
    border-radius: 38% 62% 57% 43% / 60% 38% 62% 40%;
    transform: translate3d(1.5vw, -1vh, 0) rotate(8deg) scale(1.04);
  }

  100% {
    border-radius: 64% 36% 50% 50% / 40% 60% 45% 55%;
    transform: translate3d(-1vw, 1vh, 0) rotate(-6deg) scale(0.98);
  }
}

@keyframes card-reveal {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 980px) {
  .nav-shell {
    min-height: 74px;
    grid-template-columns: auto 1fr;
  }

  .brand-mark {
    grid-column: 1;
    align-items: flex-start;
  }

  .brand-word {
    font-size: 2.1rem;
  }

  .brand-subtitle {
    font-size: 0.7rem;
  }

  .nav-links {
    grid-column: 2;
  }

  .nav-links > a:not(.nav-button) {
    display: none;
  }

  .app-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .section-heading,
  .operator-panel,
  .access-panel {
    grid-template-columns: 1fr;
  }

  .operator-panel,
  .access-panel {
    align-items: start;
  }
}

@media (max-width: 640px) {
  main,
  .nav-shell {
    width: min(calc(100% - 1rem), var(--container));
  }

  .nav-links {
    gap: 0.45rem;
  }

  .nav-button {
    padding: 0.62rem 0.7rem;
    font-size: 0.82rem;
  }

  .hero {
    padding-top: 3rem;
    text-align: left;
  }

  .hero h1 {
    margin-left: 0;
    margin-right: 0;
  }

  .hero-copy {
    margin-left: 0;
  }

  .hero-actions {
    justify-content: flex-start;
  }

  .hero-actions .button,
  .access-panel .button,
  .operator-panel .button {
    width: 100%;
  }

  .section-heading {
    display: block;
  }

  .section-heading p {
    margin-top: 0.5rem;
  }

  .app-grid {
    grid-template-columns: 1fr;
  }

  .app-card__actions .button {
    flex: 1 1 100%;
  }

  .blob--lime {
    left: -24rem;
  }

  .blob--pink {
    right: -24rem;
  }

  .blob--blue {
    display: none;
  }
}

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

/* Premium application card refresh */
.app-grid {
  gap: clamp(1rem, 2vw, 1.35rem);
}

.app-card {
  --accent: #0ea5b0;
  --accent-soft: rgba(14, 165, 176, 0.14);
  --accent-line: rgba(14, 165, 176, 0.12);
  min-height: 312px;
  border: 1px solid rgba(24, 37, 65, 0.11);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(255, 255, 255, 0.91)),
    radial-gradient(circle at 0% 0%, var(--accent-soft), transparent 36%);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 18px 42px rgba(20, 35, 60, 0.11);
}

.app-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.5), transparent 28%),
    linear-gradient(180deg, transparent 76%, rgba(15, 23, 42, 0.026));
  z-index: 0;
}

.app-card:hover {
  transform: translateY(-7px);
  border-color: color-mix(in srgb, var(--accent) 38%, rgba(15, 23, 42, 0.18));
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 26px 58px rgba(20, 35, 60, 0.16);
}

.app-card__art {
  min-height: 128px;
  isolation: isolate;
  align-items: flex-start;
  padding: 1.25rem;
  border-bottom: 1px solid rgba(15, 23, 42, 0.07);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, white), rgba(255, 255, 255, 0.8)),
    linear-gradient(90deg, var(--accent-line) 1px, transparent 1px),
    linear-gradient(var(--accent-line) 1px, transparent 1px);
  background-size: auto, 34px 34px, 34px 34px;
}

.app-card__art::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 90% 12%, rgba(255, 255, 255, 0.76), transparent 5rem);
}

.app-card__shine {
  display: none;
}

.app-icon {
  width: 82px;
  height: 82px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 28px;
  color: var(--ink-950);
  background:
    linear-gradient(180deg, #fff, rgba(255, 255, 255, 0.9));
  box-shadow:
    0 14px 28px rgba(15, 23, 42, 0.12),
    0 0 0 7px rgba(255, 255, 255, 0.38);
}

.app-icon svg {
  width: 44px;
  height: 44px;
}

.status {
  top: 1.18rem;
  right: 1.18rem;
  padding: 0.42rem 0.72rem;
  border: 1px solid rgba(255, 255, 255, 0.72);
  box-shadow:
    0 10px 22px rgba(15, 23, 42, 0.12),
    0 1px 0 rgba(255, 255, 255, 0.5) inset;
}

.app-card__body {
  z-index: 1;
  padding: 1.18rem 1.35rem 0.64rem;
}

.app-category {
  margin: 0 0 0.72rem;
  color: #637691;
  font-size: 0.76rem;
  letter-spacing: 0.1em;
}

.app-card h3 {
  margin-bottom: 0.62rem;
  font-size: 1.26rem;
  font-weight: 700;
  letter-spacing: -0.045em;
}

.app-card__body p:last-child {
  color: #4f6180;
  font-size: 0.98rem;
  line-height: 1.62;
}

.app-card__actions {
  padding: 0.85rem 1.35rem 1.28rem;
}

.app-card__actions .button {
  min-height: 46px;
  padding: 0.72rem 0.9rem;
  border-radius: 13px;
}

.button--launch {
  color: #162033;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--brand-lime) 88%, white), var(--brand-lime)),
    var(--brand-lime);
  border-color: color-mix(in srgb, var(--brand-lime) 72%, #7d8732);
}

.button--launch:not(.is-disabled):hover {
  box-shadow:
    0 14px 24px rgba(154, 172, 64, 0.24),
    0 0 0 4px rgba(217, 232, 137, 0.28);
}

.external-note {
  background: rgba(255, 255, 255, 0.64);
}

.theme-compliance {
  --accent: #0ea5b0;
  --accent-soft: rgba(14, 165, 176, 0.16);
  --accent-line: rgba(14, 165, 176, 0.22);
}

.theme-send {
  --accent: #3366a8;
  --accent-soft: rgba(51, 102, 168, 0.14);
  --accent-line: rgba(51, 102, 168, 0.18);
}

.theme-coresync {
  --accent: #1c7ed6;
  --accent-soft: rgba(28, 126, 214, 0.15);
  --accent-line: rgba(28, 126, 214, 0.18);
}

.theme-flexidesk {
  --accent: #8a55cc;
  --accent-soft: rgba(138, 85, 204, 0.15);
  --accent-line: rgba(138, 85, 204, 0.18);
}

.theme-admissions {
  --accent: #bd8500;
  --accent-soft: rgba(189, 133, 0, 0.15);
  --accent-line: rgba(189, 133, 0, 0.18);
}

.theme-meals {
  --accent: #d96e00;
  --accent-soft: rgba(217, 110, 0, 0.15);
  --accent-line: rgba(217, 110, 0, 0.18);
}

.theme-compliance .app-card__art,
.theme-send .app-card__art,
.theme-coresync .app-card__art,
.theme-flexidesk .app-card__art,
.theme-admissions .app-card__art,
.theme-meals .app-card__art {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, white), rgba(255, 255, 255, 0.8)),
    linear-gradient(90deg, var(--accent-line) 1px, transparent 1px),
    linear-gradient(var(--accent-line) 1px, transparent 1px);
  background-size: auto, 34px 34px, 34px 34px;
}

.operator-panel {
  grid-template-columns: 180px 1fr auto;
  padding: 1.45rem 1.6rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background:
    radial-gradient(circle at 12% 20%, rgba(217, 232, 137, 0.18), transparent 12rem),
    linear-gradient(135deg, #11172a, #172036);
}

.operator-panel h2 {
  font-size: clamp(1.35rem, 2vw, 1.8rem);
}

.operator-panel p {
  max-width: 760px;
}

@media (max-width: 980px) {
  .operator-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .app-card {
    min-height: 304px;
  }

  .app-card__art {
    min-height: 126px;
  }

  .app-icon {
    width: 76px;
    height: 76px;
    border-radius: 24px;
  }

  .app-card__actions .button {
    width: 100%;
  }
}

/* Application Workspace target design */
body {
  background:
    radial-gradient(circle at 8% 26%, rgba(217, 232, 137, 0.22), transparent 19rem),
    radial-gradient(circle at 96% 34%, rgba(242, 191, 222, 0.24), transparent 22rem),
    linear-gradient(180deg, #fbfdff 0%, #f3f7fc 100%);
}

main {
  width: min(calc(100% - 3rem), 1480px);
  padding: 1.8rem 0 2.8rem;
}

.site-footer {
  display: none;
}

.workspace-shell {
  padding: clamp(1.25rem, 2vw, 2rem);
  border: 1px solid rgba(31, 49, 82, 0.09);
  border-radius: 26px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.78)),
    radial-gradient(circle at 20% 0%, rgba(93, 177, 255, 0.08), transparent 26rem);
  box-shadow:
    0 32px 90px rgba(31, 49, 82, 0.12),
    0 1px 0 rgba(255, 255, 255, 0.92) inset;
}

.workspace-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 2.5rem;
}

.workspace-title-group {
  display: flex;
  align-items: center;
  gap: 1.35rem;
}

.workspace-home {
  width: 68px;
  height: 68px;
  display: grid;
  grid-template-columns: repeat(3, 6px);
  grid-auto-rows: 6px;
  place-content: center;
  gap: 7px;
  flex: 0 0 auto;
  border: 1px solid rgba(110, 99, 255, 0.22);
  border-radius: 18px;
  background:
    linear-gradient(180deg, #fff, #f8f9ff),
    radial-gradient(circle at 30% 20%, rgba(110, 99, 255, 0.12), transparent 60%);
  box-shadow: 0 12px 28px rgba(64, 78, 120, 0.1);
}

.workspace-home span {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #526381;
}

.workspace-header h1 {
  margin: 0;
  color: #102044;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: clamp(2rem, 3vw, 3.1rem);
  line-height: 1;
  letter-spacing: -0.065em;
}

.workspace-header p {
  margin: 0.5rem 0 0;
  color: #607399;
  font-size: clamp(1rem, 1.4vw, 1.22rem);
  font-weight: 650;
}

.workspace-tools {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.workspace-search {
  min-width: min(360px, 32vw);
  min-height: 54px;
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0 1.1rem;
  border: 1px solid rgba(31, 49, 82, 0.12);
  border-radius: 13px;
  color: #35496f;
  background: rgba(255, 255, 255, 0.84);
  box-shadow: 0 12px 26px rgba(31, 49, 82, 0.06);
}

.workspace-search svg {
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
}

.workspace-search input {
  width: 100%;
  border: 0;
  outline: 0;
  color: #102044;
  background: transparent;
  font: inherit;
  font-weight: 700;
}

.workspace-search input::placeholder {
  color: #9aa9c0;
}

.workspace-search:focus-within {
  border-color: rgba(35, 138, 245, 0.48);
  box-shadow:
    0 12px 26px rgba(31, 49, 82, 0.06),
    0 0 0 4px rgba(35, 138, 245, 0.12);
}

.apps-section {
  padding: 0;
}

.app-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.35rem, 2vw, 1.85rem);
}

.app-card {
  --accent: #0d9488;
  --accent-soft: rgba(13, 148, 136, 0.11);
  --accent-line: rgba(13, 148, 136, 0.32);
  min-height: 360px;
  position: relative;
  border: 1px solid rgba(32, 50, 83, 0.11);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 20px 46px rgba(31, 49, 82, 0.1);
  overflow: hidden;
}

.app-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(18rem 13rem at 92% 3%, var(--accent-soft), transparent 68%),
    radial-gradient(13rem 10rem at 78% 24%, rgba(255, 255, 255, 0.58), transparent 70%);
  z-index: 0;
}

.app-card::after {
  content: "";
  position: absolute;
  right: 1.9rem;
  top: 9.8rem;
  width: 70px;
  height: 70px;
  pointer-events: none;
  opacity: 0.36;
  background-image: radial-gradient(circle, currentColor 2px, transparent 2px);
  background-size: 14px 14px;
  color: var(--accent);
}

.app-card__rail {
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  background: linear-gradient(180deg, var(--accent), color-mix(in srgb, var(--accent) 55%, white));
  z-index: 2;
}

.app-card:hover {
  transform: translateY(-5px);
  border-color: color-mix(in srgb, var(--accent) 35%, rgba(32, 50, 83, 0.14));
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 28px 58px rgba(31, 49, 82, 0.14);
}

.app-card__art {
  min-height: auto;
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 1.55rem 1.55rem 0;
  border-bottom: 0;
  background: transparent !important;
}

.app-card__art::after {
  display: none;
}

.app-icon {
  width: 86px;
  height: 86px;
  border: 1px solid rgba(32, 50, 83, 0.08);
  border-radius: 18px;
  color: color-mix(in srgb, var(--accent) 72%, #102044);
  background: rgba(255, 255, 255, 0.94);
  box-shadow:
    0 16px 30px rgba(31, 49, 82, 0.11),
    0 1px 0 rgba(255, 255, 255, 0.95) inset;
}

.app-icon svg {
  width: 52px;
  height: 52px;
}

.status {
  position: relative;
  top: auto;
  right: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.48rem 0.82rem;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, white);
  border-radius: 999px;
  color: color-mix(in srgb, var(--accent) 78%, #102044);
  background: rgba(255, 255, 255, 0.68);
  box-shadow: none;
  font-size: 0.84rem;
  font-weight: 850;
}

.status::before {
  content: "";
  width: 0.58rem;
  height: 0.58rem;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 0 4px color-mix(in srgb, currentColor 13%, transparent);
}

.status--checking {
  color: #a76600;
  background: rgba(255, 247, 231, 0.88);
}

.status--online {
  color: #008764;
  background: rgba(235, 255, 248, 0.82);
}

.status--offline {
  color: #d9480f;
  background: rgba(255, 242, 236, 0.82);
}

.status--configured {
  color: #526381;
  background: rgba(242, 245, 249, 0.86);
}

.app-card__body {
  position: relative;
  z-index: 1;
  padding: 2.35rem 2rem 0.95rem;
}

.app-category {
  margin: 0 0 1rem;
  color: var(--accent);
  font-size: 0.92rem;
  font-weight: 950;
  letter-spacing: 0.085em;
}

.app-card h3 {
  margin: 0 0 0.8rem;
  color: #102044;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: clamp(1.42rem, 1.7vw, 1.75rem);
  font-weight: 750;
  letter-spacing: -0.055em;
}

.app-card__body p:last-child {
  max-width: 340px;
  color: #526b95;
  font-size: 1.05rem;
  line-height: 1.65;
  font-weight: 600;
}

.app-card__actions {
  position: relative;
  z-index: 2;
  padding: 1.05rem 2rem 1.9rem;
}

.app-card__actions .button {
  width: 100%;
  min-height: 56px;
  justify-content: center;
  border-radius: 10px;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 5%, white);
  border-color: color-mix(in srgb, var(--accent) 22%, white);
  box-shadow: none;
  font-size: 1rem;
}

.button--launch svg {
  width: 22px;
  height: 22px;
  margin-left: auto;
}

.button--launch:not(.is-disabled):hover {
  color: #fff;
  background: var(--accent);
  border-color: var(--accent);
  box-shadow: 0 14px 24px color-mix(in srgb, var(--accent) 22%, transparent);
}

.button--launch.is-disabled {
  color: #7c8aa1;
  background: rgba(247, 249, 252, 0.82);
  border-color: rgba(32, 50, 83, 0.1);
  cursor: wait;
}

.external-note {
  display: none;
}

.app-card.is-unavailable {
  filter: none;
}

.app-card.is-unavailable .app-card__art {
  opacity: 1;
}

.theme-compliance {
  --accent: #009c89;
  --accent-soft: rgba(0, 156, 137, 0.12);
}

.theme-send {
  --accent: #238af5;
  --accent-soft: rgba(35, 138, 245, 0.11);
}

.theme-coresync {
  --accent: #27a9e5;
  --accent-soft: rgba(39, 169, 229, 0.14);
}

.theme-flexidesk {
  --accent: #7c3fd5;
  --accent-soft: rgba(124, 63, 213, 0.12);
}

.theme-admissions {
  --accent: #d97706;
  --accent-soft: rgba(217, 119, 6, 0.13);
}

.theme-meals {
  --accent: #f04e23;
  --accent-soft: rgba(240, 78, 35, 0.13);
}

.theme-parent-crm {
  --accent: #0f766e;
  --accent-soft: rgba(15, 118, 110, 0.13);
}

.operator-panel {
  max-width: none;
  margin-top: 1.8rem;
}

.no-results {
  margin: 2rem 0 0;
  padding: 1.25rem;
  border: 1px solid rgba(32, 50, 83, 0.11);
  border-radius: 16px;
  color: #526b95;
  background: rgba(255, 255, 255, 0.86);
  text-align: center;
  font-weight: 800;
}

@media (max-width: 1120px) {
  .workspace-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .workspace-tools {
    width: 100%;
  }

  .workspace-search {
    min-width: 0;
    flex: 1;
  }

  .app-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  main {
    width: min(calc(100% - 1rem), 1480px);
    padding-top: 0.5rem;
  }

  .workspace-shell {
    padding: 1rem;
    border-radius: 20px;
  }

  .workspace-title-group {
    align-items: flex-start;
  }

  .workspace-home {
    width: 56px;
    height: 56px;
    border-radius: 16px;
  }

  .workspace-tools {
    align-items: stretch;
    flex-direction: column;
  }

  .app-grid {
    grid-template-columns: 1fr;
  }

  .app-card {
    min-height: 330px;
  }
}

/* Real brand/application logo assets */
.workspace-home {
  width: 116px;
  grid-template-columns: none;
  grid-auto-rows: auto;
  gap: 0;
  padding: 0.55rem;
}

.workspace-home span {
  display: none;
}

.workspace-home img {
  width: 100%;
  max-height: 54px;
  object-fit: contain;
}

.app-icon img {
  width: 58px;
  height: 58px;
  object-fit: contain;
}

.operator-mark {
  display: flex;
  align-items: center;
}

.operator-mark img {
  width: min(158px, 42vw);
  max-height: 58px;
  object-fit: contain;
}

@media (max-width: 720px) {
  .workspace-home {
    width: 94px;
  }
}

/* CSS-only per-card wave artwork */
.app-card {
  --wave-a: color-mix(in srgb, var(--accent) 15%, transparent);
  --wave-b: color-mix(in srgb, var(--accent) 8%, transparent);
}

.app-card::before {
  background: none;
}

.app-card::after {
  display: none;
}

.app-card__pattern {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  border-radius: inherit;
}

.app-card__pattern::before,
.app-card__pattern::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.app-card__pattern::before {
  inset: 0;
  opacity: 0.95;
  background-repeat: no-repeat;
}

.app-card__pattern::after {
  width: 82px;
  height: 82px;
  right: 2rem;
  top: 9.6rem;
  opacity: 0.52;
  background-image: radial-gradient(circle, var(--accent) 1.7px, transparent 1.8px);
  background-size: 14px 14px;
}

/* Availability state */
.app-card.is-unavailable {
  filter: grayscale(0.9) saturate(0.16);
  opacity: 0.66;
  box-shadow: 0 12px 28px rgba(31, 49, 82, 0.07);
}

.app-card.is-unavailable:hover,
.app-card.is-unavailable.is-pressed {
  transform: none;
  border-color: rgba(32, 50, 83, 0.11);
  box-shadow: 0 12px 28px rgba(31, 49, 82, 0.07);
}

.app-card__pattern .wave-solid {
  display: none;
}

.theme-compliance .app-card__pattern::before {
  background:
    radial-gradient(18rem 12rem at 92% -4%, rgba(0, 156, 137, 0.13), transparent 68%),
    url("data:image/svg+xml,%3Csvg width='520' height='260' viewBox='0 0 520 260' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23009c89' stroke-opacity='.13' stroke-width='1.2'%3E%3Cpath d='M218-70c2 104 36 166 106 206 56 32 126 34 218 4'/%3E%3Cpath d='M246-78c2 96 31 151 91 185 51 29 116 30 203 4'/%3E%3Cpath d='M274-86c2 85 27 132 78 161 46 26 105 27 186 3'/%3E%3Cpath d='M302-92c0 70 22 111 66 137 41 23 94 23 166 1'/%3E%3C/g%3E%3C/svg%3E");
  background-position: right top, right -1rem top -1rem;
  background-size: auto, 430px 215px;
}

.theme-send .app-card__pattern::before {
  background:
    radial-gradient(24rem 12rem at 100% 0%, rgba(35, 138, 245, 0.1), transparent 70%),
    url("data:image/svg+xml,%3Csvg width='520' height='260' viewBox='0 0 520 260' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M105 78C190 18 298 8 405 36c64 17 111 45 153 85v104H105Z' fill='%23238af5' fill-opacity='.055'/%3E%3Cpath d='M98 91C190 36 292 30 392 54c70 17 126 48 168 94' fill='none' stroke='%23238af5' stroke-opacity='.08' stroke-width='1.4'/%3E%3Cpath d='M86 116c96-42 197-41 296-12 66 20 114 52 151 94' fill='none' stroke='%23238af5' stroke-opacity='.06' stroke-width='1.4'/%3E%3C/svg%3E");
  background-position: right top, right -2rem top 0;
  background-size: auto, 440px 220px;
}

.theme-coresync .app-card__pattern::before {
  background:
    radial-gradient(15rem 14rem at 86% 8%, rgba(39, 169, 229, 0.16), transparent 68%),
    url("data:image/svg+xml,%3Csvg width='520' height='280' viewBox='0 0 520 280' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M342-22c92 19 139 73 142 162 2 64 43 91 98 94v88H248V-22Z' fill='%2327a9e5' fill-opacity='.085'/%3E%3Cpath d='M294-14c113 29 162 84 160 166-1 58 37 88 101 101' fill='none' stroke='%2327a9e5' stroke-opacity='.1' stroke-width='1.3'/%3E%3Cpath d='M328-20c83 25 122 70 120 137-2 63 30 94 96 112' fill='none' stroke='%2327a9e5' stroke-opacity='.07' stroke-width='1.3'/%3E%3C/svg%3E");
  background-position: right top, right -2.2rem top -0.5rem;
  background-size: auto, 430px 230px;
}

.theme-flexidesk .app-card__pattern::before {
  background:
    radial-gradient(16rem 14rem at 92% 0%, rgba(124, 63, 213, 0.13), transparent 68%),
    url("data:image/svg+xml,%3Csvg width='520' height='260' viewBox='0 0 520 260' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M290-24c-12 72-42 116-88 143-42 25-92 31-151 21v-164Z' fill='%237c3fd5' fill-opacity='.065'/%3E%3Cpath d='M318-18c-20 91-66 146-139 166-51 14-106 10-166-7' fill='none' stroke='%237c3fd5' stroke-opacity='.09' stroke-width='1.35'/%3E%3Cpath d='M354-15c-26 112-82 176-168 194-58 12-118 4-181-22' fill='none' stroke='%237c3fd5' stroke-opacity='.06' stroke-width='1.35'/%3E%3C/svg%3E");
  background-position: right top, left -1.4rem top -0.5rem;
  background-size: auto, 430px 216px;
}

.theme-admissions .app-card__pattern::before {
  background:
    radial-gradient(19rem 13rem at 88% 6%, rgba(217, 119, 6, 0.13), transparent 72%),
    url("data:image/svg+xml,%3Csvg width='520' height='260' viewBox='0 0 520 260' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 82c89-34 165-33 229 3 55 31 76 82 132 112 36 20 79 24 129 12V-25H0Z' fill='%23d97706' fill-opacity='.062'/%3E%3Cpath d='M0 64c92-28 172-21 238 22 52 34 76 82 133 109 40 19 83 19 130 1' fill='none' stroke='%23d97706' stroke-opacity='.08' stroke-width='1.3'/%3E%3Cpath d='M0 104c82-32 154-31 216 0 57 29 87 85 148 115' fill='none' stroke='%23d97706' stroke-opacity='.055' stroke-width='1.3'/%3E%3C/svg%3E");
  background-position: right top, right -1rem top -0.4rem;
  background-size: auto, 430px 220px;
}

.theme-meals .app-card__pattern::before {
  background:
    radial-gradient(17rem 13rem at 91% 6%, rgba(240, 78, 35, 0.14), transparent 68%),
    url("data:image/svg+xml,%3Csvg width='520' height='280' viewBox='0 0 520 280' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M336-30c-28 95-12 169 49 221 45 38 90 46 151 43V-30Z' fill='%23f04e23' fill-opacity='.07'/%3E%3Cpath d='M286-30c-27 107-5 194 66 251 43 35 89 50 139 48' fill='none' stroke='%23f04e23' stroke-opacity='.08' stroke-width='1.35'/%3E%3Cpath d='M324-30c-18 89 2 156 59 201 45 36 86 45 133 43' fill='none' stroke='%23f04e23' stroke-opacity='.06' stroke-width='1.35'/%3E%3C/svg%3E");
  background-position: right top, right -1rem top -0.6rem;
  background-size: auto, 430px 230px;
}

.theme-flexidesk .app-card__pattern::after {
  color: #7c3fd5;
}

.theme-admissions .app-card__pattern::after {
  color: #d97706;
}

.theme-meals .app-card__pattern::after {
  color: #f04e23;
}

.theme-parent-crm .app-card__pattern::after {
  color: #0f766e;
}

.theme-compliance .app-card__pattern::before,
.theme-send .app-card__pattern::before,
.theme-coresync .app-card__pattern::before,
.theme-flexidesk .app-card__pattern::before,
.theme-admissions .app-card__pattern::before,
.theme-meals .app-card__pattern::before,
.theme-parent-crm .app-card__pattern::before {
  background-repeat: no-repeat, no-repeat !important;
}

.theme-compliance .app-card__pattern::before {
  background-size: 420px 230px, 520px 260px;
}

.theme-send .app-card__pattern::before {
  background-size: 430px 230px, 560px 280px;
  background-position: right top, right -4rem top -1rem;
}

.theme-coresync .app-card__pattern::before {
  background-size: 420px 230px, 560px 300px;
  background-position: right top, right -4rem top -1.2rem;
}

.theme-flexidesk .app-card__pattern::before {
  background-size: 420px 230px, 540px 270px;
  background-position: right top, left -4rem top -1rem;
}

.theme-admissions .app-card__pattern::before {
  background-size: 440px 230px, 560px 280px;
  background-position: right top, right -4.2rem top -1rem;
}

.theme-meals .app-card__pattern::before {
  background-size: 430px 230px, 560px 300px;
  background-position: right top, right -4rem top -1rem;
}

.theme-parent-crm .app-card__pattern::before {
  background-size: 430px 230px, 560px 300px;
  background-position: right top, right -4.5rem top -1rem;
}

/* Fade all theme colour washes into the top edges; avoid hard SVG fill boundaries. */
.theme-compliance .app-card__pattern::before {
  background:
    radial-gradient(24rem 14rem at 96% 0%, rgba(0, 156, 137, 0.2), transparent 76%),
    url("data:image/svg+xml,%3Csvg width='520' height='260' viewBox='0 0 520 260' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23009c89' stroke-opacity='.17' stroke-width='1.25'%3E%3Cpath d='M218-70c2 104 36 166 106 206 56 32 126 34 218 4'/%3E%3Cpath d='M246-78c2 96 31 151 91 185 51 29 116 30 203 4'/%3E%3Cpath d='M274-86c2 85 27 132 78 161 46 26 105 27 186 3'/%3E%3Cpath d='M302-92c0 70 22 111 66 137 41 23 94 23 166 1'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -3rem top -1rem;
  background-size: 430px 230px, 520px 260px;
}

.theme-send .app-card__pattern::before {
  background:
    radial-gradient(28rem 13rem at 94% 0%, rgba(35, 138, 245, 0.18), transparent 78%),
    url("data:image/svg+xml,%3Csvg width='560' height='280' viewBox='0 0 560 280' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23238af5' stroke-width='1.3'%3E%3Cpath d='M35 86C160 28 294 15 438 54c73 20 126 52 172 96' stroke-opacity='.13'/%3E%3Cpath d='M18 120c134-44 269-42 404-4 73 21 129 56 174 104' stroke-opacity='.09'/%3E%3Cpath d='M54 58c107-48 228-59 363-32 80 16 147 47 205 94' stroke-opacity='.07'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -5rem top -1.1rem;
  background-size: 450px 220px, 560px 280px;
}

.theme-coresync .app-card__pattern::before {
  background:
    radial-gradient(23rem 15rem at 96% 0%, rgba(39, 169, 229, 0.22), transparent 77%),
    url("data:image/svg+xml,%3Csvg width='560' height='300' viewBox='0 0 560 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%2327a9e5' stroke-width='1.25'%3E%3Cpath d='M330-20c92 26 139 77 142 153 3 67 40 105 108 116' stroke-opacity='.14'/%3E%3Cpath d='M286-18c112 32 166 92 164 178-1 61 38 101 111 124' stroke-opacity='.09'/%3E%3Cpath d='M374-26c70 25 105 65 104 122-1 55 28 87 84 103' stroke-opacity='.065'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -5rem top -1.4rem;
  background-size: 430px 230px, 560px 300px;
}

.theme-flexidesk .app-card__pattern::before {
  background:
    radial-gradient(22rem 16rem at 0% 0%, rgba(124, 63, 213, 0.18), transparent 76%),
    url("data:image/svg+xml,%3Csvg width='540' height='270' viewBox='0 0 540 270' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%237c3fd5' stroke-width='1.3'%3E%3Cpath d='M322-18c-20 91-66 146-139 166-51 14-106 10-166-7' stroke-opacity='.12'/%3E%3Cpath d='M358-15c-26 112-82 176-168 194-58 12-118 4-181-22' stroke-opacity='.08'/%3E%3Cpath d='M262-28c-10 70-39 116-86 140-44 23-96 24-158 1' stroke-opacity='.06'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: left top, left -5rem top -1rem;
  background-size: 390px 230px, 540px 270px;
}

.theme-admissions .app-card__pattern::before {
  background:
    radial-gradient(27rem 15rem at 96% 0%, rgba(217, 119, 6, 0.19), transparent 77%),
    url("data:image/svg+xml,%3Csvg width='560' height='280' viewBox='0 0 560 280' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23d97706' stroke-width='1.25'%3E%3Cpath d='M-20 68c96-28 178-20 246 24 54 35 80 84 140 112 42 20 88 19 139-1' stroke-opacity='.12'/%3E%3Cpath d='M-24 106c84-32 158-31 222 0 60 30 91 88 155 119 44 21 92 24 145 8' stroke-opacity='.08'/%3E%3Cpath d='M-18 38c92-17 171-4 235 39 52 35 78 76 135 102' stroke-opacity='.06'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -5rem top -1rem;
  background-size: 450px 230px, 560px 280px;
}

.theme-meals .app-card__pattern::before {
  background:
    radial-gradient(25rem 15rem at 96% 0%, rgba(240, 78, 35, 0.2), transparent 77%),
    url("data:image/svg+xml,%3Csvg width='560' height='300' viewBox='0 0 560 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23f04e23' stroke-width='1.3'%3E%3Cpath d='M318-30c-27 107-5 194 66 251 43 35 89 50 139 48' stroke-opacity='.115'/%3E%3Cpath d='M360-30c-18 89 2 156 59 201 45 36 86 45 133 43' stroke-opacity='.08'/%3E%3Cpath d='M392-38c-10 71 7 124 51 159 38 30 74 38 114 36' stroke-opacity='.06'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -5rem top -1rem;
  background-size: 430px 230px, 560px 300px;
}

.theme-parent-crm .app-card__pattern::before {
  background:
    radial-gradient(26rem 15rem at 94% 0%, rgba(15, 118, 110, 0.21), transparent 78%),
    url("data:image/svg+xml,%3Csvg width='620' height='300' viewBox='0 0 620 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%230f766e' stroke-linecap='round' stroke-width='1.3'%3E%3Cpath d='M88-26c84 44 131 99 140 164 7 54 41 87 101 101 67 16 143 4 229-36' stroke-opacity='.13'/%3E%3Cpath d='M134-31c76 43 116 94 119 154 3 55 34 89 93 103 61 15 129 4 205-32' stroke-opacity='.085'/%3E%3Cpath d='M48 5c86 33 144 80 174 141 27 56 72 87 134 91 58 4 119-15 184-56' stroke-opacity='.06'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -6rem top -1.2rem;
  background-size: 440px 230px, 620px 300px;
}

.app-card__pattern::before {
  mask-image: linear-gradient(180deg, #000 0%, #000 52%, rgba(0, 0, 0, 0.7) 74%, transparent 100%);
}

/* Stronger solid wave accents. These are curved edge-to-edge lines only, not hard rectangular fills. */
.theme-send .app-card__pattern::before {
  background:
    radial-gradient(28rem 13rem at 94% 0%, rgba(35, 138, 245, 0.18), transparent 78%),
    url("data:image/svg+xml,%3Csvg width='620' height='300' viewBox='0 0 620 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23238af5' stroke-linecap='round'%3E%3Cpath d='M-18 104C117 39 260 18 414 56c92 23 160 64 223 124' stroke-opacity='.22' stroke-width='2.4'/%3E%3Cpath d='M-22 146c145-49 292-48 440-5 82 24 145 63 198 115' stroke-opacity='.09' stroke-width='1.35'/%3E%3Cpath d='M8 70c116-52 247-64 394-36 89 17 164 52 228 103' stroke-opacity='.07' stroke-width='1.3'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -6.5rem top -1.5rem;
  background-size: 450px 220px, 620px 300px;
}

.theme-flexidesk .app-card__pattern::before {
  background:
    radial-gradient(22rem 16rem at 0% 0%, rgba(124, 63, 213, 0.18), transparent 76%),
    url("data:image/svg+xml,%3Csvg width='600' height='300' viewBox='0 0 600 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%237c3fd5' stroke-linecap='round'%3E%3Cpath d='M390-24c-29 116-91 186-188 207-67 15-137 5-211-28' stroke-opacity='.2' stroke-width='2.3'/%3E%3Cpath d='M336-20c-23 96-73 155-151 177-57 16-119 11-188-9' stroke-opacity='.085' stroke-width='1.35'/%3E%3Cpath d='M286-31c-12 75-43 124-93 150-47 25-104 25-171 0' stroke-opacity='.065' stroke-width='1.3'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: left top, left -6rem top -1.5rem;
  background-size: 390px 230px, 600px 300px;
}

.theme-admissions .app-card__pattern::before {
  background:
    radial-gradient(27rem 15rem at 96% 0%, rgba(217, 119, 6, 0.19), transparent 77%),
    url("data:image/svg+xml,%3Csvg width='620' height='300' viewBox='0 0 620 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23d97706' stroke-linecap='round'%3E%3Cpath d='M-35 78c105-32 196-23 272 28 61 41 91 96 160 129 51 24 106 22 168-1' stroke-opacity='.2' stroke-width='2.25'/%3E%3Cpath d='M-38 120c94-36 176-35 247 0 66 33 101 98 172 132 50 24 105 27 165 9' stroke-opacity='.08' stroke-width='1.35'/%3E%3Cpath d='M-24 42c101-19 188-4 258 47 58 42 88 88 153 119' stroke-opacity='.06' stroke-width='1.25'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -6rem top -1.25rem;
  background-size: 450px 230px, 620px 300px;
}

.theme-meals .app-card__pattern::before {
  background:
    radial-gradient(25rem 15rem at 96% 0%, rgba(240, 78, 35, 0.2), transparent 77%),
    url("data:image/svg+xml,%3Csvg width='620' height='320' viewBox='0 0 620 320' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23f04e23' stroke-linecap='round'%3E%3Cpath d='M358-35c-32 126-6 226 77 293 50 40 103 57 162 56' stroke-opacity='.2' stroke-width='2.35'/%3E%3Cpath d='M406-38c-22 102 1 180 69 235 52 42 100 53 155 49' stroke-opacity='.08' stroke-width='1.35'/%3E%3Cpath d='M446-45c-14 82 6 143 58 184 45 35 86 44 132 41' stroke-opacity='.06' stroke-width='1.25'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -5.8rem top -1.5rem;
  background-size: 430px 230px, 620px 320px;
}

.theme-parent-crm .app-card__pattern::before {
  background:
    radial-gradient(26rem 15rem at 94% 0%, rgba(15, 118, 110, 0.21), transparent 78%),
    url("data:image/svg+xml,%3Csvg width='620' height='300' viewBox='0 0 620 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%230f766e' stroke-linecap='round'%3E%3Cpath d='M70-26c91 45 142 102 152 171 8 55 42 89 103 103 70 16 149 2 238-42' stroke-opacity='.2' stroke-width='2.25'/%3E%3Cpath d='M130-31c78 43 120 96 125 158 4 54 36 88 94 101 63 14 132 2 209-36' stroke-opacity='.085' stroke-width='1.35'/%3E%3Cpath d='M22 12c94 34 158 83 191 146 30 57 77 88 141 91 62 3 128-20 198-67' stroke-opacity='.06' stroke-width='1.25'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat !important;
  background-position: right top, right -6.2rem top -1.5rem;
  background-size: 440px 230px, 620px 300px;
}

@media (max-width: 720px) {
  .app-card__pattern::after {
    right: 1.25rem;
    top: 8.6rem;
  }
}