/* FAQ · índice del expediente. Misma disciplina que proof/equipo. Sin placa SaaS. */
.faq{
  position:relative;z-index:3;
  overflow:hidden;
  color:var(--charcoal,#f2f3f4);
  background:
    radial-gradient(70% 45% at 50% -10%, var(--section-glow,rgba(255,255,255,.04)), transparent 55%),
    linear-gradient(180deg, var(--mist,#0c0e11) 0%, var(--mist,#0c0e11) 100%);
}
.faq__in{
  position:relative;
  width:min(1180px, 100% - 64px);
  margin:0 auto;
  padding:clamp(56px, 8vh, 96px) 0 clamp(72px, 10vh, 120px);
}

.faq__head{
  display:grid;
  grid-template-columns:minmax(0, 1.25fr) minmax(220px, .75fr);
  gap:clamp(20px, 4vw, 48px);
  align-items:end;
  margin-bottom:clamp(28px, 4vh, 40px);
  padding-bottom:clamp(20px, 2.8vh, 28px);
  border-bottom:1px solid var(--line,rgba(255,255,255,.1));
}

.faq__title{
  margin:0;
  display:flex;flex-direction:column;align-items:flex-start;
  gap:clamp(10px, 1.4vh, 14px);
  max-width:min(100%, 18em);
  font:650 clamp(28px, 4vw, 48px)/1.1em "Geist Sans",system-ui,sans-serif;
  letter-spacing:-.035em;
}
.faq__title::before{
  content:"";display:block;height:2px;background:var(--orange,#FF6600);
  width:0;
}
.faq__title.is-shutter::before{
  animation:holdMarkDraw .55s cubic-bezier(.16,1,.3,1) forwards;
}
.faq__title .hold__shutter-line{justify-content:flex-start;max-width:100%}
.faq__title .hold__shutter-word{display:inline-flex;flex-wrap:nowrap;align-items:center}
.faq__title .hold__shutter-line--lead{
  font:650 12px/1 "Geist Sans",system-ui,sans-serif;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted-2,rgba(255,255,255,.48));
}
.faq__title .hold__shutter-line--lead .hold__shutter-char{padding:.04em .045em .12em}
.faq__title .hold__shutter-line--main{
  font:650 clamp(26px, 3.6vw, 44px)/1.1em "Geist Sans",system-ui,sans-serif;
  letter-spacing:-.035em;
  color:var(--charcoal,#f2f3f4);
  flex-wrap:wrap;max-width:100%;
  align-content:flex-start;row-gap:.08em;
}
.faq__title .hold__shutter-line--main .hold__shutter-char{
  padding:.06em .012em .12em;line-height:1.1em;
}
.faq__title.is-shutter .hold__shutter-base{
  opacity:0;filter:blur(10px);transform:translateY(16px);
  animation:holdShutterBase .55s cubic-bezier(.16,1,.3,1) forwards;
  animation-delay:calc(var(--i, 0) * 14ms + 40ms)
}
.faq__title.is-shutter .hold__shutter-slice--top{
  animation:holdShutterSweepR .55s cubic-bezier(.4,0,.2,1) forwards;
  animation-delay:calc(var(--i, 0) * 14ms)
}
.faq__title.is-shutter .hold__shutter-slice--mid{
  animation:holdShutterSweepL .55s cubic-bezier(.4,0,.2,1) forwards;
  animation-delay:calc(var(--i, 0) * 14ms + 40ms)
}
.faq__title.is-shutter .hold__shutter-slice--bot{
  animation:holdShutterSweepR .55s cubic-bezier(.4,0,.2,1) forwards;
  animation-delay:calc(var(--i, 0) * 14ms + 80ms)
}
.faq.is-pending .faq__title:not(.is-shutter) .hold__shutter-base{opacity:0}

.faq__lead{
  margin:clamp(14px, 2vh, 20px) 0 0;
  max-width:36ch;
  font:400 15px/1.5 "Geist Sans",system-ui,sans-serif;
  color:var(--muted,rgba(255,255,255,.58));
}

.faq__head-side{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:14px;
  text-align:right;
}
.faq__bridge{
  margin:0;
  max-width:28ch;
  font:400 14px/1.5 "Geist Sans",system-ui,sans-serif;
  color:var(--muted-2,rgba(255,255,255,.48));
}

/* Índice: filas hairline, contador tipográfico */
.faq__list{
  --faq-idx:3.2rem;
  margin:0;
  padding:0;
  list-style:none;
  border-top:1px solid var(--line,rgba(255,255,255,.1));
  counter-reset:faq-item;
}

.faq__item{
  border:0;
  border-bottom:1px solid var(--line,rgba(255,255,255,.08));
  counter-increment:faq-item;
  transition:background .3s ease;
}
.faq__item[open]{
  background:rgba(255,255,255,.02);
}
.faq__item[open] .faq__q{color:var(--ink,#fff)}
.faq__item[open] .faq__idx{color:var(--orange,#FF6600)}
.faq__item[open] .faq__chev{color:var(--orange,#FF6600)}
.faq__item[open] .faq__chev i{transform:scaleY(0)}

.faq__q{
  display:grid;
  grid-template-columns:var(--faq-idx) minmax(0, 1fr) auto;
  align-items:center;
  gap:clamp(12px, 2vw, 22px);
  width:100%;
  margin:0;
  padding:clamp(18px, 2.4vh, 26px) 0;
  cursor:pointer;
  list-style:none;
  font:550 clamp(16px, 1.5vw, 19px)/1.3 "Geist Sans",system-ui,sans-serif;
  letter-spacing:-.025em;
  color:var(--charcoal,#f2f3f4);
  transition:color .25s ease;
}
.faq__q::-webkit-details-marker{display:none}
.faq__q::marker{content:""}
.faq__q:hover{color:var(--ink,#fff)}
.faq__q:hover .faq__idx{color:rgba(255,255,255,.55)}
.faq__q:hover .faq__chev{color:var(--orange,#FF6600)}
.faq__q:focus-visible{
  outline:2px solid var(--orange,#FF6600);
  outline-offset:4px;
}

.faq__idx{
  font:650 12px/1 "Geist Sans",system-ui,sans-serif;
  letter-spacing:.14em;
  font-variant-numeric:tabular-nums;
  color:var(--muted-2,rgba(255,255,255,.38));
  transition:color .25s ease;
}
.faq__idx::before{
  content:counter(faq-item, decimal-leading-zero);
}

.faq__q-text{
  min-width:0;
  text-wrap:balance;
}

/* Plus hairline, sin caja redondeada */
.faq__chev{
  --faq-bar:1.5px;
  --faq-arm:11px;
  position:relative;
  width:18px;height:18px;
  color:rgba(242,243,244,.42);
  transition:color .25s ease;
}
.faq__chev::before{
  content:"";
  position:absolute;left:50%;top:50%;
  width:var(--faq-arm);height:var(--faq-bar);
  margin-left:calc(var(--faq-arm) / -2);
  margin-top:calc(var(--faq-bar) / -2);
  background:currentColor;
}
.faq__chev i{
  position:absolute;left:50%;top:50%;
  width:var(--faq-bar);height:var(--faq-arm);
  margin-left:calc(var(--faq-bar) / -2);
  margin-top:calc(var(--faq-arm) / -2);
  background:currentColor;
  transform-origin:center;
  transition:transform .35s cubic-bezier(.16,1,.3,1);
}

.faq__body{
  padding:0 0 clamp(20px, 2.6vh, 28px);
  padding-left:calc(var(--faq-idx) + clamp(12px, 2vw, 22px));
  padding-right:calc(18px + clamp(12px, 2vw, 22px));
}
.faq__a{
  margin:0;
  max-width:62ch;
  border-top:1px solid rgba(255,102,0,.35);
  padding-top:14px;
  font:400 15px/1.62 "Geist Sans",system-ui,sans-serif;
  color:var(--muted,rgba(255,255,255,.62));
  text-wrap:pretty;
}

/* Entrada de ítems: GSAP por pregunta (holding-faq.js). Sin batch CSS. */
.faq.is-pending .faq__head-side,
.faq.is-pending .faq__lead{
  opacity:0;
}

[data-theme="light"] .faq{
  background:
    radial-gradient(70% 45% at 50% -10%, rgba(26,27,29,.04), transparent 55%),
    linear-gradient(180deg, var(--mist,#eceae8) 0%, var(--mist,#eceae8) 100%);
}
[data-theme="light"] .faq__head,
[data-theme="light"] .faq__list,
[data-theme="light"] .faq__item{
  border-color:rgba(26,27,29,.1);
}
[data-theme="light"] .faq__item[open]{background:rgba(26,27,29,.03)}
[data-theme="light"] .faq__item[open] .faq__q,
[data-theme="light"] .faq__q:hover{color:var(--ink,#1a1b1d)}
[data-theme="light"] .faq__idx{color:rgba(26,27,29,.35)}
[data-theme="light"] .faq__q:hover .faq__idx{color:rgba(26,27,29,.55)}
[data-theme="light"] .faq__chev{color:rgba(26,27,29,.35)}
[data-theme="light"] .faq__a{
  border-top-color:rgba(255,102,0,.4);
  color:rgba(26,27,29,.68);
}
[data-theme="light"] .faq__bridge{color:rgba(26,27,29,.5)}

@media (max-width:900px){
  .faq__in{width:min(1180px, 100% - 40px)}
  .faq__head{
    grid-template-columns:1fr;
    align-items:start;
  }
  .faq__head-side{
    align-items:flex-start;
    text-align:left;
  }
  .faq__title{max-width:16em}
}
@media (max-width:640px){
  .faq__in{width:min(1180px, 100% - 28px);padding:clamp(56px, 8vh, 80px) 0}
  .faq__list{--faq-idx:2.4rem}
  .faq__q{
    gap:12px;
    font-size:15.5px;
    padding:16px 0;
  }
  .faq__body{
    padding-left:0;
    padding-right:0;
    padding-bottom:18px;
  }
  .faq__a{font-size:14.5px}
}
@media (prefers-reduced-motion: reduce){
  .faq__title.is-shutter .hold__shutter-base,
  .faq__title.is-shutter .hold__shutter-slice{animation:none!important;opacity:1!important;filter:none!important;transform:none!important}
  .faq__title.is-shutter .hold__shutter-slice{opacity:0!important}
  .faq__title.is-shutter::before{width:48px}
  .faq.is-pending .faq__head-side,
  .faq.is-pending .faq__lead,
  .faq__item{
    opacity:1!important;transform:none!important;transition:none!important
  }
}