/* FAQ — visual match to original Tilda Zero Block FAQ */

#cm-tilda-faq-doc {
  --cm-muted: #8a8a8a;
  --cm-faq-plus: #b8b8b8;
  --cm-faq-q: #2a2a2a;
  interpolate-size: allow-keywords;
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 12px 0 72px !important;
  background: #fff !important;
  font-family: Montserrat, Arial, sans-serif !important;
  color: #3a3a3a !important;
  float: none !important;
}

#cm-tilda-faq-doc *,
#cm-tilda-faq-doc *::before,
#cm-tilda-faq-doc *::after {
  box-sizing: border-box;
}

#cm-tilda-faq-doc .cm-legal,
#cm-tilda-faq-doc .cm-faq {
  display: block !important;
  width: 100% !important;
  max-width: 960px !important;
  margin: 0 auto !important;
  padding: 12px 28px 48px !important;
  float: none !important;
  background: transparent !important;
  border-radius: 0 !important;
}

#cm-tilda-faq-doc .cm-legal__head {
  text-align: center !important;
  padding: 20px 8px 28px !important;
  margin: 0 !important;
  background: transparent !important;
}

#cm-tilda-faq-doc .cm-legal__title,
#cm-tilda-faq-doc .cm-legal__subtitle {
  text-transform: lowercase !important;
}

#cm-tilda-faq-doc .cm-legal__title {
  margin: 0 !important;
  padding: 0 !important;
  font-size: clamp(30px, 4vw, 42px) !important;
  font-weight: 700 !important;
  letter-spacing: -0.04em;
  line-height: 1.05 !important;
  color: #3a3a3a !important;
}

#cm-tilda-faq-doc .cm-legal__subtitle {
  max-width: none !important;
  margin: 8px 0 0 !important;
  font-size: clamp(16px, 2vw, 18px) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em;
  line-height: 1.35 !important;
  color: #3a3a3a !important;
}

#cm-tilda-faq-doc .cm-faq__body {
  padding: 0 0 24px !important;
  margin: 0 !important;
}

#cm-tilda-faq-doc .cm-faq__section {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#cm-tilda-faq-doc .cm-faq__section + .cm-faq__section {
  margin-top: 48px !important;
}

/* Category: light grey title, no black bar */
#cm-tilda-faq-doc .cm-faq__cat {
  display: block !important;
  margin: 0 0 8px !important;
  padding: 0 4px 12px !important;
  background: transparent !important;
  color: #c0c0c0 !important;
  font-size: clamp(28px, 3.2vw, 36px) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em;
  line-height: 1.15 !important;
  text-align: left !important;
  text-transform: lowercase !important;
  border: 0 !important;
  border-radius: 0 !important;
}

#cm-tilda-faq-doc .cm-faq__list {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#cm-tilda-faq-doc .cm-faq__item {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: clip;
}

#cm-tilda-faq-doc .cm-faq__item summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  padding: 22px 4px !important;
  margin: 0 !important;
  cursor: pointer !important;
  list-style: none !important;
  background: transparent !important;
  border: 0 !important;
  user-select: none;
  -webkit-user-select: none;
}

#cm-tilda-faq-doc .cm-faq__item summary::-webkit-details-marker {
  display: none !important;
}

#cm-tilda-faq-doc .cm-faq__item summary::marker {
  content: "" !important;
  display: none !important;
}

#cm-tilda-faq-doc .cm-faq__q {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  color: var(--cm-faq-q) !important;
  font-size: clamp(20px, 2.1vw, 26px) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em;
  line-height: 1.25 !important;
  text-align: left !important;
}

/* Uniform plus via single SVG stroke (no CSS bars / font +) */
#cm-tilda-faq-doc .cm-faq__icon {
  flex: 0 0 22px !important;
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  position: relative !important;
  color: var(--cm-faq-plus) !important;
}

#cm-tilda-faq-doc .cm-faq__icon svg {
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 1.5 !important;
  stroke-linecap: square !important;
}

/* Plus vertical bar: hide smoothly on open; appear instantly on close */
#cm-tilda-faq-doc .cm-faq__icon-v {
  transform-origin: 50% 50%;
  transition: none !important;
}

/* Icon follows .is-open only (not [open]) so plus returns immediately on close */
#cm-tilda-faq-doc .cm-faq__item.is-open .cm-faq__icon-v {
  opacity: 0 !important;
  transform: scaleY(0) !important;
}

/* Smooth expand/collapse (Chrome 131+ / Safari 18+) */
#cm-tilda-faq-doc .cm-faq__item::details-content {
  display: block;
  overflow: hidden;
  transition:
    height 0.35s ease,
    content-visibility 0.35s allow-discrete;
}

#cm-tilda-faq-doc .cm-faq__item:not([open])::details-content {
  height: 0;
}

#cm-tilda-faq-doc .cm-faq__item[open]::details-content {
  height: auto;
}

/* Fallback height animation via JS sets inline --cm-faq-h */
#cm-tilda-faq-doc .cm-faq__answer {
  overflow: hidden !important;
  max-width: none !important;
  padding: 0 !important;
  color: var(--cm-faq-q, #2a2a2a) !important;
  font-size: clamp(15px, 1.5vw, 17px) !important;
  font-weight: 500 !important;
  letter-spacing: -0.12px;
  line-height: 1.65 !important;
  background: transparent !important;
  height: 0;
  opacity: 0;
  transition: height 0.35s ease, opacity 0.28s ease !important;
}

#cm-tilda-faq-doc .cm-faq__item.is-open .cm-faq__answer,
#cm-tilda-faq-doc .cm-faq__item[open]:not(.cm-faq--js) .cm-faq__answer {
  height: auto;
  opacity: 1;
}

#cm-tilda-faq-doc .cm-faq__item.cm-faq--js.is-open .cm-faq__answer {
  height: var(--cm-faq-h, auto);
  opacity: 1;
}

#cm-tilda-faq-doc .cm-faq__answer-inner {
  padding: 0 4px 8px !important;
  max-width: 760px !important;
}

#cm-tilda-faq-doc .cm-faq__answer p {
  margin: 0 0 10px !important;
  padding: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

#cm-tilda-faq-doc .cm-faq__answer p:last-child {
  margin-bottom: 0 !important;
}

#cm-tilda-faq-doc .cm-faq__answer a {
  color: inherit !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

@media (max-width: 640px) {
  #cm-tilda-faq-doc .cm-legal,
  #cm-tilda-faq-doc .cm-faq {
    padding: 8px 18px 40px !important;
  }

  #cm-tilda-faq-doc .cm-faq__cat {
    font-size: 26px !important;
    padding-bottom: 6px !important;
  }

  #cm-tilda-faq-doc .cm-faq__item summary {
    padding: 18px 2px !important;
    gap: 16px !important;
  }

  #cm-tilda-faq-doc .cm-faq__q {
    font-size: 18px !important;
  }

  #cm-tilda-faq-doc .cm-faq__icon,
  #cm-tilda-faq-doc .cm-faq__icon svg {
    width: 20px !important;
    height: 20px !important;
  }

  #cm-tilda-faq-doc .cm-faq__section + .cm-faq__section {
    margin-top: 36px !important;
  }
}
