/* ==========================================================================
   CSS CUSTOM PROPERTIES (VARIABLES)
   ========================================================================== */

:root {
  /* Animation Durations */
  --duration-default-quarter: 0.2s;
  --duration-default-half: 0.4s;
  --duration-default: 0.8s;
  --duration-default-onehalf: 1.2s;
  --duration-default-double: 1.6s;

  /* Easing Functions */
  --cubic-default: cubic-bezier(0.625, 0.05, 0, 1);
  --cubic-bounce: linear(0, 0.5737 7.6%, 0.8382 11.87%, 0.9463 14.19%, 1.0292 16.54%, 1.0886 18.97%, 1.1258 21.53%, 1.137 22.97%, 1.1424 24.48%, 1.1423 26.1%, 1.1366 27.86%, 1.1165 31.01%, 1.0507 38.62%, 1.0219 42.57%, 0.9995 46.99%, 0.9872 51.63%, 0.9842 58.77%, 1.0011 81.26%, 1);
  --hover-effect: linear(0 0%, 0.005892 1%, 0.022227 2%, 0.047151 3%, 0.079006 4%, 0.116321 5%, 0.157797 6%, 0.202293 7.000000000000001%, 0.248818 8%, 0.296516 9%, 0.344652 10%, 0.392606 11%, 0.439857 12%, 0.485977 13%, 0.530617 14.000000000000002%, 0.573504 15%, 0.614426 16%, 0.653228 17%, 0.689804 18%, 0.724091 19%, 0.756062 20%, 0.785721 21%, 0.813097 22%, 0.838242 23%, 0.861223 24%, 0.882123 25%, 0.901035 26%, 0.918061 27%, 0.933305 28.000000000000004%, 0.946879 28.999999999999996%, 0.958894 30%, 0.96946 31%, 0.978689 32%, 0.986687 33%, 0.993561 34%, 0.999411 35%, 1.004333 36%, 1.00842 37%, 1.011758 38%, 1.014427 39%, 1.016506 40%, 1.018063 41%, 1.019165 42%, 1.019871 43%, 1.020237 44%, 1.020313 45%, 1.020144 46%, 1.019771 47%, 1.019232 48%, 1.018558 49%, 1.01778 50%, 1.016922 51%, 1.016007 52%, 1.015055 53%, 1.014083 54%, 1.013105 55.00000000000001%, 1.012133 56.00000000000001%, 1.011177 56.99999999999999%, 1.010246 57.99999999999999%, 1.009346 59%, 1.008483 60%, 1.00766 61%, 1.006882 62%, 1.006148 63%, 1.005462 64%, 1.004822 65%, 1.00423 66%, 1.003683 67%, 1.003182 68%, 1.002725 69%, 1.002309 70%, 1.001933 71%, 1.001595 72%, 1.001293 73%, 1.001024 74%, 1.000786 75%, 1.000578 76%, 1.000396 77%, 1.000238 78%, 1.000103 79%, 0.999989 80%);

  /* Combined Animations */
  --animation-default-quarter: var(--duration-default-quarter) var(--cubic-default);
  --animation-default-half: var(--duration-default-half) var(--cubic-default);
  --animation-default: var(--duration-default) var(--cubic-default);
  --animation-default-onehalf: var(--duration-default-onehalf) var(--cubic-default);
  --animation-default-double: var(--duration-default-double) var(--cubic-default);

  /* Hover Animations */
  --animation-hover-half: var(--duration-default-half) var(--hover-effect);
  --animation-hover-default: var(--duration-default) var(--hover-effect);
  --animation-hover-onehalf: var(--duration-default-onehalf) var(--hover-effect);
  --animation-hover-double: var(--duration-default-double) var(--hover-effect);

  /* Simple Ease Animations */
  --animation-ease: 0.2s ease;
  --animation-ease-double: 0.4s ease;

  /* Box Shadows */
  --card-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
  --header-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.19), 0px 6px 6px 0px rgba(0, 0, 0, 0.23);
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */

.g_btn-n::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(350deg, var(--swatch--brand) -2.95%, transparent 70.34%);
  transform: scaleY(1);
  transform-origin: bottom;
  transition: transform 0.3s ease;
  z-index: -1;

}

.g_btn-n:hover::before {
  transform: scaleY(1.5);
}

.g_btn-n.is-raw {
  background: linear-gradient(350deg, transparent -2.95%, transparent 70.34%);
  backdrop-filter: blur(8px);
  position: relative;
  overflow: clip;

}

.g_btn-n.is-raw::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(350deg, var(--swatch--brand-yellow) -2.95%, transparent 70.34%);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform var(--animation-default);
  z-index: -1;
}

.g_btn-n.is-raw:hover::before {
  transform: scaleY(1);
}

.g_btn-n.is-raw.active::before {
  transform: scaleY(1);
}

.g_btn-n_contain {
  box-shadow: var(--card-shadow);
}

/* Button Variants */

[data-wf--button-new--variant="red"].g_btn-n::before {
  background: linear-gradient(350deg, var(--swatch--brand-red) -2.95%, transparent 70.34%);
}

[data-btn-color="green"].g_btn-n::before {
  background: linear-gradient(350deg, var(--swatch--brand) -2.95%, transparent 70.34%);
}

[data-wf--button-new--variant="yellow"].g_btn-n::before,
[data-btn-color="yellow"].g_btn-n::before {
  background: linear-gradient(350deg, var(--swatch--brand-yellow) -2.95%, transparent 70.34%);
}

/* Button Small Variants */

[data-wf--button-new-small--variant="blue"].g_btn-n::before,
[data-btn-color="blue"].g_btn-n::before {
  background: linear-gradient(350deg, var(--swatch--brand-blue) -2.95%, transparent 70.34%);
}

/* ==========================================================================
   CARDS - BASE STYLES
   ========================================================================== */

.g_content_card {
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  z-index: 2;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

/* Card Gradient Backgrounds */
.g-card-gradient {
  background: linear-gradient(272deg, #1E2028 43.81%, #292B33 97.14%);
}

/* Card Transitions */
.g_content_card_basic,
.deactivated,
.g_heading_rich {
  transition: opacity var(--animation-hover-default);
}

/* ==========================================================================
   CARDS - BORDER GRADIENTS
   ========================================================================== */

/* Default Card Border */
.g_content_card::before {
  content: '';
  position: absolute;
  inset: 0;
  padding: 1px;
  background: linear-gradient(90deg, var(--swatch--brand) -2.95%, #5D5D5D 70.34%);
  border-radius: inherit;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: xor;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  z-index: 1;
}

/* Yellow Card */

.g_content_card.is-yellow::before {
  content: '';
  position: absolute;
  inset: 0;
  padding: 1px;
  background: linear-gradient(90deg, var(--swatch--brand-yellow) -2.95%, #5D5D5D 70.34%);
  border-radius: inherit;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: xor;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  z-index: 1;
}

.g_content_card.is-blue::before {
  content: '';
  position: absolute;
  inset: 0;
  padding: 1px;
  background: linear-gradient(90deg, var(--swatch--brand-blue) -2.95%, #5D5D5D 70.34%);
  border-radius: inherit;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: xor;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  z-index: 1;
}

/* Grey Card Border */
.g_content_card.is-grey::before {
  background: linear-gradient(94.85deg, #898989 0.63%, #303030 100%);
}

/* Red Card Border */
.g_content_card.is-red::before {
  background: linear-gradient(90deg, #5D5D5D -2.95%, var(--swatch--brand-red) 70.34%);
}

.g_content_card.is-yellow::before {
  background: linear-gradient(90deg, #5D5D5D -2.95%, var(--swatch--brand-yellow) 70.34%);
}

/* ==========================================================================
   CARDS - INNER GRADIENTS
   ========================================================================== */

/* Default Inner Gradient */

.g-card-inner-gradient {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1E2028 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, var(--swatch--brand) 65%, #5D5D5D 100%) border-box;
}

.g_content_card.is-yellow .g-card-inner-gradient {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1E2028 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, var(--swatch--brand-yellow) 65%, #5D5D5D 100%) border-box;
}

.g_content_card.is-blue .g-card-inner-gradient {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1E2028 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, var(--swatch--brand-blue) 65%, #5D5D5D 100%) border-box;
}

/* Red Inner Gradient */
.g-card-inner-gradient-red {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1E2028 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #5D5D5D 0.63%, var(--swatch--red) 100%) border-box;
}

.g-card-inner-gradient-yellow {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1E2028 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #5D5D5D 0.63%, var(--swatch--brand-yellow) 100%) border-box;
}

/* Deactivated States */
.g-card-inner-gradient.deactivated,
.g-card-inner-gradient-red.deactivated {
  background: linear-gradient(272deg, #20242C 43.81%, #20242C 97.14%) padding-box,
    linear-gradient(94.85deg, #20232A 0.63%, #20232A 100%) border-box;
}

.deactivated .g_heading_rich {
  opacity: 0.1;
}

.deactivated .text-rich {
  opacity: 0.1;
}

[data-card-type="security"] {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1E2028 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, var(--swatch--brand) 65%, #5D5D5D 100%) border-box;
}

[data-card-type="fail"] {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1E2028 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #5D5D5D 65%, var(--swatch--red) 100%) border-box;
}

[data-card-type="traditional"] {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1E2028 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #5D5D5D 0.63%, var(--swatch--brand-yellow) 100%) border-box;
}

[data-card-type="traditional"] .card-header-type {
  color: var(--swatch--brand-yellow);

}

[data-card-type="security"] .card-header-type {
  color: var(--swatch--brand);
}

/* Deactivated States */
[data-card-type="traditional"].deactivated,
[data-card-type="security"].deactivated {
  background: linear-gradient(272deg, #20242C 43.81%, #20242C 97.14%) padding-box,
    linear-gradient(94.85deg, #20232A 0.63%, #20232A 100%) border-box;
}

/* ==========================================================================
   CARDS - CONTENT STYLES
   ========================================================================== */

.g_content_card_content {
  box-shadow: 0 -2px 6px hsla(0, 0%, 100%, .17),
    0 5px 18px rgba(0, 0, 0, .4),
    0 4px 40px 8px rgba(0, 0, 0, .4),
    0 1px 4px -1px rgba(0, 0, 0, .302),
    inset 0 0 0 .3px hsla(0, 0%, 100%, .3),
    0 0 0 .5px hsla(0, 0%, 100%, .4);
  transform: translateZ(0);
  -webkit-transform: translateZ(0);

}

/* No Highlight Modifier */
.g_content_card_content.no-highlight::before,
.g_content_card_content.no-highlight::after {
  opacity: 0;
}

/* ==========================================================================
   CARDS - INNER CONTENT
   ========================================================================== */

.g_content_card_inner::before {
  content: '';
  width: 100%;
  height: 100%;
  bottom: -80%;
  left: 0;
  position: absolute;
  background: radial-gradient(circle, var(--swatch--brand) 15%, transparent 90%);
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.g_content_card_inner::after {
  content: "";
  position: absolute;
  inset: 0;
  -webkit-backdrop-filter: blur(40px);
  backdrop-filter: blur(40px);
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

/* YELLOW Variant */
.g_content_card.is-yellow .g_content_card_inner::before {
  content: '';
  width: 100%;
  height: 100%;
  bottom: -80%;
  left: 0;
  position: absolute;
  background: radial-gradient(circle, var(--swatch--brand-yellow) 15%, transparent 90%);
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.g_content_card.is-yellow .g_content_card_inner::after {
  content: "";
  position: absolute;
  inset: 0;
  -webkit-backdrop-filter: blur(40px);
  backdrop-filter: blur(40px);
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.g_content_card.is-blue .g_content_card_inner::before {
  content: '';
  width: 100%;
  height: 100%;
  bottom: -80%;
  left: 0;
  position: absolute;
  background: radial-gradient(circle, var(--swatch--brand-blue)s 15%, transparent 90%);
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

/* Red Variant */
.g_content_card_inner.is-red::before {
  background: radial-gradient(circle, var(--swatch--brand-red) 15%, transparent 90%);
}

.g_content_card.is-yellow .g_content_card_inner::before {
  background: radial-gradient(circle, var(--swatch--brand-yellow) 15%, transparent 90%);
}

.g_content_card_inner.is-yellow::before {
  background: radial-gradient(circle, var(--swatch--brand-yellow) 15%, transparent 90%);
}

.g_content_card.is-blue .g_content_card_inner::before {
  background: radial-gradient(circle, var(--swatch--brand-blue) 15%, transparent 90%);
}

.g_content_card_inner.is-red::after {
  -webkit-backdrop-filter: blur(40px);
  backdrop-filter: blur(40px);
}

/* Grey Variant */
.g_content_card_inner.is-grey::before {
  background: radial-gradient(circle, var(--swatch--dark) 15%, transparent 90%);
}

/* ==========================================================================
   CARDS - HEADER AND SMALL VARIANTS
   ========================================================================== */

.g_content_card_header,
.g_content_card_small {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1A1D24 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #898989 0.63%, #303030 100%) border-box;
  box-shadow: var(--header-shadow);
}

.g_content_header_hover {

  border: 1px solid transparent;
  background: linear-gradient(272deg, #1A1D24 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #898989 0.63%, #303030 100%) border-box;
  transition: box-shadow var(--duration-default);
}

.g_content_header_hover:hover {

  border: 1px solid transparent;
  background: linear-gradient(272deg, #1A1D24 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #898989 0.63%, #303030 100%) border-box;
  box-shadow: var(--header-shadow);

}

/* ==========================================================================
   MODALS
   ========================================================================== */

dialog {
  display: block;
}

dialog:not([open]) {
  pointer-events: none;
  opacity: 0;
}

.modal-new_dialog::backdrop {
  opacity: 0;
  transition: all var(--animation-default-onehalf);
}

.modal-new_content {
  transform: scale(0.8);
  opacity: 0;
  transition: all var(--animation-default-onehalf);
}

/* Open State */
dialog[open] .modal-new_content {
  transform: scale(1);
  opacity: 1;
}

dialog[open] .modal-new_dialog::backdrop {
  opacity: 0.6;
}

/* ==========================================================================
   CARD DOTS NAVIGATION
   ========================================================================== */

.card-dots {
  position: absolute;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1000;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1A1D24 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #6E6E6E 0.63%, #303030 100%) border-box;
  padding: 8px;
  border-radius: 32px;
  box-shadow: rgba(0, 0, 0, 0.2) 1px 2px 4px,
    rgba(0, 0, 0, 0.17) 4px 6px 8px,
    rgba(0, 0, 0, 0.1) 10px 14px 10px,
    rgba(0, 0, 0, 0.03) 18px 25px 12px,
    rgba(0, 0, 0, 0) 28px 39px 13px;
}

.card-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--swatch--light) 15%, transparent);
  background: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
}

.card-dot:hover {
  border-color: color-mix(in srgb, var(--swatch--light) 60%, transparent);
  transform: scale(1.1);
}

.card-dot.active {
  background-color: var(--swatch--brand-red);
  border-color: var(--swatch--brand-red);
  transform: scale(1.1);
}

/* ==========================================================================
   TOC
   ========================================================================== */
.ap_toc_content::before {
  content: '';
  position: absolute;
  inset: 0;
  padding: 1px;
  background: linear-gradient(90deg, var(--swatch--brand) -2.95%, #5D5D5D 70.34%);
  border-radius: inherit;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: xor;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  z-index: 1;

  /* Initial state */
  opacity: 0;
  width: 0;

  /* Animation */
  transition: all var(--animation-default-quarter);
}

/* Base TOC Elements */
.ap_toc_text_wrap {
  transition: width var(--animation-default-quarter);
}

.ap_toc_icon_marker {
  transform: rotate(0);
  transition: transform var(--animation-default-quarter);
  transform-origin: center;
}

/* Active/Current & Hover States */
.ap_toc_link.w--current .ap_toc_content,
.ap_toc_link:hover .ap_toc_content {
  width: auto;
}

.ap_toc_link.w--current .ap_toc_content::before,
.ap_toc_link:hover .ap_toc_content::before {
  width: 100%;
  opacity: 1;
}

.ap_toc_link.w--current .ap_toc_icon_marker,
.ap_toc_link:hover .ap_toc_icon_marker {
  transform: rotate(45deg);
  background-color: var(--swatch--brand);
}

.ap_toc_link.w--current .ap_toc_text_wrap,
.ap_toc_link:hover .ap_toc_text_wrap {
  width: 100%;
}

/* Webflow Design Mode Override */
.wf-design-mode .ap_toc_content {
  width: auto;
}

.wf-design-mode .ap_toc_content::before {
  width: 100%;
  opacity: 1;
}

.wf-design-mode .ap_toc_text_wrap {
  width: 100%;
}

.ap_toc_collapsed .ap_toc_icon_marker {
  transform: rotate(45deg);
  background-color: var(--swatch--brand);
}

/* ==========================================================================
   ACCORDIONS
   ========================================================================== */

.ap-problem_card:hover {
  cursor: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/6852a356dea2364052be431f_cursor-marker.svg') 12 12, pointer;
}

.ap-bg_img_wrap {

  cursor: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/6880ce5af3d1726e29f5078c_glass-icon.svg') 8 8, pointer;
}

.ap-bg_img_wrap .g_btn-n .g_btn-n_contain {

  cursor: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/6880ce5af3d1726e29f5078c_glass-icon.svg') 12 12, auto !important;
}

.ap-accordion_cms_content-card {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1A1D24 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #898989 0.63%, #303030 100%) border-box;
}

/* Accordion Glow Effects */
.ap-accordion_cms_contain::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--swatch--brand);
  -webkit-filter: blur(15px);
  filter: blur(15px);
  opacity: 0;
  transition: all var(--animation-hover-onehalf);
}

.ap-accordion_cms_contain:has(.is-opened)::before {
  -webkit-filter: blur(5px);
  filter: blur(5px);
  opacity: 1;
}

/* Accordion Line Effect */
.ap-accordion_cms_content-card::after {
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, #B2F6CF 50%);
  transition: all var(--animation-hover-onehalf);
}

.ap-accordion_cms_content-card:has(.is-opened)::after {
  width: 20%;
}

/* Accordion States */
.g_icon_number-wrap {
  box-shadow: 0px 2px 1px 0px rgba(0, 0, 0, 0.09),
    0px 4px 2px 0px rgba(0, 0, 0, 0.09),
    0px 8px 4px 0px rgba(0, 0, 0, 0.09),
    0px 16px 8px 0px rgba(0, 0, 0, 0.09),
    0px 32px 16px 0px rgba(0, 0, 0, 0.09);
  transition: all var(--animation-hover-onehalf);
}

.is-opened .g_icon_number-wrap {
  background-color: var(--swatch--brand);
  color: var(--swatch--dark);
}

.ap-accordion_component {
  color: color-mix(in srgb, var(--swatch--light) 40%, transparent);
}

.ap-accordion_component.is-opened {
  color: var(--swatch--light);
}

/* ==========================================================================
   ACCORDION INSIGHTS ANIMATIONS
   ========================================================================== */

/* Desktop */
@media (min-width: 768px) {
  [data-accordion-insight] {
    grid-template-rows: 0fr;
    opacity: 0;
    transform: translateY(50px);
    transition: opacity var(--animation-default-quarter),
      transform var(--animation-hover-onehalf);
  }

  [data-accordion-insight].is-active {
    opacity: 1;
    transform: translateY(0);
    grid-template-rows: 1fr;
    transition: all var(--animation-default-quarter);
  }
}

/* Mobile */
@media (max-width: 767px) {
  [data-accordion-insight] {
    grid-template-rows: 0fr;
    transition: all var(--animation-default-quarter);
  }

  [data-accordion-insight].is-active {
    display: block !important;
    grid-template-rows: 1fr;
  }

  .card-dots {
    right: 10px;
  }
}

/* Design Mode Override */
.wf-design-mode [data-accordion-insight] {
  opacity: 1;
}

/* ==========================================================================
   CIRCULAR WHEEL MENU
   ========================================================================== */

.wheel {
  position: absolute;
  top: 65%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform-origin: 0% 0%;
}

.wheel-center {
  border-radius: 100%;
  position: absolute;
  transform: translate(-50%, -50%);
  transform-origin: 0% 0%;
  clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);
  border: 4px solid transparent;
  background: linear-gradient(0deg, #1A1D24 77.81%, #292B33 99.14%) padding-box,
    linear-gradient(261deg, #1a1d24 12%, #474A56 27.37%, #A0ABD6 44%, #474A56 60.37%, #1a1d24 79%) border-box;
}

/* Arc Base Styles */
.arc {
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 50%;
  transform-origin: 0% 100%;
  background: radial-gradient(circle at 0% 100%, #474A56 31%, #292E33 31.2%, rgba(29, 32, 35, 1) 57%, rgba(29, 32, 35, 1) 47.34%, #1D2023 51%);
  border: 1px solid #545970;
  mask: radial-gradient(circle at 0% 100%, transparent, transparent 29.5%, white 30%, white 51.5%, transparent 51.75%, transparent);
  -webkit-mask: radial-gradient(circle at 0% 100%, transparent, transparent 29.5%, white 30%, white 51.5%, transparent 51.75%, transparent);
  clip-path: polygon(0 0, 0 99%, 41.5% 0);
  opacity: 0.8;
  cursor: pointer;
  transform: scale(1) rotate(var(--rotation));
  transition: transform var(--animation-hover-default);
}

.arc:hover {
  opacity: 1;
  transform: scale(1.1) rotate(var(--rotation));
  background: radial-gradient(circle at 0% 100%, var(--swatch--brand) 31%, rgba(175, 242, 204, 0.4) 31.2%, #292E33 51.2%, rgba(175, 242, 204, 0.8) 52%);
}

.arc.is-group {
  opacity: 1;

  background: radial-gradient(circle at 0% 100%, var(--swatch--brand) 31%, rgba(175, 242, 204, 0.4) 31.2%, #292E33 51.2%, rgba(175, 242, 204, 0.8) 52%);
}

.arc.is-active {
  background: radial-gradient(circle at 0% 100%, var(--swatch--brand) 31%, rgba(175, 242, 204, 0.4) 31.2%, #292E33 51.2%, rgba(175, 242, 204, 0.8) 52%);
}

/* Arc Positioning */
/* Arc Positioning */
.arc:nth-child(1) {
  --rotation: -79.5deg;
  transition-delay: 0.015s;
}

.arc:nth-child(2) {
  --rotation: -56.5deg;
  transition-delay: 0s;
}

.arc:nth-child(3) {
  --rotation: -33.5deg;
  transition-delay: 0.015s;
}

.arc:nth-child(4) {
  --rotation: -10.5deg;
  transition-delay: 0s;
}

.arc:nth-child(5) {
  --rotation: 12.5deg;
  transition-delay: 0.015s;
}

.arc:nth-child(6) {
  --rotation: 35.5deg;
  transition-delay: 0s;
}

.arc:nth-child(7) {
  --rotation: 58.5deg;
  transition-delay: 0.015s;
}

/* Arc Icons */
.arc .arc-icon {
  position: absolute;
  top: 35%;
  left: 6%;

  background-size: contain;
  transform: rotate(calc(var(--rotation) * -1));
  transition: background-image var(--animation-default-double);
  filter: drop-shadow(0px 5px 4px rgba(12, 12, 12, 0.50));
}

.arc:hover .arc-icon,
.arc.is-active .arc-icon {
  top: 35%;

  transition: background-image var(--animation-default);
}

/* Arc Icons */
.arc:nth-child(1) .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/685bf3d8b4af2305e30807e4_prime-threat-modeling-inactive.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(1):hover .arc-icon,
.arc:nth-child(1).is-active .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/687ff5e6b862ee779ea525ad_prime-threat-modeling-icon.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(2) .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/685bf5050da1273926983198_prime-sec-review-inactive.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(2):hover .arc-icon,
.arc:nth-child(2).is-active .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/685bf505d72b51eee40a1cdf_prime-sec-review-active.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(3) .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/687ff7e74e74c5b82469b090_user-driven.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(3):hover .arc-icon,
.arc:nth-child(3).is-active .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/687ff7e77a62837d7d07d25d_user-driven-active.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(4) .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/687ff7e79140dab83acf475d_ai-driven.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(4):hover .arc-icon,
.arc:nth-child(4).is-active .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/687ff7e776da7930ebad5c4a_ai-driven-active.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(5) .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/687ff9049baba712cc51960c_prime-testing-inactive.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(5):hover .arc-icon,
.arc:nth-child(5).is-active .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/687ff902fc9a12163eeba0d2_prime-testing-active.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(6) .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/685bf8e9b477bf1373da92a7_prime-deploy-inactive.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(6):hover .arc-icon,
.arc:nth-child(6).is-active .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/685bf8e98e17f41849ee5c4b_prime-deploy.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(7) .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/685bfa5eb4af2305e30bd0cf_prime-eol-inactive.png');
  transition: background-image var(--animation-default);
}

.arc:nth-child(7):hover .arc-icon,
.arc:nth-child(7).is-active .arc-icon {
  background-image: url('https://cdn.prod.website-files.com/66bcaf97e5125deafa45188a/685bfa5e033e20adfcf94101_prime-eol.png');
  transition: background-image var(--animation-default);
}

.ap-select_name {
  position: absolute;
  transform: translate(-50%, -50%);
  transform-origin: 0% 0%;
}

/* Yellow arcs (1st and 2nd) */
.arc:nth-child(1).is-active,
.arc:nth-child(2).is-active,
.arc:nth-child(1):hover,
.arc:nth-child(2):hover,
.arc:nth-child(1).is-group,
.arc:nth-child(2).is-group {
  background: radial-gradient(circle at 0% 100%,
      var(--swatch--brand-yellow) 31%,
      rgba(255, 166, 34, 0.4) 31.2%,
      #292E33 51.2%,
      rgba(255, 166, 34, 0.8) 52%);
}

.arc:nth-child(3).is-active,
.arc:nth-child(4).is-active,
.arc:nth-child(3):hover,
.arc:nth-child(4):hover,
.arc:nth-child(3).is-group,
.arc:nth-child(4).is-group {
  background: radial-gradient(circle at 0% 100%,
      var(--swatch--brand-blue) 31%,
      rgba(68, 218, 255, 0.4) 31.2%,
      #292E33 51.2%,
      rgba(68, 218, 255, 0.8) 52%);
}

.arc:nth-child(7).is-active,
.arc:nth-child(7):hover {
  background: radial-gradient(circle at 0% 100%,
      var(--swatch--brand-red) 31%,
      rgba(255, 98, 122, 0.4) 31.2%,
      #292E33 51.2%,
      rgba(255, 98, 122, 0.8) 52%);
}

/* ==========================================================================
   RESPONSIVE LAYOUT ADJUSTMENTS
   ========================================================================== */

@media (max-width: 1440px) {
  .ap-implementation_ctx {
    margin-top: 0;
  }
}

@media (min-width: 1441px) and (max-width: 1919px) {
  .ap-implementation_ctx {
    margin-top: 0vw;
  }
}

@media (min-width: 1920px) {
  .ap-implementation_ctx {
    margin-top: 0vw;
  }
}

/* ==========================================================================
   UTILITY CLASSES
   ========================================================================== */

.is-rectangular-grid {
  background-size: 2vw 2vw;
  background-image: conic-gradient(from 90deg at 1px 1px, var(--theme--background) 0deg, var(--theme--background) 90deg, #D6D6D6 90deg);
}

.is-timeline {
  background: linear-gradient(0deg, transparent 0%, var(--swatch--brand) 25%, var(--swatch--brand) 75%, transparent 100%);
}

[tr-ajaxmodal-element="lightbox-modal"] {
  position: relative;
  margin: 2% auto;
  width: 100%;
  height: 100%;
  background: white;
  border-radius: 8px;
  overflow: hidden;
  /* This prevents modal scrollbar */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

input.filter_search-input {
  border-color: var(--swatch--dark-7);
  border-radius: 0.5rem;

}

.input_wrap {
  background: linear-gradient(350deg, var(--swatch--dark-secondary-2) -2.95%, transparent 70.34%);

}

[data-nav-bottom],
[data-toc] {
  transition: transform var(--animation-default);
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {

  [data-nav-bottom],
  [data-toc] {
    transition: none;
  }
}

[data-scrolling-direction="down"] [data-nav-bottom] {
  transform: translateY(200%);
}

[data-scrolling-direction="down"] [data-toc].is-fixed {
  transform: translateY(-200%);
}

.tr_content-card {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1A1D24 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #898989 0.63%, #303030 100%) border-box;
}

/* Accordion Glow Effects */
.tr_card_component::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--swatch--brand);
  -webkit-filter: blur(15px);
  filter: blur(15px);
  opacity: 0;
  transition: all var(--animation-hover-onehalf);
}

.card-dark.is-form:has(input[type="radio"]:checked) {
  border-color: var(--swatch--brand);

}

.highlight-column {
  background-color: var(--swatch--dark-2) !important;
}

.highlight-row {
  background-color: var(--swatch--dark-2) !important;
}

.highlight-current {
  background-color: var(--swatch--brand-4) !important;
  color: var(--swatch--dark);
}

.table-checkbox {
  border: 1px solid transparent;
  color: #4d4d4d;
  background: linear-gradient(272deg, #1A1D24 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #6E6E6E 0.63%, #303030 100%) border-box;

}

.table-checkbox:has(input[type="checkbox"]:checked) {
  color: white;
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1A1D24 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #aff2cc 0.63%, #303030 100%) border-box;

}

.swiper-slide.is-problem {

  transition: var(--animation-default);
  opacity: 0.5;

}

.swiper-slide.is-problem.is-active {
  transform: scale(1) !important;
  transition: var(--animation-default);
  opacity: 1;
  filter: blur(0px);
}

/* Modal Rich Text List Items */
.modal-rich-text.w-richtext ul li,
.modal-rich-text.w-richtext ol li {
  border: 1px solid transparent;
  background: linear-gradient(272deg, #1A1D24 43.81%, #292B33 97.14%) padding-box,
    linear-gradient(94.85deg, #898989 0.63%, #303030 100%) border-box;
  padding: 0.4rem;
  padding-left: 0.75rem;
  margin-bottom: 0.75rem;
  border-radius: 4px;
  position: relative;
}

/* Glow Effect Container */
.modal-rich-text.w-richtext ul,
.modal-rich-text.w-richtext ol {
  position: relative;
}

.ap-toc_link.w--current {
  color: var(--swatch--brand);

}