/* ==========================================================
   Widget : Accordéon Dual
   En-tête 2 colonnes + deux listes accordéon côte à côte
   ========================================================== */

.mb-acd {
  width: 100%;
}

/* ── En-tête ── */
.mb-acd__header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px 64px;
  align-items: end;
  margin-bottom: 64px;
}

.mb-acd__eyebrow {
  margin-bottom: 16px;
}

.mb-acd__title {
  font-family: var(--mb-font-heading, 'Playfair Display', serif);
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 400;
  line-height: 1.1;
  color: var(--mb-brown, #572400);
  margin: 0;
}

.mb-acd__title em {
  font-style: italic;
  color: var(--mb-brown, #572400);
}

.mb-acd__desc {
  font-family: var(--mb-font-body, 'Open Sans', system-ui, sans-serif);
  font-size: 14px;
  line-height: 1.75;
  color: var(--mb-muted, #8a6a5a);
  margin: 0;
  text-align: right;
  align-self: end;
}

/* ── Colonnes ── */
.mb-acd__cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 80px;
}

/* ── Titre colonne ── */
.mb-acd__col-title {
  font-family: var(--mb-font-heading, 'Playfair Display', serif);
  font-size: clamp(1.1rem, 1.8vw, 1.4rem);
  font-weight: 400;
  font-style: italic;
  color: var(--mb-brown, #572400);
  margin: 0 0 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--mb-ink, #1a0e08);
}

/* ── Liste ── */
.mb-acd__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ── Item ── */
.mb-acd__item {
  border-bottom: 1px solid rgba(87, 36, 0, .15);
}

.mb-acd__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 18px 0;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  gap: 16px;
}

/* ── Label ── */
.mb-acd__label {
  font-family: var(--mb-font-body, 'Open Sans', system-ui, sans-serif);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--mb-ink, #1a0e08);
  transition: color .2s;
}

.mb-acd__item.is-open .mb-acd__label {
  color: var(--mb-pink, #ff66c4);
}

/* ── Toggle +/× ── */
.mb-acd__toggle {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  color: var(--mb-muted, #8a6a5a);
}

.mb-acd__toggle::before,
.mb-acd__toggle::after {
  content: '';
  position: absolute;
  background: currentColor;
  border-radius: 1px;
  transition: transform .3s ease, opacity .3s ease;
}

/* Barre horizontale (toujours visible) */
.mb-acd__toggle::before {
  width: 14px;
  height: 1.5px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Barre verticale (visible = +, masquée = ×) */
.mb-acd__toggle::after {
  width: 1.5px;
  height: 14px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mb-acd__item.is-open .mb-acd__toggle {
  color: var(--mb-pink, #ff66c4);
}

.mb-acd__item.is-open .mb-acd__toggle::after {
  transform: translate(-50%, -50%) rotate(90deg);
  opacity: 0;
}

/* ── Corps (description) ── */
.mb-acd__body {
  overflow: hidden;
  max-height: 0;
  transition: max-height .35s ease, padding .35s ease;
  padding: 0;
}

.mb-acd__item.is-open .mb-acd__body {
  max-height: 400px;
  padding-bottom: 18px;
}

.mb-acd__body p {
  font-family: var(--mb-font-body, 'Open Sans', system-ui, sans-serif);
  font-size: 13px;
  line-height: 1.75;
  color: var(--mb-muted, #8a6a5a);
  margin: 0;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .mb-acd__header {
    grid-template-columns: 1fr;
    margin-bottom: 48px;
  }
  .mb-acd__desc {
    text-align: left;
  }
  .mb-acd__cols {
    grid-template-columns: 1fr;
    gap: 48px;
  }
}

@media (max-width: 768px) {
  .mb-acd__header {
    margin-bottom: 40px;
  }
}