/* ============================================================
   FAQ section  (index.html  #faq)
   Matches site tokens: PT Sans, navy #122F71, red #122F71,
   square corners, #CACACA borders, soft hover shadow.
   ============================================================ */
.c9-faq{
  --faq-navy:#122F71;
  --faq-red:#122F71;
  --faq-text:#252628;
  --faq-line:#CACACA;
  --faq-ease:cubic-bezier(.22,.68,0,1.01);
  background:#F4F4F4;
  padding:60px 20px;
  font-family:"PT Sans",Sans-serif;
  position:relative;
  overflow:hidden;
}
.c9-faq *{box-sizing:border-box}
.c9-faq__inner{max-width:1140px;margin:0 auto}

/* ---------- Heading (same pattern as "WHAT WE OFFER / OUR SERVICES") ---------- */
.c9-faq__head{text-align:center;margin-bottom:40px}
.c9-faq__eyebrow{
  margin:0 0 4px;color:var(--faq-navy);
  font:600 16px/1.6em "PT Sans",Sans-serif;text-transform:uppercase;
}
.c9-faq .c9-faq__title{
  margin:0;color:var(--faq-navy);
  font:600 20px/1.6em "PT Sans",Sans-serif;text-transform:uppercase;
}
.c9-faq__bar{
  display:block;height:3px;width:0;margin:14px auto 16px;
  background:var(--faq-red);
  transition:width .9s var(--faq-ease) .25s;
}
.c9-faq__intro{
  max-width:640px;margin:0 auto;color:var(--faq-text);
  font:400 16px/1.6em "PT Sans",Sans-serif;
}

/* ---------- Accordion ---------- */
.c9-faq__list{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:14px}

.c9-faq__item{
  position:relative;background:#fff;border:1px solid var(--faq-line);
  transition:box-shadow .4s ease,border-color .4s ease,transform .4s var(--faq-ease);
}
/* red accent bar that grows down the left edge when the item opens */
.c9-faq__item::before{
  content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:4px;
  background:var(--faq-red);
  transform:scaleY(0);transform-origin:top;
  transition:transform .45s var(--faq-ease);
}
.c9-faq__item:hover{border-color:var(--faq-navy);transform:translateX(4px)}
.c9-faq__item.is-open{
  border-color:var(--faq-navy);
  box-shadow:0 0 23px -1px rgba(0,0,0,.13);
  transform:none;
}
.c9-faq__item.is-open::before{transform:scaleY(1)}

.c9-faq .c9-faq__q{
  all:unset;box-sizing:border-box;width:100%;cursor:pointer;
  display:flex;align-items:center;gap:18px;
  padding:20px 24px;
  font:600 18px/1.4em "PT Sans",Sans-serif;color:var(--faq-navy);
  transition:color .3s ease,padding-left .4s var(--faq-ease);
}
.c9-faq .c9-faq__q:hover,.c9-faq .c9-faq__q:focus,.c9-faq .c9-faq__q:active{
  background:transparent;color:var(--faq-navy);
}
.c9-faq .c9-faq__q:focus-visible{outline:2px solid var(--faq-red);outline-offset:-4px}
.c9-faq__qtext{flex:1}
.c9-faq .c9-faq__h{margin:0;padding:0;font:inherit;text-transform:none;color:inherit}
.c9-faq .c9-faq__item.is-open .c9-faq__q{padding-left:30px}

/* plus -> minus icon */
.c9-faq__icon{
  position:relative;flex:0 0 34px;width:34px;height:34px;
  border:2px solid var(--faq-navy);border-radius:50%;
  transition:background-color .35s ease,border-color .35s ease,transform .5s var(--faq-ease);
}
.c9-faq__icon::before,.c9-faq__icon::after{
  content:"";position:absolute;left:50%;top:50%;
  width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--faq-navy);
  transition:transform .45s var(--faq-ease),background-color .35s ease;
}
.c9-faq__icon::after{transform:rotate(90deg)}
.c9-faq__q:hover .c9-faq__icon{transform:scale(1.1)}
.c9-faq__item.is-open .c9-faq__icon{background:var(--faq-red);border-color:var(--faq-red);transform:rotate(180deg)}
.c9-faq__item.is-open .c9-faq__icon::before,
.c9-faq__item.is-open .c9-faq__icon::after{background:#fff}
.c9-faq__item.is-open .c9-faq__icon::after{transform:rotate(0)}

/* smooth height animation (no JS measuring needed) */
.c9-faq__a{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .5s var(--faq-ease);
}
.c9-faq__item.is-open .c9-faq__a{grid-template-rows:1fr}
.c9-faq__a-inner{overflow:hidden;min-height:0}
.c9-faq__a-inner p{
  margin:0;padding:0 24px 24px 30px;max-width:780px;
  color:var(--faq-text);font:400 16px/1.7em "PT Sans",Sans-serif;
  opacity:0;transform:translateY(-8px);
  transition:opacity .4s ease,transform .5s var(--faq-ease);
}
.c9-faq__item.is-open .c9-faq__a-inner p{opacity:1;transform:none;transition-delay:.12s}

/* ---------- CTA ---------- */
.c9-faq .elementor-button{border-radius:0;padding:16px 30px;font:400 16px/1.6em "PT Sans",Sans-serif;color:#fff;background:var(--faq-red)}
.c9-faq .elementor-button:hover,.c9-faq .elementor-button:focus{background:var(--faq-navy);color:#fff}
.c9-faq__cta{text-align:center;margin-top:40px}
.c9-faq__cta p{margin:0 0 16px;color:var(--faq-text);font:400 18px/1.6em "PT Sans",Sans-serif}

/* ---------- Scroll reveal (only active once JS adds --ready) ---------- */
.c9-faq--ready .c9-faq__head > *,
.c9-faq--ready .c9-faq__item,
.c9-faq--ready .c9-faq__cta{
  opacity:0;transform:translateY(28px);
  transition:opacity .8s var(--faq-ease),transform .8s var(--faq-ease),
             box-shadow .4s ease,border-color .4s ease;
}
.c9-faq--ready .c9-faq__bar{opacity:1;transform:none}
.c9-faq--ready.is-in .c9-faq__head > *,
.c9-faq--ready.is-in .c9-faq__item,
.c9-faq--ready.is-in .c9-faq__cta{opacity:1;transform:none}
.c9-faq--ready.is-in .c9-faq__item:hover{transform:translateX(4px)}
.c9-faq--ready.is-in .c9-faq__item.is-open:hover{transform:none}
.c9-faq--ready.is-in .c9-faq__bar{width:70px}

@media (max-width:767px){
  .c9-faq{padding:35px 15px 40px}
  .c9-faq__head{margin-bottom:28px}
  .c9-faq .c9-faq__q{font-size:16px;padding:16px 16px;gap:12px}
  .c9-faq .c9-faq__item.is-open .c9-faq__q{padding-left:20px}
  .c9-faq__icon{flex-basis:30px;width:30px;height:30px}
  .c9-faq__a-inner p{padding:0 16px 20px 20px;font-size:15px}
  .c9-faq__item:hover{transform:none}
}
@media (prefers-reduced-motion:reduce){
  .c9-faq *,.c9-faq *::before,.c9-faq *::after{transition:none!important;animation:none!important}
  .c9-faq--ready .c9-faq__head > *,.c9-faq--ready .c9-faq__item,.c9-faq--ready .c9-faq__cta{opacity:1;transform:none}
  .c9-faq--ready .c9-faq__bar{width:70px}
}