/* ═══════════════════════════════════════════════════════════════════════════
   ALBERA CLIENTES — Premium Override v1.1
   Fixes: sidebar text legibility, empty space, responsive sidebar vertical
   ═══════════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600;9..40,700;9..40,800&family=Playfair+Display:wght@700;800&display=swap');

/* ─── TOKENS ─────────────────────────────────────────────────────────────── */
:root {
  --font:         'DM Sans', system-ui, sans-serif;
  --font-display: 'Playfair Display', Georgia, serif;
  --sb-bg:        #0c1628;
  --sb-border:    rgba(255,255,255,.07);
  --sb-text:      rgba(255,255,255,.78);
  --sb-text-h:    #ffffff;
  --sb-active-bg: rgba(201,132,42,.18);
  --sb-active:    #e8aa4a;
  --sb-label:     rgba(255,255,255,.32);
  --sb-w:         220px;
  --cu:      #c9842a;
  --cu-dk:   #a56820;
  --cu-lt:   #e8b468;
  --cu-bg:   #fff8ee;
  --cu-ring: rgba(201,132,42,.2);
  --bg-main:   #f4f2ee;
  --card-bg:   #ffffff;
  --card-bd:   rgba(0,0,0,.07);
  --card-sh:   0 1px 3px rgba(0,0,0,.06), 0 4px 18px rgba(0,0,0,.05);
  --card-sh-h: 0 2px 10px rgba(0,0,0,.09), 0 16px 36px rgba(0,0,0,.07);
  --tb-h: 60px;
  --r:  10px;
  --rl: 14px;
}

/* ══════════════════════════════════════════════════════════════════════════
   WRAP — siempre grid 2 columnas
   ══════════════════════════════════════════════════════════════════════════ */
.ac-wrap {
  font-family: var(--font) !important;
  font-size: 14px !important;
  background: var(--bg-main) !important;
  --sidebar-w: var(--sb-w) !important;
  display: grid !important;
  grid-template-columns: var(--sb-w) 1fr !important;
  grid-template-rows: auto 1fr !important;
  min-height: 100vh !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   TOPBAR
   ══════════════════════════════════════════════════════════════════════════ */
.ac-topbar {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  height: var(--tb-h) !important;
  background: var(--sb-bg) !important;
  border-bottom: 1px solid var(--sb-border) !important;
  box-shadow: none !important;
  padding: 0 20px 0 0 !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 200 !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
}

.ac-topbar__brand {
  background: transparent !important;
  color: #fff !important;
  font-family: var(--font-display) !important;
  font-size: .95rem !important;
  letter-spacing: .01em !important;
  padding: 0 20px !important;
  height: var(--tb-h) !important;
  margin-right: 0 !important;
  border-right: 1px solid var(--sb-border) !important;
  width: var(--sb-w) !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
}

.ac-topbar__logo {
  background: linear-gradient(135deg, var(--cu-lt), var(--cu)) !important;
  box-shadow: 0 2px 12px rgba(201,132,42,.35) !important;
  border-radius: 10px !important;
}

.ac-topbar__space { flex: 1 !important; }
.ac-topbar__right { display: flex !important; align-items: center !important; gap: 10px !important; }
.ac-topbar__user-name { color: rgba(255,255,255,.55) !important; font-size: .79rem !important; }

.ac-lang-switch {
  gap: 6px !important;
  align-items: center !important;
}
.ac-lang-switch__label {
  color: rgba(255,255,255,.5) !important;
  font-size: .62rem !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
.ac-lang-switch__select {
  min-width: 110px !important;
  height: 34px !important;
  padding: 0 28px 0 11px !important;
  /* Solid visible pill — white frosted */
  background-color: rgba(255,255,255,.16) !important;
  border: 1.5px solid rgba(255,255,255,.38) !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  font-size: .82rem !important;
  font-weight: 600 !important;
  font-family: var(--font) !important;
  cursor: pointer !important;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease !important;
  /* Chevron arrow */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23ffffff' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 9px center !important;
  background-size: 10px 6px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 3px rgba(0,0,0,.2) !important;
}
.ac-lang-switch__select:hover {
  background-color: rgba(255,255,255,.24) !important;
  border-color: rgba(255,255,255,.55) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 2px 6px rgba(0,0,0,.25) !important;
}
.ac-lang-switch__select:focus {
  background-color: rgba(255,255,255,.22) !important;
  border-color: var(--cu) !important;
  box-shadow: 0 0 0 3px var(--cu-ring) !important;
  outline: none !important;
}
.ac-lang-switch__select option {
  color: #111827 !important;
  background: #ffffff !important;
  font-weight: 600 !important;
}

.ac-topbar .ac-btn--secondary,
.ac-topbar a.ac-btn--secondary {
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
}
.ac-topbar .ac-btn--secondary:hover {
  background: rgba(255,255,255,.14) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}

.ac-notif-bell {
  background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  color: rgba(255,255,255,.72) !important;
}
.ac-notif-bell:hover {
  background: rgba(255,255,255,.12) !important;
  border-color: var(--cu) !important;
  color: #fff !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   SIDEBAR — siempre vertical, texto legible
   ══════════════════════════════════════════════════════════════════════════ */
.ac-sidebar {
  grid-row: 2 !important;
  grid-column: 1 !important;
  background: var(--sb-bg) !important;
  border-right: 1px solid var(--sb-border) !important;
  border-bottom: none !important;
  border-top: 3px solid var(--cu) !important;

  /* Siempre columna vertical */
  display: flex !important;
  flex-direction: column !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  position: sticky !important;
  top: var(--tb-h) !important;
  height: calc(100vh - var(--tb-h)) !important;
  width: var(--sb-w) !important;
  padding: 14px 10px !important;
  gap: 0 !important;
}

.ac-sidebar__section-label {
  display: block !important;
  color: var(--sb-label) !important;
  font-size: .58rem !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  padding: 16px 10px 4px !important;
  white-space: nowrap !important;
}

.ac-nav-item {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 9px 11px !important;
  border-radius: 8px !important;
  color: var(--sb-text) !important;
  font-family: var(--font) !important;
  font-size: .84rem !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  transition: background 140ms ease, color 140ms ease !important;
  position: relative !important;
  flex-shrink: 0 !important;
  width: 100% !important;
  scroll-snap-align: unset !important;
}

.ac-nav-item:hover {
  background: rgba(255,255,255,.08) !important;
  color: var(--sb-text-h) !important;
}

.ac-nav-item.active {
  background: var(--sb-active-bg) !important;
  color: var(--sb-active) !important;
  font-weight: 600 !important;
}

.ac-nav-item.active::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 22% !important;
  bottom: 22% !important;
  width: 3px !important;
  background: var(--cu) !important;
  border-radius: 0 3px 3px 0 !important;
}

.ac-nav-icon {
  font-size: 1rem !important;
  width: 20px !important;
  height: 20px !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 1 !important;
  line-height: 1 !important;
}

.ac-nav-badge {
  background: var(--cu) !important;
  box-shadow: 0 0 8px rgba(201,132,42,.4) !important;
  margin-left: auto !important;
  min-width: 18px !important;
  height: 18px !important;
}

.ac-sidebar__bottom {
  display: block !important;
  margin-top: auto !important;
  padding-top: 10px !important;
  border-top: 1px solid var(--sb-border) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   MAIN — sin espacio vacío
   ══════════════════════════════════════════════════════════════════════════ */
.ac-main {
  grid-row: 2 !important;
  grid-column: 2 !important;
  padding: 22px 24px 28px !important;
  min-height: 0 !important;
  background: var(--bg-main) !important;
  font-family: var(--font) !important;
}

.ac-main::before { display: none !important; }

/* ══════════════════════════════════════════════════════════════════════════
   STAT CARDS
   ══════════════════════════════════════════════════════════════════════════ */
.ac-stats-grid {
  gap: 12px !important;
  margin-bottom: 18px !important;
}

.ac-stat-card {
  background: var(--card-bg) !important;
  border: 1px solid var(--card-bd) !important;
  border-radius: var(--rl) !important;
  box-shadow: var(--card-sh) !important;
  padding: 18px 18px 15px !important;
  transition: box-shadow 200ms ease, transform 200ms ease !important;
  overflow: hidden !important;
  position: relative !important;
}

.ac-stat-card:hover {
  box-shadow: var(--card-sh-h) !important;
  transform: translateY(-2px) !important;
}

.ac-stat-card::before {
  height: 4px !important;
  border-radius: var(--rl) var(--rl) 0 0 !important;
  background: linear-gradient(90deg, #e2ddd5, #c8c0b5) !important;
}

.ac-stat-card--copper::before { background: linear-gradient(90deg, var(--cu-lt), var(--cu)) !important; }
.ac-stat-card--green::before  { background: linear-gradient(90deg, #86efac, #16a34a) !important; }
.ac-stat-card--mint::before   { background: linear-gradient(90deg, #6ee7b7, #059669) !important; }
.ac-stat-card--red::before    { background: linear-gradient(90deg, #fca5a5, #dc2626) !important; }
.ac-stat-card--blue::before   { background: linear-gradient(90deg, #93c5fd, #2563eb) !important; }
.ac-stat-card--purple::before { background: linear-gradient(90deg, #c4b5fd, #7c3aed) !important; }

.ac-stat-card__num {
  font-size: 2.1rem !important;
  font-weight: 800 !important;
  letter-spacing: -.05em !important;
  color: #0c1628 !important;
  line-height: 1 !important;
  margin-bottom: 5px !important;
  font-family: var(--font) !important;
}

.ac-stat-card__label {
  font-size: .65rem !important;
  font-weight: 700 !important;
  letter-spacing: .09em !important;
  color: #9ca3af !important;
  text-transform: uppercase !important;
}

.ac-stat-card__icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  font-size: .9rem !important;
  margin-bottom: 10px !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   CARDS
   ══════════════════════════════════════════════════════════════════════════ */
.ac-card {
  background: var(--card-bg) !important;
  border: 1px solid var(--card-bd) !important;
  border-radius: var(--rl) !important;
  box-shadow: var(--card-sh) !important;
  margin-bottom: 14px !important;
}
.ac-card:hover { box-shadow: var(--card-sh-h) !important; }
.ac-card--top-gap { margin-top: 0 !important; }

.ac-card__head {
  background: #fafaf9 !important;
  border-bottom: 1px solid rgba(0,0,0,.05) !important;
  padding: 12px 18px !important;
}

.ac-card__title {
  font-size: .71rem !important;
  letter-spacing: .1em !important;
  color: #374151 !important;
}

.ac-card__body { padding: 18px !important; }

.ac-card-title-sm {
  font-size: .75rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .09em !important;
  color: #374151 !important;
  padding: 13px 18px 0 !important;
  margin: 0 !important;
  display: block !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   FORMULARIOS
   ══════════════════════════════════════════════════════════════════════════ */
.ac-form { padding: 0 18px 16px !important; }
.ac-form-row { margin-bottom: 12px !important; }

.ac-form-row label,
.ac-label {
  font-size: .67rem !important;
  font-weight: 700 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  color: #6b7280 !important;
  display: block !important;
  margin-bottom: 5px !important;
}

.ac-input,
.ac-select,
.ac-textarea,
.ac-form-row input,
.ac-form-row select,
.ac-form-row textarea {
  border: 1.5px solid #e5e7eb !important;
  border-radius: var(--r) !important;
  padding: 9px 13px !important;
  font-family: var(--font) !important;
  font-size: .875rem !important;
  background: #fff !important;
  color: #111827 !important;
  transition: border-color 140ms ease, box-shadow 140ms ease !important;
  width: 100% !important;
  outline: none !important;
}

.ac-input:focus,
.ac-select:focus,
.ac-textarea:focus,
.ac-form-row input:focus,
.ac-form-row select:focus,
.ac-form-row textarea:focus {
  border-color: var(--cu) !important;
  box-shadow: 0 0 0 3px var(--cu-ring) !important;
}

.ac-form-row input::placeholder { color: #c9c4bc !important; }
.ac-form-actions {
  margin-top: 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   BOTONES
   ══════════════════════════════════════════════════════════════════════════ */
.ac-btn {
  font-family: var(--font) !important;
  font-size: .83rem !important;
  font-weight: 600 !important;
  padding: 9px 20px !important;
  border-radius: var(--r) !important;
  border: 1.5px solid transparent !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: all 150ms cubic-bezier(.22,1,.36,1) !important;
  letter-spacing: -.01em !important;
  background: #0c1628 !important;
  color: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.18) !important;
  line-height: 1.4 !important;
}

.ac-btn:hover {
  background: var(--cu) !important;
  border-color: var(--cu) !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 16px rgba(201,132,42,.3) !important;
}

.ac-btn:active { transform: translateY(0) !important; }
.ac-btn--sm { padding: 6px 14px !important; font-size: .78rem !important; }
.ac-btn--lg { padding: 12px 28px !important; font-size: .93rem !important; }

.ac-btn--primary {
  background: linear-gradient(135deg, var(--cu-lt), var(--cu)) !important;
  border-color: var(--cu) !important;
  color: #fff !important;
  box-shadow: 0 2px 12px rgba(201,132,42,.28) !important;
}
.ac-btn--primary:hover {
  background: linear-gradient(135deg, var(--cu), var(--cu-dk)) !important;
  box-shadow: 0 6px 20px rgba(201,132,42,.38) !important;
}

.ac-btn--secondary {
  background: #fff !important;
  border-color: #e5e7eb !important;
  color: #374151 !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.06) !important;
}
.ac-btn--secondary:hover {
  background: #f9fafb !important;
  border-color: #d1d5db !important;
  color: #111827 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.09) !important;
}

.ac-btn--success {
  background: linear-gradient(135deg, #4ade80, #16a34a) !important;
  border-color: #16a34a !important;
  color: #fff !important;
  box-shadow: 0 2px 10px rgba(22,163,74,.25) !important;
}
.ac-btn--success:hover {
  background: linear-gradient(135deg, #22c55e, #15803d) !important;
  box-shadow: 0 5px 18px rgba(22,163,74,.32) !important;
}

/* FIX: btn--danger siempre visible */
.ac-btn--danger {
  background: #fff !important;
  border-color: rgba(220,38,38,.3) !important;
  color: #dc2626 !important;
  box-shadow: none !important;
}
.ac-btn--danger:hover {
  background: #dc2626 !important;
  border-color: #dc2626 !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(220,38,38,.25) !important;
}

.ac-btn--ghost {
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(0,0,0,.08) !important;
  color: #6b7280 !important;
  box-shadow: none !important;
}
.ac-btn--ghost:hover {
  background: rgba(0,0,0,.08) !important;
  color: #111827 !important;
  box-shadow: none !important;
}

.ac-btn--full { width: 100% !important; }

/* ══════════════════════════════════════════════════════════════════════════
   OVERRIDE BREAKPOINTS: sidebar siempre vertical
   ══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .ac-wrap {
    grid-template-columns: var(--sb-w) 1fr !important;
    grid-template-rows: auto 1fr !important;
  }
  .ac-sidebar {
    grid-column: 1 !important;
    grid-row: 2 !important;
    flex-direction: column !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    position: sticky !important;
    top: var(--tb-h) !important;
    height: calc(100vh - var(--tb-h)) !important;
    border-right: 1px solid var(--sb-border) !important;
    border-bottom: none !important;
    padding: 14px 10px !important;
    width: var(--sb-w) !important;
  }
  .ac-sidebar__section-label { display: block !important; }
  .ac-sidebar__bottom        { display: block !important; }
  .ac-nav-item {
    flex-shrink: 0 !important;
    padding: 9px 11px !important;
    font-size: .83rem !important;
    width: 100% !important;
    scroll-snap-align: unset !important;
  }
  .ac-main {
    grid-row: 2 !important;
    grid-column: 2 !important;
    padding: 18px 18px 24px !important;
    min-height: 0 !important;
  }
  .ac-topbar {
    height: var(--tb-h) !important;
    padding: 0 16px 0 0 !important;
    flex-wrap: nowrap !important;
  }
  .ac-topbar__brand {
    width: var(--sb-w) !important;
    flex-shrink: 0 !important;
    margin-right: 0 !important;
  }
  .ac-topbar__space { display: block !important; }
  .ac-topbar__right { width: auto !important; justify-content: flex-end !important; }
  .ac-stats-grid { grid-template-columns: repeat(auto-fill, minmax(150px,1fr)) !important; }
  .ac-form-cols { grid-template-columns: 1fr 1fr !important; }
}

/* En pantallas muy pequeñas: sidebar colapsada a solo iconos */
@media (max-width: 640px) {
  :root { --sb-w: 52px; }
  .ac-nav-item {
    padding: 10px 0 !important;
    justify-content: center !important;
    overflow: visible !important;
  }
  /* Ocultar texto en sidebar compacta */
  .ac-nav-item > *:not(.ac-nav-icon) { display: none !important; }
  .ac-nav-icon { width: 22px !important; height: 22px !important; font-size: 1.1rem !important; }
  .ac-sidebar__section-label { display: none !important; }
  .ac-sidebar__bottom { display: none !important; }
  .ac-topbar__brand { padding: 0 14px !important; width: var(--sb-w) !important; }
  .ac-topbar__brand > *:not(.ac-topbar__logo) { display: none !important; }
  .ac-main { padding: 14px 14px 20px !important; }
  .ac-stats-grid { grid-template-columns: 1fr 1fr !important; }
  .ac-form-cols  { grid-template-columns: 1fr !important; }
}

/* ══════════════════════════════════════════════════════════════════════════
   RESTO DE COMPONENTES
   ══════════════════════════════════════════════════════════════════════════ */
.ac-badge {
  font-family: var(--font) !important;
  font-size: .66rem !important;
  font-weight: 700 !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
}

.ac-table-wrap {
  border-radius: var(--rl) !important;
  border: 1px solid rgba(0,0,0,.07) !important;
  box-shadow: var(--card-sh) !important;
}
.ac-table { font-size: .84rem !important; }
.ac-table th {
  background: #f9fafb !important;
  font-size: .63rem !important;
  letter-spacing: .11em !important;
  color: #9ca3af !important;
  padding: 10px 16px !important;
}
.ac-table td {
  padding: 11px 16px !important;
  color: #374151 !important;
  border-bottom: 1px solid rgba(0,0,0,.04) !important;
}
.ac-table tbody tr:hover td { background: rgba(201,132,42,.025) !important; }

.ac-chat-layout {
  border-radius: var(--rl) !important;
  border: 1px solid rgba(0,0,0,.07) !important;
  box-shadow: var(--card-sh) !important;
}
.ac-msg--client .ac-msg-body {
  background: linear-gradient(135deg, #0f2040, #0c1628) !important;
  border-radius: 14px 4px 14px 14px !important;
}
.ac-reply-row textarea {
  border-radius: var(--r) !important;
  border: 1.5px solid #e5e7eb !important;
  font-family: var(--font) !important;
}
.ac-reply-row textarea:focus {
  border-color: var(--cu) !important;
  box-shadow: 0 0 0 3px var(--cu-ring) !important;
}

.ac-notif-panel {
  border-radius: 16px !important;
  box-shadow: 0 8px 40px rgba(0,0,0,.15) !important;
}

.ac-pm-card {
  background: var(--card-bg) !important;
  border: 1px solid var(--card-bd) !important;
  border-radius: var(--rl) !important;
  box-shadow: var(--card-sh) !important;
}
.ac-pm-table th {
  background: #f9fafb !important;
  font-size: .63rem !important;
  letter-spacing: .11em !important;
  color: #9ca3af !important;
}
.ac-pm-table td { border-bottom: 1px solid rgba(0,0,0,.04) !important; }

.ac-empty { padding: 28px 24px !important; }
.ac-notice { border-radius: var(--r) !important; font-size: .84rem !important; }
.ac-link-btn { font-family: var(--font) !important; color: var(--cu) !important; }

/* Scrollbars finos */
.ac-sidebar::-webkit-scrollbar { width: 3px; }
.ac-sidebar::-webkit-scrollbar-track { background: transparent; }
.ac-sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.12); border-radius: 3px; }
.ac-messages::-webkit-scrollbar { width: 3px; }
.ac-messages::-webkit-scrollbar-track { background: transparent; }
.ac-messages::-webkit-scrollbar-thumb { background: rgba(0,0,0,.1); border-radius: 3px; }

/* Animaciones de entrada */
@keyframes ac-slide-up {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.ac-stats-grid .ac-stat-card { animation: ac-slide-up 360ms ease both; }
.ac-stats-grid .ac-stat-card:nth-child(2) { animation-delay: 50ms; }
.ac-stats-grid .ac-stat-card:nth-child(3) { animation-delay: 100ms; }
.ac-stats-grid .ac-stat-card:nth-child(4) { animation-delay: 150ms; }
.ac-card { animation: ac-slide-up 320ms ease both; }
.ac-card:nth-child(2) { animation-delay: 55ms; }
.ac-card:nth-child(3) { animation-delay: 110ms; }