.able-faq-section{background:#fff;color:#22272b;padding:100px 0 110px;width:100%;font-family:inherit}
.able-faq-section *{box-sizing:border-box}
.able-faq-container{width:100%;max-width:1050px;padding:0 20px;margin:0 auto}
.able-faq-header{margin:0 0 43px}
.able-faq-header h2{margin:0 0 13px;font-size:clamp(29px,3.1vw,42px);line-height:1.14;letter-spacing:-.035em;font-weight:400;color:#20252e;font-family:inherit}
.able-faq-header p{margin:0;max-width:730px;font-size:15px;line-height:1.8;color:#42484d}
.able-faq-list{border-top:1px solid #d6d9dc}
.able-faq-item{border-bottom:1px solid #d6d9dc;position:relative}
.able-faq-item::before{content:"";position:absolute;left:0;top:-1px;width:0;height:2px;background:#ffca28;transition:width .65s cubic-bezier(.2,.7,.2,1)}
.able-faq-item:hover::before,.able-faq-item.is-open::before{width:100%}
.able-faq-question{margin:0;font:inherit}
.able-faq-toggle{width:100%;display:grid;grid-template-columns:56px minmax(0,1fr) 42px;gap:14px;align-items:center;text-align:left;border:0;background:transparent;cursor:pointer;padding:26px 3px 26px 0;color:#242829;font:inherit}
.able-faq-toggle:hover,.able-faq-toggle:focus-visible{color:#111}
.able-faq-toggle:focus-visible{outline:2px solid #a67b00;outline-offset:-2px}
.able-faq-index{font-size:11px;letter-spacing:.16em;color:#a98716;font-weight:600}
.able-faq-question-text{font-size:clamp(17px,1.65vw,23px);font-weight:400;line-height:1.3;letter-spacing:-.02em}
.able-faq-icon{width:34px;height:34px;display:grid;place-items:center;position:relative;border:1px solid #ced0d0;transition:background .3s,border-color .3s,transform .35s}
.able-faq-icon span{position:absolute;background:#1f262a;width:12px;height:1.5px;transition:transform .3s,background .3s}
.able-faq-icon span+span{transform:rotate(90deg)}
.able-faq-item.is-open .able-faq-icon{background:#ffca28;border-color:#ffca28;transform:rotate(180deg)}
.able-faq-item.is-open .able-faq-icon span+span{transform:rotate(0)}
.able-faq-answer{padding-left:70px;padding-right:54px;overflow:hidden}
.able-faq-answer[hidden]{display:none!important}
.able-faq-answer-inner{padding:0 0 28px;max-width:760px;animation:able-faq-answer-in .38s ease both}
.able-faq-answer p{margin:0;font-size:15px;line-height:1.85;color:#535b5f}
.able-faq-bottom{margin-top:40px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.able-faq-bottom p{margin:0;font-size:14px;color:#555d61}
.able-faq-cta{display:inline-flex;gap:38px;align-items:center;justify-content:space-between;min-height:50px;padding:0 20px;background:#ffca28;color:#161c20!important;text-decoration:none!important;font-size:11px;font-weight:700;letter-spacing:.12em;transition:background .25s,transform .25s}
.able-faq-cta:hover{background:#eeb900;transform:translateY(-2px)}
.able-faq-cta span:last-child{font-size:19px;line-height:1}
@keyframes able-faq-answer-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.able-faq-motion .able-faq-entrance{opacity:0;transform:translateY(22px);transition:opacity .75s ease,transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--faq-delay,0ms)}
.able-faq-motion .able-faq-entrance.is-visible{opacity:1;transform:translateY(0)}
@media(max-width:700px){.able-faq-section{padding:70px 0 80px}.able-faq-container{padding:0 18px}.able-faq-toggle{grid-template-columns:32px minmax(0,1fr) 32px;gap:8px;padding:21px 0}.able-faq-question-text{font-size:17px}.able-faq-icon{width:29px;height:29px}.able-faq-answer{padding-left:40px;padding-right:12px}.able-faq-bottom{align-items:stretch;flex-direction:column}.able-faq-cta{width:100%}}
@media(prefers-reduced-motion:reduce){.able-faq-motion .able-faq-entrance{opacity:1!important;transform:none!important;transition:none!important}.able-faq-answer-inner{animation:none!important}.able-faq-icon,.able-faq-item::before,.able-faq-cta{transition:none!important}}

/* v1.0.1 — override WordPress/theme button hover styles with Able yellow. */
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:hover,
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:focus-visible,
.able-faq-section .able-faq-list .able-faq-item.is-open .able-faq-toggle {
    background: #ffca28 !important;
    background-color: #ffca28 !important;
    color: #242829 !important;
    border-color: transparent !important;
    box-shadow: none !important;
}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:hover .able-faq-question-text,
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:focus-visible .able-faq-question-text,
.able-faq-section .able-faq-list .able-faq-item.is-open .able-faq-question-text {
    color: #242829 !important;
}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:hover .able-faq-index,
.able-faq-section .able-faq-list .able-faq-item.is-open .able-faq-index {
    color: #242829 !important;
}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:hover .able-faq-icon,
.able-faq-section .able-faq-list .able-faq-item.is-open .able-faq-icon {
    border-color: #242829 !important;
    background-color: #ffca28 !important;
}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:hover .able-faq-icon span,
.able-faq-section .able-faq-list .able-faq-item.is-open .able-faq-icon span {
    background-color: #242829 !important;
}

/* v1.0.2 — the theme adds blue on :focus (after clicking a closed accordion).
   Override every interactive state, preserving visible keyboard focus. */
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:is(:hover, :focus, :focus-visible, :active),
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle[aria-expanded="true"] {
  background: #ffca28 !important;
  background-color: #ffca28 !important;
  background-image: none !important;
  color: #242829 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:is(:hover, :focus, :focus-visible, :active) :is(.able-faq-question-text, .able-faq-index),
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle[aria-expanded="true"] :is(.able-faq-question-text, .able-faq-index) {
  color: #242829 !important;
}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:is(:hover, :focus, :focus-visible, :active) .able-faq-icon {
  background: #ffca28 !important;
  border-color: #242829 !important;
}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:is(:hover, :focus, :focus-visible, :active) .able-faq-icon span {
  background: #242829 !important;
}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:focus-visible {
  outline: 2px solid #242829 !important;
  outline-offset: -3px;
}

/* v1.0.3: vector CTA icon — consistent across devices, unaffected by emoji fonts. */
.able-faq-section .able-faq-cta .able-faq-cta-svg{display:block!important;flex:0 0 17px;width:17px!important;height:17px!important;color:#161c20!important;stroke:currentColor!important;fill:none!important;transition:transform .25s ease}
.able-faq-section .able-faq-cta:hover .able-faq-cta-svg{transform:translate(2px,-2px)}

/* v1.1.0 — full-width Able yellow FAQ, with clear-on-yellow accordion states. */
.able-faq-section{background:#ffca28!important;color:#242829!important}
.able-faq-header h2,.able-faq-header p,.able-faq-question-text,.able-faq-answer p,.able-faq-bottom p{color:#242829!important}
.able-faq-list{border-top-color:rgba(36,40,41,.28)!important}
.able-faq-item{border-bottom-color:rgba(36,40,41,.28)!important}
.able-faq-item::before{background:#242829!important}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle{background:transparent!important;background-image:none!important;color:#242829!important}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:is(:hover,:focus,:focus-visible,:active),
.able-faq-section .able-faq-list .able-faq-item.is-open .able-faq-toggle,
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle[aria-expanded="true"]{
 background:#edbb19!important;background-color:#edbb19!important;color:#242829!important;box-shadow:none!important
}
.able-faq-index{color:#5c4700!important}
.able-faq-icon{border-color:rgba(36,40,41,.5)!important;background:transparent!important}
.able-faq-section .able-faq-list .able-faq-item .able-faq-toggle:is(:hover,:focus,:focus-visible,:active) .able-faq-icon,
.able-faq-section .able-faq-list .able-faq-item.is-open .able-faq-icon{background:transparent!important;border-color:#242829!important}
.able-faq-cta,.able-faq-section .able-faq-cta{background:#242829!important;color:#ffca28!important}
.able-faq-cta:hover,.able-faq-section .able-faq-cta:focus{background:#131719!important;color:#ffca28!important}
.able-faq-section .able-faq-cta .able-faq-cta-svg{color:#ffca28!important}

/* v1.3.0 — charcoal / yellow abstract transition, no illustrations. */
.able-faq-section {
  background: #ffca28 !important;
  position: relative !important;
  isolation: isolate;
  overflow: hidden;
}
.able-faq-section > .able-faq-container {
  position: relative;
  z-index: 2;
}
.able-faq-decor {
  pointer-events: none !important;
  display: block;
  position: absolute;
  z-index: 0;
  opacity: 1 !important;
  user-select: none;
  background-image: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
  animation: none !important;
  transform: none !important;
}
/* An angled structural sweep along the outer right margin. */
.able-faq-decor--top {
  top: 0 !important;
  right: 0 !important;
  left: auto !important;
  bottom: auto !important;
  width: clamp(190px, 19vw, 370px) !important;
  height: min(650px, 72%) !important;
  clip-path: polygon(55% 0,100% 0,100% 100%,73% 94%,15% 34%) !important;
  background: linear-gradient(135deg,#313739 0%,#22282a 85%) !important;
}
/* Thin angled yellow cuts add depth without looking like caution tape. */
.able-faq-decor--top::before,
.able-faq-decor--top::after {
  content: '';
  position: absolute;
  height: 220%;
  width: 15px;
  top: -45%;
  left: 47%;
  background: #ffca28;
  opacity: .32;
  transform: rotate(-37deg);
}
.able-faq-decor--top::after {
  left: 62%;
  width: 4px;
  opacity: .6;
}
/* Broad dark angular foundation at the foot of the section. */
.able-faq-decor--bottom {
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  top: auto !important;
  width: 100% !important;
  height: clamp(80px, 11vw, 170px) !important;
  background: #242829 !important;
  clip-path: polygon(0 96%, 21% 81%, 48% 87%, 77% 45%, 100% 0, 100% 100%, 0 100%) !important;
}
.able-faq-decor--bottom::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  width: 45%;
  height: 100%;
  background: linear-gradient(125deg,transparent 25%,rgba(255,202,40,.13) 70%);
}
/* Keep the closing FAQ CTA and copy above the angular foundation. */
.able-faq-section .able-faq-bottom {
  position: relative;
  z-index: 3;
  padding-bottom: 60px;
}
@media(max-width: 1100px) {
  .able-faq-decor--top {
    width: 23vw !important;
    height: 420px !important;
    opacity: .78 !important;
  }
}
@media(max-width: 700px) {
  .able-faq-decor--top {
    width: 115px !important;
    height: 210px !important;
    opacity: .34 !important;
  }
  .able-faq-decor--bottom {
    height: 85px !important;
    clip-path: polygon(0 100%, 32% 82%, 67% 60%, 100% 22%, 100% 100%) !important;
  }
  .able-faq-section .able-faq-bottom {padding-bottom: 30px;}
}
@media(prefers-reduced-motion: reduce) {
  .able-faq-decor {animation: none !important;}
}

/* v1.3.1: seamless charcoal transition into the footer. */
.able-faq-section { border-bottom: 0 !important; margin-bottom: 0 !important; }
.able-faq-section .able-faq-decor--bottom {
  bottom: -1px !important;
  height: clamp(80px, 11vw, 170px) !important;
  background: #242829 !important;
}
/* Cover the last few pixels so the yellow section never shows through at the boundary. */
.able-faq-section::after {
  content: ""; display:block; position:absolute; left:0;right:0;bottom:0;
  height:5px; background:#242829; z-index:1;pointer-events:none;
}
/* The existing footer design includes a yellow top separator; remove it on pages with this FAQ. */
body:has(.able-faq-section) footer,
body:has(.able-faq-section) .site-footer,
body:has(.able-faq-section) .elementor-location-footer {
  border-top:0 !important;
}
body:has(.able-faq-section) footer::before,
body:has(.able-faq-section) .site-footer::before {
  border-top-color:transparent !important;
}
@media (max-width:700px) {
 .able-faq-section .able-faq-decor--bottom {height:85px !important;}
}

/* v1.3.2 — remove all tinted/yellow overlays from the footer transition. */
.able-faq-section .able-faq-decor--bottom,
.able-faq-section .able-faq-decor--bottom::before { background: #242829 !important; }
.able-faq-section .able-faq-decor--bottom::after,
.able-faq-section .able-faq-decor--bottom::before { content: none !important; display: none !important; }
.able-faq-section .able-faq-decor--top { background: #242829 !important; }

/* v1.3.3: balance both outside edges. Footer geometry remains unchanged. */
.able-faq-section .able-faq-decor--top {
  width: clamp(110px, 12vw, 215px) !important;
  height: min(560px, 60%) !important;
  clip-path: polygon(78% 0, 100% 0, 100% 100%, 90% 91%, 43% 37%) !important;
  opacity: 1 !important;
}
.able-faq-section .able-faq-decor--top::before,
.able-faq-section .able-faq-decor--top::after { display:none !important; content:none !important; }
.able-faq-section .able-faq-decor--left {
  display: block !important;
  position: absolute !important;
  top: 23% !important;
  left: 0 !important;
  right: auto !important;
  bottom: auto !important;
  width: clamp(75px, 8vw, 142px) !important;
  height: clamp(200px, 25vw, 380px) !important;
  background: #242829 !important;
  clip-path: polygon(0 0, 32% 7%, 100% 55%, 38% 100%, 0 100%) !important;
  transform:none !important;
  animation:none !important;
  opacity: 1 !important;
  z-index:0 !important;
}
.able-faq-section .able-faq-decor--left::after {
  content:"";
  position:absolute;
  left:24%;top:20%;height:68%;width:3px;
  transform:rotate(-18deg);
  background:#ffca28;
  opacity:.25;
}
@media (max-width:1100px) {
 .able-faq-section .able-faq-decor--left { width:65px !important; height:220px !important; opacity:.75 !important; }
 .able-faq-section .able-faq-decor--top { width:120px !important; height:360px !important; }
}
@media (max-width:700px) {
 .able-faq-section .able-faq-decor--left { display:none !important; }
 .able-faq-section .able-faq-decor--top { width:75px !important; height:180px !important; opacity:.32 !important; }
}


/* v1.3.4 — softened, tapered side geometry + subtle independent motion.
   Deliberately does not touch the proven charcoal footer transition. */
@keyframes able-faq-shape-left-drift {
  0%,100% { transform:translate3d(-4px,-5px,0) rotate(-.45deg); }
  50% { transform:translate3d(6px,8px,0) rotate(.65deg); }
}
@keyframes able-faq-shape-right-drift {
  0%,100% { transform:translate3d(1px,-7px,0) rotate(.3deg); }
  50% { transform:translate3d(-6px,10px,0) rotate(-.55deg); }
}
.able-faq-section .able-faq-decor--left {
  /* A complete tapered blade rather than the former flat lower termination. */
  clip-path:polygon(0 0, 45% 0, 100% 46%, 52% 77%, 12% 100%, 0 91%) !important;
  -webkit-clip-path:polygon(0 0, 45% 0, 100% 46%, 52% 77%, 12% 100%, 0 91%) !important;
  transform-origin:0 48% !important;
  animation:able-faq-shape-left-drift 12s ease-in-out infinite !important;
  will-change:transform;
}
.able-faq-section .able-faq-decor--top {
  transform-origin:100% 35% !important;
  animation:able-faq-shape-right-drift 15s ease-in-out infinite !important;
  will-change:transform;
}
@media (max-width:700px) {
 .able-faq-section .able-faq-decor--left { display:none !important; }
 .able-faq-section .able-faq-decor--top { animation-duration:18s !important; }
}
@media (prefers-reduced-motion:reduce) {
 .able-faq-section .able-faq-decor--left,
 .able-faq-section .able-faq-decor--top {animation:none !important; transform:none !important;will-change:auto !important;}
}

/* v1.3.5 — remove intrusive side wedges entirely, preserve the proven footer transition. */
.able-faq-section .able-faq-decor--top,
.able-faq-section .able-faq-decor--left { display:none !important; }
.able-faq-section .able-faq-decor--bottom { animation:none !important; }


/* v1.4.0 — one restrained architectural white cut at the section entrance.
   No multiple peaks, no gradients. The footer transition remains unchanged. */
.able-faq-section {padding-top: 145px !important;}
.able-faq-section::before {
 content:"" !important; display:block !important; position:absolute !important;
 inset:0 0 auto 0 !important; width:100% !important;
 height:112px !important; background:#fff !important;
 clip-path:polygon(0 0,100% 0,100% 34%,0 100%) !important;
 -webkit-clip-path:polygon(0 0,100% 0,100% 34%,0 100%) !important;
 pointer-events:none !important; z-index:1 !important;
}
@media(max-width:700px){
 .able-faq-section {padding-top:110px !important;}
 .able-faq-section::before {height:70px !important;}
}


/* v1.5.0: opposing, single-plane architectural angle cuts — no marquee. */
.able-faq-section { padding-top: 154px !important; }
/* Top: white sweeps DOWN toward the right. */
.able-faq-section::before {
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:0 0 auto 0 !important;
  width:100% !important;
  height:110px !important;
  background:#ffffff !important;
  clip-path:polygon(0 0,100% 0,100% 100%,0 16%) !important;
  -webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 16%) !important;
  z-index:1 !important;
  pointer-events:none !important;
}
/* Bottom: charcoal sweeps UP toward the right, in the opposite direction. */
.able-faq-section .able-faq-decor--bottom {
  background:#242829 !important;
  height:clamp(80px,11vw,170px) !important;
  clip-path:polygon(0 92%,100% 0,100% 100%,0 100%) !important;
  -webkit-clip-path:polygon(0 92%,100% 0,100% 100%,0 100%) !important;
}
@media(max-width:700px){
 .able-faq-section{padding-top:112px !important;}
 .able-faq-section::before{
    height:72px !important;
    clip-path:polygon(0 0,100% 0,100% 100%,0 15%) !important;
    -webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 15%) !important;
 }
 .able-faq-section .able-faq-decor--bottom{
    height:85px !important;
    clip-path:polygon(0 90%,100% 0,100% 100%,0 100%) !important;
    -webkit-clip-path:polygon(0 90%,100% 0,100% 100%,0 100%) !important;
 }
}


/* v1.5.1 — flatter top entrance angle and no bottom angle. */
.able-faq-section { padding-top: 146px !important; }
.able-faq-section::before {
  height: 96px !important;
  clip-path: polygon(0 0,100% 0,100% 100%,0 28%) !important;
  -webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 28%) !important;
}
.able-faq-section .able-faq-decor--bottom {
  height: 0 !important;
  min-height: 0 !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  background: transparent !important;
}
.able-faq-section::after {
  content: none !important;
  display: none !important;
}
.able-faq-section .able-faq-bottom {
  padding-bottom: 0 !important;
}
@media(max-width:700px){
  .able-faq-section { padding-top: 108px !important; }
  .able-faq-section::before {
    height: 64px !important;
    clip-path: polygon(0 0,100% 0,100% 100%,0 24%) !important;
    -webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 24%) !important;
  }
  .able-faq-section .able-faq-bottom { padding-bottom: 0 !important; }
}

/* v1.5.2: remove the white horizontal strip above the angled top transition. */
.able-faq-section { border-top:0 !important; }
.able-faq-section::before {
  top:-1px !important;
  height:97px !important;
  clip-path:polygon(0 0,100% 0,100% 100%) !important;
  -webkit-clip-path:polygon(0 0,100% 0,100% 100%) !important;
}
@media(max-width:700px) {
  .able-faq-section::before { height:65px !important; }
}

/* SkyInkCreations heading system 1.5.3: uniform section headings, charcoal only. */
.able-faq-section .able-faq-header h2 {font-family:Manrope,Arial,sans-serif!important;font-size:clamp(34px,3.5vw,50px)!important;font-weight:600!important;line-height:1.14!important;letter-spacing:-.045em!important;color:#242829!important;text-transform:none!important;}
@media(max-width:700px){.able-faq-section .able-faq-header h2{font-size:clamp(29px,7.1vw,38px)!important;line-height:1.16!important;letter-spacing:-.04em!important;}}
