[data-wf--btn--variant="gold"]::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image: linear-gradient(rgb(249, 228, 143), rgb(242, 209, 76));
  opacity: 0;
  transition: box-shadow 300ms ease, opacity 300ms ease;
  z-index: 2;
  pointer-events: none;
  box-shadow: 0 0 0 1px #f9d957, inset 0 -2px 1px #00000005, inset 0 1px 1px #ffffff26;
}

[data-wf--btn--variant="gold"]:hover::before {
  opacity: 1;
}

[data-wf--btn--variant="gold"],
[data-wf--btn--variant="light"] {
  position: relative;

  & * {
    position: relative;
    z-index: 3;
  }
}

[data-wf--btn--variant="gold"]:active::before {
  box-shadow: 0 0 0 1px #f9d957, inset 0 -2px 1px #00000005, inset 0 1px 1px #00000026;
}

[data-wf--btn--variant="light"]::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image: linear-gradient(#F5F6F8, #F8F9F9);
  opacity: 0;
  transition: box-shadow 300ms ease, opacity 300ms ease;
  z-index: 2;
  pointer-events: none;
  box-shadow:
    0 0 0 1px #d6dae3,
    inset 0 -2px 1px #00000026,
    inset 0 1px 1px #ffffff1f;
}

[data-wf--btn--variant="light"]:hover::before {
  opacity: 1;
}

[data-wf--btn--variant="light"]:active::before {
  box-shadow:
    0 0 0 1px #d6dae3,
    inset 0 -2px 1px #00000030,
    inset 0 1px 1px #ffffff29;
}

.additional-nav-text:has(p:empty) {
  display: none;
}

/* Preserve scroll position while modal or mobile menu is open (see global-nav.js). */
body.canopy-scroll-locked {
  position: fixed;
  top: var(--canopy-scroll-lock-y, 0);
  left: 0;
  right: 0;
  width: 100%;
  overflow: hidden;
}

/* Mobile nav accordion: chevron follows aria-expanded on the toggle (wrap icon with data-nav-chevron). */
@media (max-width: 991px) {
  [data-nav-content] {
    overflow: hidden;
  }

  [data-dropdown-toggle] [data-nav-chevron] {
    transition: transform 0.3s ease;
    transform: rotate(0deg);
  }

  [data-dropdown-toggle][aria-expanded="true"] [data-nav-chevron] {
    transform: rotate(180deg);
  }

  .mega-nav__dropdown-panel {
    position: relative;
    border-top: none;
  }

  .mega-nav__dropdown-wrapper {
    position: relative;
    top: 0;
  }

  .mega-nav__panel-col {
    padding-inline: 0;
    grid-row-gap: 1rem;
    border-bottom: none;
    padding-bottom: 1rem;
  }

  .nav-drpdwn-link-item {
    padding-block: 0.75rem;
  }

  .mega-nav__panel-col.is--left {
    display: none;
  }

  /*
      Mobile accordion: panels are reparented under [data-mobile-nav-mount].
      Webflow desktop mega-menu grid/flex often uses 1fr / min-height / flex-grow so inner layout
      fills viewport — that inflates scrollHeight and GSAP opens the accordion to ~100vh.
      Reset wrappers + inner to content-sized layout only inside mounts.
    */
  [data-mobile-nav-mount],
  [data-mobile-nav-mount] .mega-nav__dropdown-container {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: none !important;
    flex-grow: 0 !important;
  }

  [data-mobile-nav-mount] [data-nav-content].mega-nav__dropdown-panel {
    min-height: 0 !important;
    flex: 0 0 auto !important;
  }

  [data-mobile-nav-mount] .mega-nav__dropdown-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0rem;
    height: auto !important;
    min-height: 0 !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    padding-bottom: 1.5rem;
  }

  [data-mobile-nav-mount] .mega-nav__panel-col,
  [data-mobile-nav-mount] .mega-nav__panel-subcol {
    min-height: 0 !important;
    height: auto !important;
    flex: 0 0 auto !important;
    grid-row: auto !important;
    align-self: stretch !important;
  }

  [data-mobile-nav-mount] .mega-nav__panel-subcol {
    display: flex !important;
    flex-direction: column !important;
    gap: 0;
  }

  .mega-nav__panel-li:has(.nav-drpdwn-link-item.for-big) {
    margin-left: 0;
    gap: 1.5rem;

    .nav-drpdwn-link-top-arrow {
      opacity: 1;

    }
  }

  [data-nav-content="why-canopy"] .mega-nav__panel-col {
    padding-block: 0rem;
  }

  [data-nav-content="company"] .mega-nav__panel-subcol {
    gap: 1rem;
  }

  /* Mobile menu: page stays put; scroll only inside the open panel. */
  [data-menu-wrap][data-menu-open="true"] [data-dropdown-wrapper] {
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    max-height: calc(100dvh - 5rem);
  }

  .section.for-header.is-top {
    .mega-nav__bar-logo {
      color: #fff;
    }

    .mega-nav__burger-line {
      background-color: #fff;
    }
  }

  .section.for-header.is-top:has([aria-expanded='true']) {
    .mega-nav__bar-logo {
      color: var(--_colors---blue--950);
    }
    [logo-type='color'] {
      opacity: 1;
    }
    .mega-nav__burger-line {
      background-color: var(--_colors---blue--950);
    }
  }
  .footer-links-grid{
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows 400ms, opacity 400ms;
  }
  .mega-nav__bar-link-icon.is--dropdown{
    transition: transform 400ms;
  }
  .footer-links-cont:has(:checked) {
    .footer-links-grid{
      grid-template-rows: 1fr;
      opacity: 1;
    }
    .mega-nav__bar-link-icon.is--dropdown{
      transform: rotate(180deg);
    }
  }
}

[logo-type='color'] {
  transition: opacity 200ms ease;
}
.section.for-header.is-top [logo-type='color'] {
    opacity: 0;
  }

@media (min-width: 991px) {
  .section.for-header.is-top {
    & :is(.mega-nav__bar-link, .mega-nav__bar-logo), [data-wf--btn--variant="ghoust-dark"] {
      color: #fff;
    }
  }
}

.platform-card {
	[path-top-right],
	[path-bot-left],
	.platform-card_top-icon, .platform-card-bg-blur {
		transition:
			transform 0.2s ease,
			background-color 0.2s ease;
	}
	
	&:hover {
		.platform-card_top-icon {
			background-color: var(--_colors---gray--25);
		}

		[path-top-right] {
			transform: translate(1px, -1px);
		}

		[path-bot-left] {
			transform: translate(-1px, 1px);
		}
    .platform-card-bg-blur{
      transform: scale(1.1);
    }
	}
}

/* Platform feature modal: full-viewport overlay; closed state ignores clicks. */
.platform-card .section.feature-modal {
	position: fixed;
	inset: 0;
	z-index: 10050;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	overflow: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	/* background-color: rgb(15 34 71 / 0.45); */
	backdrop-filter: blur(4px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition:
		opacity 0.28s ease,
		visibility 0.28s ease,
		backdrop-filter 0.28s ease;
}

.platform-card .section.feature-modal.is-visible {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.platform-card .section.feature-modal .close-mod_wrap {
	position: relative;
	z-index: 2;
}

.platform-card .section.feature-modal .modal-section_wrap {
	position: relative;
	z-index: 1;
	transform: translateY(12px);
	transition: transform 300ms ease;
}

.platform-card .section.feature-modal.is-visible .modal-section_wrap {
	transform: translateY(0);
}

.hero-slider.swiper{
  max-width: 100%;
}

.swiper-pagination {
  position: relative;
  margin-top: 1rem;
}

.swiper-pagination-bullet.swiper-pagination-bullet-active{
  background-color: var(--_colors---yellow--400);
  opacity: 1;
}

.swiper-pagination-bullet {
  background-color: var(--_colors---yellow--400);
  opacity: .25;
}
.benefits-slider.swiper, .benefits-slider.for-approach.swiper{
  overflow: visible;
}


  @media (min-width: 991px) {
  [web-connector] {
    display: block;
  }
  [mob-connector] {
    display: none;
  }
}
@media (max-width: 991px) {
  [web-connector] {
    display: none;
  }
  [mob-connector] {
    display: block;
  }
}