/* Premium FAQ accordion interaction — scoped to faq.html. */
.faq-page .faq-list details{
  --faq-tap-x:50%;
  --faq-tap-y:50%;
  isolation:isolate;
  transform-origin:center top;
  backface-visibility:hidden;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  background:rgba(255,255,255,.96);
  box-shadow:0 16px 40px rgba(27,34,96,.075),inset 0 1px 0 rgba(255,255,255,.9);
  transition:border-color .38s ease,background-color .38s ease;
}

.faq-page .faq-list details:hover,
.faq-page .faq-list details:active,
.faq-page .faq-list details[open]{
  transform:none;
}

.faq-page .faq-list details.is-opening,
.faq-page .faq-list details.is-closing{
  overflow:hidden;
}

.faq-page .faq-list details::before{
  content:"";
  position:absolute;
  inset:13px auto 13px 0;
  z-index:2;
  width:3px;
  border-radius:0 999px 999px 0;
  background:linear-gradient(180deg,#E3B43F 0%,#11AB77 100%);
  box-shadow:0 0 20px rgba(14,166,114,.28);
  opacity:0;
  transform:scaleY(.18);
  transform-origin:center;
  transition:opacity .34s ease,transform .46s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}

.faq-page .faq-list details::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:inherit;
  background:radial-gradient(circle at var(--faq-tap-x) var(--faq-tap-y),rgba(25,183,124,.14) 0,rgba(242,200,91,.07) 20%,transparent 54%);
  opacity:0;
  pointer-events:none;
}

.faq-page .faq-list details[open]::before{
  opacity:1;
  transform:scaleY(1);
}

.faq-page .faq-list details.faq-tapped::after{
  animation:faqTapWash .48s cubic-bezier(.16,1,.3,1) both;
}

.faq-page .faq-list summary,
.faq-page .faq-list details > p{
  position:relative;
  z-index:1;
}

.faq-page .faq-list summary{
  outline:none;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  transition:color .34s ease,background-color .34s ease;
}

.faq-page .faq-list summary:focus-visible{
  border-radius:16px;
  box-shadow:inset 0 0 0 3px rgba(43,46,131,.18);
}

.faq-page .faq-list summary::before{
  transition:color .34s ease,transform .42s cubic-bezier(.4,0,.2,1),text-shadow .34s ease;
}

.faq-page .faq-list details[open] summary::before{
  transform:translateX(2px) scale(1.07);
  text-shadow:0 5px 18px rgba(14,166,114,.22);
}

/* The two layered gradients form a plus that smoothly folds into a minus. */
.faq-page .faq-list summary::after{
  content:""!important;
  background:
    linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,
    linear-gradient(currentColor,currentColor) center/2px 12px no-repeat,
    #FFF5D5;
  box-shadow:0 8px 20px rgba(164,120,23,.12),inset 0 1px 0 rgba(255,255,255,.72);
  transform:rotate(0deg) scale(1);
  transition:
    transform .44s cubic-bezier(.4,0,.2,1),
    color .34s ease,
    background-color .34s ease,
    background-size .4s cubic-bezier(.4,0,.2,1),
    box-shadow .36s ease;
}

.faq-page .faq-list details[open] summary::after{
  content:""!important;
  color:#fff;
  background:
    linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,
    linear-gradient(currentColor,currentColor) center/2px 0 no-repeat,
    linear-gradient(135deg,#0E9F68,#19B77C);
  box-shadow:0 10px 25px rgba(14,166,114,.25),inset 0 1px 0 rgba(255,255,255,.25);
  transform:rotate(180deg) scale(1.06);
}

.faq-page .faq-list details.is-closing summary::after{
  color:#8C6A18;
  background:
    linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,
    linear-gradient(currentColor,currentColor) center/2px 12px no-repeat,
    #FFF5D5;
  box-shadow:0 8px 20px rgba(164,120,23,.12),inset 0 1px 0 rgba(255,255,255,.72);
  transform:rotate(0deg) scale(1);
}

.faq-page .faq-list details > p{
  transform-origin:top center;
}

/* A completed Web Animation must never leave the answer transparent. The
   native <details> state remains the sole authority outside active motion. */
.faq-page .faq-list details:not(.is-opening):not(.is-closing)[open] > p{
  opacity:1!important;
  transform:none!important;
}

.faq-page .faq-list details[open]{
  background:#fff;
  box-shadow:0 16px 40px rgba(27,34,96,.075),inset 0 1px 0 rgba(255,255,255,.9);
}

@keyframes faqTapWash{
  0%{opacity:0;}
  34%{opacity:1;}
  100%{opacity:0;}
}

@media(max-width:560px){
  .faq-page .faq-list details::before{inset-block:11px;}
  .faq-page .faq-list summary::after{flex-basis:34px;width:34px;height:34px;}
}

@media(prefers-reduced-motion:reduce){
  .faq-page .faq-list details,
  .faq-page .faq-list details::before,
  .faq-page .faq-list details::after,
  .faq-page .faq-list summary,
  .faq-page .faq-list summary::before,
  .faq-page .faq-list summary::after{
    animation:none!important;
    transition:none!important;
  }
}