/* Design do accordion fornecido pelo usuário, com seletores isolados para integração. */
.faq-design {
  --size-header: 2.25rem;
  --size-accordion-title: 1.25rem;
  --size-accordion-content: 1rem;
  --animation-speed: 100;
  --slide-ease: cubic-bezier(0.86, 0, 0.07, 1);
  --slide-duration: calc(400ms * 100 / var(--animation-speed));
  --slide-delay: calc(450ms * 100 / var(--animation-speed));
  --circle-duration: calc(900ms * 100 / var(--animation-speed));
}
.faq-design, .faq-design *, .faq-design *::before, .faq-design *::after { box-sizing: border-box; }
.faq-design :where(a, p, h2, h3) { margin: 0; }
.faq-design > h2 { font-size: var(--size-header); margin-bottom: 1.25rem; }
.faq-design .accordion {
  --circle-x: 1.8rem; --circle-y: 0; --circle-r: 200%; --circle-bg: #fff;
  position: relative; color: #000; background-color: var(--circle-bg);
  width: 100%; max-width: 56ch; margin-bottom: 1rem; border-radius: min(8px, 0.5rem);
  display: grid; grid-template-rows: 0fr 0fr;
  transition-timing-function: var(--slide-ease);
  transition-duration: 200ms, 200ms, var(--slide-duration);
  transition-property: opacity, box-shadow, grid-template-rows;
  transition-delay: 0ms, 0ms, var(--slide-delay);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1); opacity: 0.9;
  scroll-margin-top: 1rem;
}
.faq-design .accordion:not(:target):hover { box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.5); }
.faq-design .accordion:not(:target):active { opacity: 1; box-shadow: 0 4px 7px 0 rgba(0, 0, 0, 0.3); }
.faq-design .accordion, .faq-design .content { overflow: hidden; }
.faq-design .accordion:target {
  --d: 90deg; grid-template-rows: 0fr 1fr;
  transition: grid-template-rows var(--slide-ease) var(--slide-duration) var(--slide-delay);
}
.faq-design .wrapper { padding-block: 0 1.05rem; padding-inline: 1.25rem; }
.faq-design .content { min-height: 0; font-size: var(--size-accordion-content); line-height: 140%; }
.faq-design .content p { margin-bottom: 1rem; }
.faq-design .content a { color: currentColor; font-weight: 800; text-decoration: underline; }
.faq-design > :last-child, .faq-design .content :last-child { margin-bottom: 0; }
.faq-design .title a {
  position: relative; padding: 1rem 1.25rem; font-size: var(--size-accordion-title);
  font-weight: 800; color: currentColor; text-decoration: none;
  display: flex; flex-direction: row; place-items: center;
}
.faq-design .title a::before {
  --chevron-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3C!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath fill='white' d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z'/%3E%3C/svg%3E");
  content: ""; position: relative; left: 0; top: 0; width: 0.65rem;
  aspect-ratio: 320 / 512; display: inline-block; flex-shrink: 0; margin-right: 0.75rem;
  transform: rotate(var(--d, 0deg));
  transition: transform var(--slide-ease) var(--slide-duration) var(--slide-delay);
  mask-image: var(--chevron-icon); mask-size: 100% 100%;
  -webkit-mask-image: var(--chevron-icon); -webkit-mask-size: 100% 100%;
  background-color: currentColor;
}
.faq-design .accordion::before, .faq-design .accordion::after {
  content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  background-color: var(--circle-bg); mix-blend-mode: difference;
  transform-style: preserve-3d; transition-timing-function: ease;
  transition-property: opacity, clip-path, visibility; pointer-events: none;
  clip-path: circle(var(--r) at var(--circle-x) var(--circle-y));
  border-radius: inherit; z-index: 4;
}
.faq-design .accordion::before {
  --r: 0%; transition-delay: var(--circle-duration), var(--circle-duration), 0ms;
  transition-duration: 0ms, var(--circle-duration), 0ms; opacity: 0;
}
.faq-design .accordion:target::before {
  --r: var(--circle-r); transition-delay: 0ms, 0ms, 0ms;
  transition-duration: 0ms, var(--circle-duration), 0ms; opacity: 1;
}
.faq-design .accordion::after {
  --r: var(--circle-r); transition-delay: 0ms, 0ms, var(--circle-duration);
  transition-duration: 0ms, var(--circle-duration), 0ms; visibility: hidden; opacity: 1;
}
.faq-design .accordion:target::after {
  --r: 0%; transition-delay: 0ms, 0ms, 0ms;
  transition-duration: 0ms, 0ms, 0ms; visibility: visible; opacity: 0;
}
.faq-design .title a:focus-visible { background-color: hsl(0, 100%, 90%); outline: 2px solid currentColor; outline-offset: -3px; }
.faq-design .accordion:target .title a:focus-visible { background-color: hsl(183, 100%, 93%); }
@media (prefers-reduced-motion: reduce) {
  .faq-design *, .faq-design *::before, .faq-design *::after { transition-duration: 0ms !important; transition-delay: 0ms !important; }
}/* Neutraliza as medidas dos componentes globais do template dentro do accordion. */
.faq-design { margin: 2rem 2px; clear: both; }
.faq-design .accordion { float: none; padding: 0; }
.faq-design .content { width: auto; max-width: none; float: none; margin: 0; padding: 0; }
.faq-design .wrapper { width: auto; max-width: none; min-width: 0; margin: 0; float: none; }
.faq-design .title { padding: 0; line-height: 1.4; text-transform: none; }
.faq-design .title a { overflow-wrap: anywhere; }
.faq-design .content p { text-align: left; }
.faq-design, .faq-design section { min-height: 0; }
.faq-design .title { color: #2172b3; position: relative; z-index: 5; } .faq-design .content p { font-size: inherit; }
