@font-face { font-family: 'Urbanist'; src: url('../fonts/Urbanist-800.ttf') format('truetype'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Aspekta Variable'; src: url('../fonts/AspektaVariable.woff2') format('woff2-variations'); font-weight: 50 1000; font-style: normal; font-display: swap; }
@font-face { font-family: "Momo Trust Sans"; src: url("../fonts/MomoTrustSans-700.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }
.jn-faq, .jn-faq * { box-sizing: border-box; }
.jn-faq { padding: 128px 40px 64px; background: #0f0f0f; color: #fff; }
.jn-faq .jn-faq__layout { width: 100%; max-width: 1290px; margin-inline: auto; }
.jn-faq .services-faq-head h2 {
  margin: 0;
  font-family: "Urbanist", Arial, sans-serif;
  font-size: clamp(42px, 5.2vw, 76px);
  font-weight: 800;
  letter-spacing: 0;
  line-height: 0.98;
}

.jn-faq .jn-faq__layout {
  position: relative;
  color: #fff;
  
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: clamp(48px, 7vw, 104px);
  align-items: start;
}

.jn-faq .services-faq-head p {
  max-width: 380px;
  margin: 16px 0 28px;
  color: rgb(255 255 255 / 60%);
  font-family: "Aspekta Variable", Arial, sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.45;
}

.jn-faq .services-faq-cta {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: #fff;
  font-family: "Aspekta Variable", Arial, sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-decoration: none;
}

.jn-faq .services-faq-list {
  display: grid;
  border-top: 1px solid rgb(255 255 255 / 12%);
}

.jn-faq .services-faq-list details {
  border-bottom: 1px solid rgb(255 255 255 / 12%);
}

.jn-faq .services-faq-list summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 26px 2px;
  font-family: "Momo Trust Sans", Arial, sans-serif;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  cursor: pointer;
  list-style: none;
}

.jn-faq .services-faq-list summary::-webkit-details-marker {
  display: none;
}

.jn-faq .services-faq-list summary::after {
  flex: 0 0 auto;
  color: #ff6b00;
  font-family: "Urbanist", Arial, sans-serif;
  font-size: 24px;
  font-weight: 700;
  content: "+";
}

.jn-faq .services-faq-list details[open] summary::after {
  content: "\2212";
}

.jn-faq .services-faq-list p {
  max-width: 620px;
  margin: 0;
  padding: 0 2px 26px;
  color: rgb(255 255 255 / 60%);
  font-family: "Aspekta Variable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
}

@media (max-width: 900px) {
  .jn-faq .jn-faq__layout {
    grid-template-columns: 1fr;
    gap: 42px;

  }
}

@media (max-width: 520px) {

  .jn-faq .services-faq-list summary {
    font-size: 19px;
  }
}

.jn-faq .arrow-badge-button {
  position: relative;
  display: grid;
  place-items: center;
  width: var(--arrow-badge-size, 64px);
  height: var(--arrow-badge-size, 64px);
  border-radius: 999px;
  color: #fff;
  background: rgb(255 255 255 / 10%);
  backdrop-filter: blur(6px);
}

.jn-faq .arrow-badge-button::before {
  position: absolute;
  inset: 0;
  padding: 0.7px;
  border-radius: inherit;
  background: linear-gradient(
    135deg,
    rgb(255 255 255 / 72%) 0%,
    rgb(255 255 255 / 18%) 34%,
    rgb(255 255 255 / 8%) 54%,
    rgb(255 255 255 / 42%) 100%
  );
  content: "";
  pointer-events: none;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

.jn-faq .arrow-badge-button svg {
  position: relative;
  z-index: 1;
  width: calc(var(--arrow-badge-size, 64px) * 0.48);
  height: calc(var(--arrow-badge-size, 64px) * 0.48);
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.5;
  transform: rotate(45deg);
  transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}


.jn-faq .arrow-badge-button { --arrow-badge-size: 52px; flex: none; }
.jn-faq .services-faq-cta:is(:hover, :focus-visible) .arrow-badge-button svg { transform: rotate(0); }
.jn-faq .services-faq-list summary:focus-visible,
.jn-faq .services-faq-cta:focus-visible { outline: 2px solid #b49aff; outline-offset: 5px; border-radius: 4px; }
.jn-faq .services-faq-head, .jn-faq .services-faq-list { min-width: 0; }
.jn-faq p, .jn-faq summary span { overflow-wrap: anywhere; }
@media (max-width: 900px) { .jn-faq { padding-top: 92px; padding-bottom: 48px; } }
@media (max-width: 520px) { .jn-faq { padding-inline: 16px; } }
@media (prefers-reduced-motion: reduce) { .jn-faq .arrow-badge-button svg { transition: none; } }

.jn-faq .services-faq-list { align-content: start; }
.jn-faq .services-faq-list details.is-animating { overflow: hidden; }