/* =====================================================
   LEVEL 3 — Ascend Life Partners
   Carrier Stagger · FAQ Accordion · Nav Active · Parallax
   ===================================================== */

/* ─── Carrier logos — stagger reveal ─── */
.carrier-grid > a {
  opacity: 0;
  transform: translateY(18px) scale(0.95);
  transition:
    opacity   0.5s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.carrier-grid.carrier-visible > a {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.carrier-grid.carrier-visible > a:nth-child(1) { transition-delay: 0.05s; }
.carrier-grid.carrier-visible > a:nth-child(2) { transition-delay: 0.15s; }
.carrier-grid.carrier-visible > a:nth-child(3) { transition-delay: 0.25s; }
.carrier-grid.carrier-visible > a:nth-child(4) { transition-delay: 0.35s; }
.carrier-grid.carrier-visible > a:nth-child(5) { transition-delay: 0.45s; }

/* ─── FAQ accordion — icon + border glow ─── */
details {
  transition:
    border-color 0.3s ease,
    box-shadow   0.3s ease !important;
}

details[open] {
  border-color: rgba(176, 123, 48, 0.45) !important;
  box-shadow: 0 0 22px rgba(176, 123, 48, 0.10) !important;
}

/* Flecha indicadora en summary */
summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  list-style: none;
  user-select: none;
}

summary::-webkit-details-marker { display: none; }

summary::after {
  content: '▸';
  color: var(--gold2, #D4A44C);
  font-size: 13px;
  flex: 0 0 auto;
  margin-left: 12px;
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  display: inline-block;
}

details[open] summary::after {
  transform: rotate(90deg);
}

/* Contenido del accordion — expand animado */
.faq-body {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition:
    max-height 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    opacity    0.28s ease;
}

.faq-body.faq-open {
  opacity: 1;
  /* max-height se pone inline por JS */
}

.faq-body p {
  margin: 12px 0 0 !important;
  padding-top: 4px;
  border-top: 1px solid var(--line, rgba(201, 150, 46, 0.18));
}

/* ─── Nav active highlight ─── */
.btn.nav-active {
  border-color: rgba(176, 123, 48, 0.6) !important;
  color: var(--gold, #B07B30) !important;
  background: rgba(176, 123, 48, 0.10) !important;
}

/* ─── Parallax aurora container ─── */
.hero-aurora {
  will-change: transform;
}

/* ─── Page active indicator (current page nav link) ─── */
.btn.page-active {
  border-color: rgba(176, 123, 48, 0.5) !important;
  color: var(--gold, #B07B30) !important;
  background: rgba(176, 123, 48, 0.08) !important;
}