/* Home Integrations block styles (loaded only when `home_integrations` block is present) */

[data-home-integrations] {
  position: relative;
  padding: 110px 0 90px;
  overflow: hidden;
  background:
    radial-gradient(70% 120% at 0% 20%, rgba(26, 86, 187, 0.16) 0%, rgba(10, 14, 26, 0) 60%),
    radial-gradient(70% 120% at 100% 20%, rgba(16, 115, 217, 0.14) 0%, rgba(10, 14, 26, 0) 60%),
    linear-gradient(180deg, #0a101f 0%, #090f1d 42%, #090d19 100%);
}

[data-home-integrations] > .absolute {
  pointer-events: none;
}

[data-home-integrations] .container {
  position: relative;
  z-index: 1;
}

[data-home-integrations] .max-w-3xl {
  max-width: 760px;
}

[data-home-integrations] .mb-16 {
  margin-bottom: 56px;
}

[data-home-integrations] h2 {
  margin: 0 0 18px;
  font-size: clamp(34px, 4.1vw, 54px);
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: rgba(255, 255, 255, 0.96);
}

[data-home-integrations] .text-foreground\/70 {
  color: rgba(233, 239, 250, 0.78);
}

[data-home-integrations] .inline-flex.items-center.px-3.py-1.rounded-full {
  border: 1px solid rgba(117, 176, 255, 0.45);
  background: rgba(9, 29, 58, 0.32);
  box-shadow: inset 0 0 0 1px rgba(137, 199, 255, 0.18);
}

[data-home-integrations] .integrations-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 28px;
}

[data-home-integrations] .integrations-grid::before {
  content: "";
  position: absolute;
  inset: -16px -22px;
  background:
    linear-gradient(rgba(49, 108, 187, 0.08), rgba(49, 108, 187, 0.08)) 0 33.333% / 100% 1px no-repeat,
    linear-gradient(rgba(49, 108, 187, 0.08), rgba(49, 108, 187, 0.08)) 0 66.666% / 100% 1px no-repeat,
    linear-gradient(90deg, rgba(49, 108, 187, 0.08), rgba(49, 108, 187, 0.08)) 25% 0 / 1px 100% no-repeat,
    linear-gradient(90deg, rgba(49, 108, 187, 0.08), rgba(49, 108, 187, 0.08)) 50% 0 / 1px 100% no-repeat,
    linear-gradient(90deg, rgba(49, 108, 187, 0.08), rgba(49, 108, 187, 0.08)) 75% 0 / 1px 100% no-repeat;
  opacity: 0.6;
  pointer-events: none;
}

[data-home-integrations] .integration-card {
  --integration-accent-rgb: 62, 167, 255;
  --integration-hover-tint: rgba(21, 43, 73, 0.8);
  min-height: 126px;
  padding: 18px 14px;
  border-radius: 10px;
  border: 1px solid rgba(var(--integration-accent-rgb), 0.24);
  background: linear-gradient(180deg, rgba(10, 15, 29, 0.9) 0%, rgba(8, 13, 26, 0.88) 100%);
  box-shadow: inset 0 1px 0 rgba(var(--integration-accent-rgb), 0.1);
  transition: border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}

[data-home-integrations] .integration-card:hover,
[data-home-integrations] .integration-card:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(var(--integration-accent-rgb), 0.88);
  background:
    linear-gradient(180deg, var(--integration-hover-tint) 0%, rgba(15, 31, 54, 0.62) 68%, rgba(8, 13, 26, 0.92) 100%);
  box-shadow:
    inset 0 1px 0 rgba(var(--integration-accent-rgb), 0.22),
    0 0 0 1px rgba(var(--integration-accent-rgb), 0.28),
    0 12px 28px rgba(5, 34, 73, 0.36);
}

[data-home-integrations] .integration-card-glow {
  opacity: 0;
}

[data-home-integrations] .integration-card:hover .integration-card-glow,
[data-home-integrations] .integration-card:focus-visible .integration-card-glow {
  opacity: 0.18;
}

[data-home-integrations] .integration-card:hover .integration-card-icon-inner,
[data-home-integrations] .integration-card:focus-visible .integration-card-icon-inner {
  background: rgba(16, 34, 57, 0.96);
}

[data-home-integrations] .integration-card:hover .integration-card-title,
[data-home-integrations] .integration-card:focus-visible .integration-card-title {
  color: #ffffff;
}

[data-home-integrations] .integration-card-icon-border {
  height: 46px;
  width: 46px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

[data-home-integrations] .integration-card-icon-inner {
  border-radius: 8px;
}

[data-home-integrations] .integration-card-icon-text {
  font-size: 12px !important;
}

[data-home-integrations] .integration-card-content {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

[data-home-integrations] .integration-card-title {
  margin: 0 !important;
  color: rgba(249, 251, 255, 0.95);
  font-size: 17px !important;
  line-height: 1.22;
  font-weight: 600 !important;
}

[data-home-integrations] .integration-card-subtitle {
  margin: 0 !important;
  color: rgba(210, 222, 243, 0.55);
  font-size: 11px !important;
  line-height: 1.3;
  font-weight: 400;
}

[data-home-integrations] .text-center > a {
  min-width: 206px;
  border-radius: 8px;
  border-color: rgba(117, 149, 194, 0.55);
  background: linear-gradient(180deg, rgba(7, 17, 35, 0.9), rgba(9, 18, 37, 0.88));
}

@media (min-width: 768px) {
  [data-home-integrations] .integrations-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  [data-home-integrations] .integrations-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 991px) {
  [data-home-integrations] {
    padding: 90px 0 72px;
  }

  [data-home-integrations] .integrations-grid::before {
    inset: -16px;
    background: none;
  }

  [data-home-integrations] .integration-card {
    min-height: 120px;
  }
}

@media (max-width: 640px) {
  [data-home-integrations] {
    padding: 72px 0 56px;
  }

  [data-home-integrations] .mb-16 {
    margin-bottom: 36px;
  }

  [data-home-integrations] .integrations-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}