.paths {
  --surface-luma: 0.97;
  --module-heading: rgba(5, 56, 80, 0.998);
  --module-text: rgba(8, 65, 92, 0.995);
  --module-muted: rgba(31, 82, 107, 0.95);
  --module-chip-bg: rgba(12, 96, 129, 0.14);
  --module-chip-border: rgba(10, 84, 114, 0.34);
  --module-chip-text: rgba(7, 63, 89, 0.996);
  position: relative;
  border-radius: var(--radius-xl);
  border: 1px solid rgba(160, 216, 240, 0.34);
  background:
    radial-gradient(900px 420px at 104% -18%, rgba(36, 168, 206, 0.08), transparent 64%),
    radial-gradient(780px 360px at -10% 0%, rgba(52, 191, 230, 0.08), transparent 68%),
    radial-gradient(720px 320px at 44% 118%, rgba(210, 171, 88, 0.06), transparent 76%),
    linear-gradient(182deg, rgba(255, 255, 255, 0.998), rgba(246, 251, 255, 0.992));
  box-shadow: 0 22px 54px rgba(5, 22, 35, 0.14);
  padding: 1.28rem;
  overflow: hidden;
}

.paths::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(680px 280px at 8% 18%, rgba(110, 222, 248, 0.12), transparent 74%),
    radial-gradient(560px 260px at 92% 80%, rgba(220, 183, 96, 0.08), transparent 76%),
    linear-gradient(118deg, rgba(214, 245, 255, 0.06), transparent 42%, rgba(220, 184, 98, 0.04));
  mix-blend-mode: normal;
  opacity: 0.28;
}

.paths-head {
  --surface-luma: 0.98;
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0.32rem;
  margin-bottom: 0.78rem;
  border-radius: 18px;
  border: 1px solid rgba(172, 226, 246, 0.32);
  background:
    radial-gradient(420px 180px at 0% 0%, rgba(52, 193, 229, 0.1), transparent 72%),
    linear-gradient(182deg, rgba(255, 255, 255, 0.998), rgba(246, 251, 255, 0.992));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.88),
    0 8px 18px rgba(5, 22, 35, 0.1);
  padding: 0.9rem 0.98rem;
}

.paths-head h2 {
  color: var(--smart-heading, var(--module-heading, rgba(5, 56, 80, 0.998)));
  text-shadow: none;
}

.paths-head p {
  color: var(--smart-text, var(--module-text, rgba(8, 65, 92, 0.995)));
  line-height: 1.56;
  text-wrap: pretty;
}

.paths-grid {
  position: relative;
  z-index: 1;
  margin-top: 0.72rem;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 0.88rem;
}

.path-card {
  --surface-luma: 0.985;
  grid-column: span 4;
  display: grid;
  gap: 0.58rem;
  position: relative;
  border-radius: 18px;
  border: 1px solid rgba(172, 226, 246, 0.36);
  background:
    radial-gradient(520px 260px at 0% -20%, rgba(55, 194, 232, 0.08), transparent 66%),
    radial-gradient(380px 220px at 100% 0%, rgba(210, 171, 88, 0.06), transparent 74%),
    linear-gradient(182deg, rgba(255, 255, 255, 0.998), rgba(246, 251, 255, 0.996));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 16px 34px rgba(5, 23, 36, 0.14);
  padding: 1.06rem;
  transition:
    transform var(--dur-med) var(--ease-out),
    border-color var(--dur-med) var(--ease-out),
    box-shadow var(--dur-med) var(--ease-out);
}

.path-card:nth-child(1) {
  grid-column: span 5;
}

.path-card:nth-child(2) {
  grid-column: span 3;
}

.path-card:nth-child(3) {
  grid-column: span 4;
}

.path-card:nth-child(4),
.path-card:nth-child(5) {
  grid-column: span 6;
}

.path-card:nth-child(1) .path-title {
  font-size: 1.2rem;
}

.path-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  border-radius: 14px 14px 0 0;
  background: linear-gradient(90deg, rgba(0, 139, 191, 0.92), rgba(12, 99, 132, 0.86));
}

.path-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 1px solid rgba(255, 255, 255, 0.7);
  pointer-events: none;
}

.path-top {
  display: flex;
  align-items: center;
  gap: 0.52rem;
  flex-wrap: wrap;
}

.path-emblem {
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 14px;
  border: 1px solid rgba(186, 235, 253, 0.46);
  background:
    radial-gradient(circle at 24% 18%, rgba(238, 250, 255, 0.82), transparent 58%),
    linear-gradient(156deg, rgba(38, 176, 214, 0.93), rgba(9, 95, 129, 0.94));
  box-shadow:
    inset 0 1px 0 rgba(228, 250, 255, 0.46),
    0 12px 30px rgba(2, 11, 20, 0.32);
  position: relative;
  transition: transform var(--dur-med) var(--ease-out), box-shadow var(--dur-med) var(--ease-out);
}

.path-emblem::before {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 0.92rem;
  height: 0.92rem;
  background: rgba(241, 252, 255, 0.98);
  -webkit-mask: var(--path-icon-mask, none) center / contain no-repeat;
  mask: var(--path-icon-mask, none) center / contain no-repeat;
}

.path-emblem::after {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 14px;
  border: 1px solid rgba(178, 233, 253, 0.24);
  pointer-events: none;
}

.path-emblem--reseller,
.path-emblem--ringcentral,
.path-emblem--var,
.path-emblem--advisory {
  background:
    radial-gradient(circle at 24% 18%, rgba(255, 247, 226, 0.82), transparent 58%),
    linear-gradient(156deg, rgba(221, 181, 95, 0.94), rgba(165, 121, 44, 0.94));
  border-color: rgba(214, 181, 108, 0.44);
}

.path-emblem--industries,
.path-emblem--industry {
  background:
    radial-gradient(circle at 24% 18%, rgba(236, 250, 255, 0.82), transparent 58%),
    linear-gradient(156deg, rgba(86, 222, 209, 0.93), rgba(37, 152, 142, 0.94));
}

.path-emblem--trust,
.path-emblem--registry {
  background:
    radial-gradient(circle at 24% 18%, rgba(239, 250, 255, 0.82), transparent 58%),
    linear-gradient(156deg, rgba(130, 196, 252, 0.94), rgba(65, 128, 214, 0.94));
}

.path-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
  justify-self: start;
  border-radius: 999px;
  border: 1px solid var(--smart-chip-border, rgba(123, 198, 231, 0.4));
  background: var(--smart-chip-bg, rgba(9, 82, 117, 0.9));
  color: var(--smart-chip-text, var(--smart-heading, rgba(224, 246, 255, 0.96)));
  font-size: 0.78rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  font-weight: 760;
  padding: 0.2rem 0.5rem;
}

.path-tag::before {
  content: "";
  width: 0.82rem;
  height: 0.82rem;
  border-radius: 999px;
  background: rgba(240, 251, 255, 0.99);
  -webkit-mask: var(--path-icon-mask, none) center / contain no-repeat;
  mask: var(--path-icon-mask, none) center / contain no-repeat;
  filter: drop-shadow(0 1px 2px rgba(2, 11, 20, 0.32));
  transition: transform var(--dur-med) var(--ease-out), filter var(--dur-med) var(--ease-out);
}

.path-tag--msp,
.path-emblem--msp {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 5h16v4H4V5Zm0 6h7v8H4v-8Zm9 0h7v3h-7v-3Zm0 5h7v3h-7v-3Z'/%3E%3C/svg%3E");
}

.path-tag--reseller,
.path-emblem--reseller {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM6.2 6H21l-1.7 8.2a2 2 0 0 1-2 1.6H9a2 2 0 0 1-2-1.6L5.4 2H2v2h1.9L6.2 16H19v-2H7.2L6.7 12h11.3l1-4.8H6.4l-.2-1.2Z'/%3E%3C/svg%3E");
}

.path-tag--comms,
.path-emblem--comms {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H9l-5 3v-3H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Zm3 5h10v2H7V9Zm0 4h7v2H7v-2Z'/%3E%3C/svg%3E");
}

.path-tag--trust,
.path-emblem--trust {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2 20 6v7c0 5-3.4 9.4-8 11-4.6-1.6-8-6-8-11V6l8-4Zm0 3.2L6 7.8V13c0 3.6 2.2 6.9 6 8.7 3.8-1.8 6-5.1 6-8.7V7.8l-6-2.6Z'/%3E%3C/svg%3E");
}

.path-tag--industries,
.path-emblem--industries {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 3h14v18H5V3Zm2 2v14h10V5H7Zm2 2h2v2H9V7Zm4 0h2v2h-2V7Zm-4 4h2v2H9v-2Zm4 0h2v2h-2v-2Zm-4 4h2v2H9v-2Zm4 0h2v2h-2v-2Z'/%3E%3C/svg%3E");
}

.path-tag--advisory,
.path-emblem--advisory {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3 2 8l10 5 10-5-10-5Zm-8 8 8 4 8-4v6l-8 4-8-4v-6Z'/%3E%3C/svg%3E");
}

.path-tag--ringcentral,
.path-emblem--ringcentral {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4a8 8 0 1 0 8 8h-3.2a4.8 4.8 0 1 1-4.8-4.8V4Zm0 6.2A1.8 1.8 0 1 0 13.8 12 1.8 1.8 0 0 0 12 10.2Z'/%3E%3C/svg%3E");
}

.path-tag--operate,
.path-emblem--operate {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 8a4 4 0 1 0 4 4 4 4 0 0 0-4-4Zm9 3h-2.1a7.9 7.9 0 0 0-.7-1.8l1.5-1.5-1.4-1.4-1.5 1.5a7.9 7.9 0 0 0-1.8-.7V5h-2v2.1a7.9 7.9 0 0 0-1.8.7L8.7 6.3 7.3 7.7l1.5 1.5a7.9 7.9 0 0 0-.7 1.8H6v2h2.1a7.9 7.9 0 0 0 .7 1.8l-1.5 1.5 1.4 1.4 1.5-1.5a7.9 7.9 0 0 0 1.8.7V19h2v-2.1a7.9 7.9 0 0 0 1.8-.7l1.5 1.5 1.4-1.4-1.5-1.5a7.9 7.9 0 0 0 .7-1.8H21Z'/%3E%3C/svg%3E");
}

.path-tag--var,
.path-emblem--var {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM6.2 6H21l-1.7 8.2a2 2 0 0 1-2 1.6H9a2 2 0 0 1-2-1.6L5.4 2H2v2h1.9L6.2 16H19v-2H7.2L6.7 12h11.3l1-4.8H6.4l-.2-1.2Z'/%3E%3C/svg%3E");
}

.path-tag--integrate,
.path-emblem--integrate {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 7h4v2H7a3 3 0 0 0 0 6h4v2H7a5 5 0 0 1 0-10Zm6 0h4a5 5 0 0 1 0 10h-4v-2h4a3 3 0 0 0 0-6h-4V7Zm-3 4h4v2h-4v-2Z'/%3E%3C/svg%3E");
}

.path-tag--registry,
.path-emblem--registry {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 3h9l5 5v13H6V3Zm2 2v14h10V9h-4V5H8Zm2 6h6v2h-6v-2Zm0 4h6v2h-6v-2Z'/%3E%3C/svg%3E");
}

.path-tag--industry,
.path-emblem--industry {
  --path-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 3h14v18H5V3Zm2 2v14h10V5H7Zm2 2h2v2H9V7Zm4 0h2v2h-2V7Zm-4 4h2v2H9v-2Zm4 0h2v2h-2v-2Zm-4 4h2v2H9v-2Zm4 0h2v2h-2v-2Z'/%3E%3C/svg%3E");
}

.path-title {
  margin: 0;
  font-weight: 790;
  letter-spacing: -0.02em;
  color: var(--smart-heading, var(--module-heading, rgba(5, 56, 80, 0.998)));
  font-size: 1.12rem;
  text-wrap: balance;
  text-shadow: none;
}

.path-subtitle {
  margin: 0;
  color: var(--smart-text, var(--module-text, rgba(8, 65, 92, 0.995)));
  line-height: 1.54;
  text-wrap: pretty;
}

.path-bullets {
  margin: 0;
  padding-left: 1rem;
  color: var(--smart-text, var(--module-text, rgba(8, 65, 92, 0.995)));
  line-height: 1.52;
}

.path-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.52rem;
  margin-top: 0.1rem;
}

.path-card .cta-secondary {
  background: rgba(242, 250, 255, 0.98);
  border-color: rgba(124, 201, 231, 0.48);
  color: rgba(7, 65, 92, 0.998);
}

.path-card:hover {
  transform: translateY(-3px);
  border-color: rgba(196, 239, 255, 0.58);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    0 18px 42px rgba(5, 23, 36, 0.18);
}

.path-card:hover .path-tag::before {
  transform: translateY(-1px) scale(1.05);
  filter: drop-shadow(0 2px 4px rgba(2, 11, 20, 0.34));
}

.path-card:hover .path-emblem {
  transform: translateY(-1px) scale(1.03);
  box-shadow:
    inset 0 1px 0 rgba(228, 250, 255, 0.44),
    0 14px 30px rgba(2, 11, 20, 0.36);
}

.path-card--msp::before,
.path-card--msp .path-tag {
  background-image: linear-gradient(90deg, rgba(60, 208, 244, 0.94), rgba(32, 160, 196, 0.9));
}

.path-card--reseller::before,
.path-card--reseller .path-tag {
  background-image: linear-gradient(90deg, rgba(225, 184, 99, 0.92), rgba(171, 128, 48, 0.9));
}

.path-card--comms::before,
.path-card--comms .path-tag {
  background-image: linear-gradient(90deg, rgba(109, 221, 250, 0.92), rgba(41, 163, 202, 0.9));
}

.path-card--ringcentral::before,
.path-card--ringcentral .path-tag {
  background-image: linear-gradient(90deg, rgba(225, 186, 102, 0.94), rgba(173, 129, 48, 0.92));
}

.path-card--trust::before,
.path-card--trust .path-tag {
  background-image: linear-gradient(90deg, rgba(133, 201, 252, 0.92), rgba(68, 132, 214, 0.9));
}

.path-card--industries::before,
.path-card--industries .path-tag {
  background-image: linear-gradient(90deg, rgba(95, 224, 212, 0.92), rgba(34, 156, 146, 0.9));
}

.path-card--advisory::before,
.path-card--advisory .path-tag {
  background-image: linear-gradient(90deg, rgba(226, 186, 104, 0.92), rgba(178, 133, 53, 0.9));
}

.path-card--operate::before,
.path-card--operate .path-tag {
  background-image: linear-gradient(90deg, rgba(70, 210, 246, 0.92), rgba(33, 163, 201, 0.9));
}

.path-card--var::before,
.path-card--var .path-tag {
  background-image: linear-gradient(90deg, rgba(221, 181, 97, 0.92), rgba(165, 122, 44, 0.9));
}

.path-card--integrate::before,
.path-card--integrate .path-tag {
  background-image: linear-gradient(90deg, rgba(98, 220, 250, 0.92), rgba(38, 160, 199, 0.9));
}

.path-card--registry::before,
.path-card--registry .path-tag {
  background-image: linear-gradient(90deg, rgba(140, 204, 252, 0.92), rgba(75, 136, 214, 0.9));
}

.path-card--industry::before,
.path-card--industry .path-tag {
  background-image: linear-gradient(90deg, rgba(95, 223, 211, 0.92), rgba(35, 155, 145, 0.9));
}

.path-card .path-tag {
  border-color: rgba(192, 236, 254, 0.4);
  box-shadow: inset 0 1px 0 rgba(243, 252, 255, 0.24);
}

@media (max-width: 1240px) {
  .paths-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .path-card,
  .path-card:nth-child(1),
  .path-card:nth-child(2),
  .path-card:nth-child(3),
  .path-card:nth-child(4),
  .path-card:nth-child(5) {
    grid-column: span 1;
  }
}

@media (max-width: 980px) {
  .paths {
    padding: 0.92rem;
  }

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

@media (prefers-reduced-motion: reduce) {
  .paths::after {
    animation: none;
  }
}