/* AR Admission FAQ v1.0.1 — centred header + animated FAQ accordion.
   Every control-written value arrives as a CSS var on {{WRAPPER}} and is
   consumed here with its default as the var() fallback — this stylesheet
   declares no control vars of its own, so Elementor's per-device values
   always win. Defaults reproduce the Admission page FAQ section exactly. */

.arfaq-root{background:var(--arfaq-sec-bg,transparent); overflow-x:clip;}
.arfaq-qtext,.arfaq-atext{overflow-wrap:break-word;}

/* Header */
.arfaq-head{text-align:center; max-width:720px; margin:0 auto var(--arfaq-head-gap,44px);}
.arfaq-eyebrow{display:inline-block; background:var(--arfaq-eb-bg,rgba(219,137,39,.14));
  color:var(--arfaq-eb-c,#C1751F); font-weight:700; font-size:var(--arfaq-eb-fs,12.5px);
  letter-spacing:2.2px; text-transform:uppercase; padding:7px 16px; border-radius:100px;}
.arfaq-title{font-size:var(--arfaq-h-fs,36px); font-weight:800; line-height:1.2;
  color:var(--arfaq-h-c,#13183F); margin:16px 0 10px;}
.arfaq-accent{color:var(--arfaq-acc-c,#DB8927);}
.arfaq-sub{font-size:var(--arfaq-sub-fs,16.5px); color:var(--arfaq-sub-c,#4B5578); line-height:1.65; margin:0;}

/* FAQ list */
.arfaq-list{max-width:var(--arfaq-maxw,880px); margin:0 auto;}
.arfaq-item{background:var(--arfaq-card-bg,#FFFFFF);
  border:var(--arfaq-bw,1px) solid var(--arfaq-bc,#E9E5DA);
  border-radius:var(--arfaq-r,14px); margin-bottom:var(--arfaq-gap,12px);
  box-shadow:0 4px 14px rgba(10,8,59,.04); overflow:hidden;}
.arfaq-q{display:flex; align-items:center; justify-content:space-between; gap:14px;
  width:100%; background:none; border:none; cursor:pointer; text-align:left;
  padding:var(--arfaq-q-pad,19px 40px 19px 24px); font-family:inherit;
  font-size:var(--arfaq-q-fs,17px); font-weight:700; line-height:1.4;
  color:var(--arfaq-q-c,#13183F);}
.arfaq-item.open .arfaq-q{color:var(--arfaq-q-open-c, var(--arfaq-q-c,#13183F));}
.arfaq-ic{flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  color:var(--arfaq-ic-c,#C1751F); font-size:var(--arfaq-ic-fs,25px); font-weight:800;
  line-height:1; transition:transform .35s ease;}
.arfaq-ic svg{width:18px; height:18px; display:block;}
.arfaq-item.open .arfaq-ic{transform:rotate(45deg);}
.arfaq-root[data-icon="chevron"] .arfaq-item.open .arfaq-ic{transform:rotate(180deg);}
.arfaq-a{overflow:hidden;}
.arfaq-js .arfaq-a{transition:height var(--arfaq-acc-speed,350ms) ease;}
.arfaq-atext{padding:var(--arfaq-a-pad,0 40px 20px 24px);
  font-size:var(--arfaq-a-fs,15.5px); color:var(--arfaq-a-c,#4B5578); line-height:1.65;}

/* Entrance animations.
   Hidden state is applied ONLY when JS is running (it adds .arfaq-anim-on),
   so the section stays fully visible when JS is disabled. */
.arfaq-anim.arfaq-anim-on .arfaq-anim-item{opacity:0;}
.arfaq-anim.arfaq-anim-on[data-anim="fade-up"] .arfaq-anim-item{transform:translateY(30px);}
.arfaq-anim.arfaq-anim-on[data-anim="fade-down"] .arfaq-anim-item{transform:translateY(-30px);}
.arfaq-anim.arfaq-anim-on[data-anim="slide-left"] .arfaq-anim-item{transform:translateX(-42px);}
.arfaq-anim.arfaq-anim-on[data-anim="slide-right"] .arfaq-anim-item{transform:translateX(42px);}
.arfaq-anim.arfaq-anim-on[data-anim="zoom"] .arfaq-anim-item{transform:scale(.94);}
.arfaq-anim.arfaq-anim-on .arfaq-anim-item.in{opacity:1; transform:none;
  transition:opacity .6s ease, transform .6s ease;}
/* Small phones: tighten the eyebrow pill so it never wraps awkwardly.
   (Per-device sizes/paddings come from the responsive controls.) */
@media (max-width:480px){
  .arfaq-eyebrow{letter-spacing:1.5px; padding:6px 13px;}
}
@media (prefers-reduced-motion: reduce){
  .arfaq-anim.arfaq-anim-on .arfaq-anim-item{opacity:1; transform:none; transition:none;}
  .arfaq-js .arfaq-a{transition:none;}
  .arfaq-ic{transition:none;}
}
