/* ==========================================================
   Mobile edition — Option D · Quiet disclosure
   Delivery, Capabilities and the biography fold into rows that
   open on tap; Selected Work shows title and return only.
   Phones only (≤ 760px). Desktop and laptop are untouched.
   ========================================================== */
.mx-acc__btn { display: contents; }
.mx-acc__icon, .mx-more { display: none; }

@media (max-width: 760px) {

  /* ---------- Shared accordion ---------- */
  html.mx .mx-acc__btn {
    display: grid; grid-template-columns: 2.4rem 1fr 1.4rem; align-items: center; column-gap: 0;
    width: 100%; padding: 1.35rem 0; margin: 0; min-height: 64px;
    background: none; border: 0; color: inherit; font: inherit; text-align: left;
    cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  html.mx .mx-acc__icon { display: block; position: relative; width: 14px; height: 14px; justify-self: end; }
  html.mx .mx-acc__icon::before, html.mx .mx-acc__icon::after {
    content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 1px;
    background: var(--gold); transition: transform 0.45s var(--ease);
  }
  html.mx .on-dark .mx-acc__icon::before, html.mx .on-dark .mx-acc__icon::after { background: var(--gold-lift); }
  html.mx .mx-acc__icon::after { transform: rotate(90deg); }
  html.mx .is-open > .mx-acc__btn .mx-acc__icon::after { transform: rotate(0deg); }

  html.mx .mx-acc__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.5s var(--ease); }
  html.mx .is-open > .mx-acc__panel { grid-template-rows: 1fr; }
  html.mx .mx-acc__panel > * { overflow: hidden; min-height: 0; }
  html.mx .mx-acc__panel > * > * { opacity: 0; transform: translateY(6px); transition: opacity 0.4s ease, transform 0.4s var(--ease); }
  html.mx .is-open > .mx-acc__panel > * > * { opacity: 1; transform: none; transition-delay: 0.08s; }

  /* ---------- Delivery ---------- */
  html.mx .method__row { display: block !important; padding: 0 !important; }
  html.mx .method__row::before { display: none; }
  html.mx .method__row .mx-acc__btn .method__no { margin: 0; opacity: 1 !important; font-size: var(--text-xs); letter-spacing: 0.14em; align-self: start; padding-top: 0.28em; }
  html.mx .method__row .mx-acc__btn h3 { margin: 0; font-size: 1.12rem; line-height: 1.3; padding-right: 0.8rem; transition: color 0.3s ease; }
  html.mx .method__row.is-open .mx-acc__btn h3 { color: var(--gold); }
  html.mx .method__row .mx-acc__panel > .method__body { padding-left: 2.4rem; }
  html.mx .method__row.is-open .mx-acc__panel > .method__body { padding-bottom: 1.6rem; }
  html.mx .method__row .method__lead { margin-top: 0; }
  html.mx .method__row p { font-size: 0.98rem; line-height: 1.6; }

  /* ---------- Capabilities ---------- */
  html.mx .disc__row { display: block !important; padding: 0 !important; }
  html.mx .disc__row::after { display: none; }
  html.mx .disc__row .mx-acc__btn .disc__no { margin: 0; }
  html.mx .disc__row .mx-acc__btn .disc__name { margin: 0; font-size: 1.12rem; transition: color 0.3s ease; }
  html.mx .disc__row.is-open .disc__name { color: var(--gold-lift); }
  html.mx .disc__row .mx-acc__panel > .disc__items { padding-left: 2.4rem !important; }
  html.mx .disc__row.is-open .mx-acc__panel > .disc__items { padding-bottom: 1.5rem !important; }

  /* ---------- Selected work: title and return, full story one tap away ---------- */
  html.mx .work { gap: 0 !important; }
  html.mx .work__item { padding: 1.5rem 0 1.7rem !important; }
  html.mx .work__item > p:not(.work__kind) { display: none; }
  html.mx .work__item h3 { font-size: 1.2rem; line-height: 1.28; margin-bottom: 1rem; }
  html.mx .work__item .payoff { margin-top: 0; }

  /* ---------- Biography: opening paragraph, then continue ---------- */
  html.mx .mx-bio.is-closed > p:not(:first-child) { display: none; }
  html.mx .mx-more {
    display: inline-flex; align-items: center; gap: 0.7rem; margin-top: 0.4rem;
    background: none; border: 0; padding: 0.6rem 0; font: inherit; cursor: pointer;
    font-size: var(--text-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold);
    -webkit-tap-highlight-color: transparent;
  }
  html.mx .mx-more::after { content: ''; width: 1.6rem; height: 1px; background: currentColor; }
}
@media (max-width: 760px) and (prefers-reduced-motion: reduce) {
  html.mx .mx-acc__panel, html.mx .mx-acc__panel > * > *, html.mx .mx-acc__icon::before, html.mx .mx-acc__icon::after { transition: none !important; }
}

/* ---------- Capabilities · The Plate ----------
   The open discipline sits on an inset plate held by fine foil corner marks,
   with the wordmark's gold dash as the mark for each item. Phones only. */
@media (max-width: 760px) {
  html.mx .disc__row .mx-acc__panel > .disc__items {
    position: relative; overflow: hidden;
    margin: 0 !important; padding: 0 1.3rem !important;
    transition: padding 0.5s var(--ease), margin 0.5s var(--ease), background-color 0.5s ease;
  }
  html.mx .disc__row.is-open .mx-acc__panel > .disc__items {
    margin: 0 0 1.4rem !important; padding: 1.15rem 1.3rem 1.25rem !important;
    background-color: #14130f;
    background-image:
      linear-gradient(var(--gold-lift), var(--gold-lift)), linear-gradient(var(--gold-lift), var(--gold-lift)),
      linear-gradient(var(--gold-lift), var(--gold-lift)), linear-gradient(var(--gold-lift), var(--gold-lift)),
      linear-gradient(var(--gold-lift), var(--gold-lift)), linear-gradient(var(--gold-lift), var(--gold-lift)),
      linear-gradient(var(--gold-lift), var(--gold-lift)), linear-gradient(var(--gold-lift), var(--gold-lift)),
      linear-gradient(160deg, rgba(201,162,39,0.07), rgba(201,162,39,0) 55%);
    background-size: 16px 1px, 1px 16px, 16px 1px, 1px 16px, 16px 1px, 1px 16px, 16px 1px, 1px 16px, 100% 100%;
    background-position: left top, left top, right top, right top, left bottom, left bottom, right bottom, right bottom, 0 0;
    background-repeat: no-repeat;
  }
  html.mx .disc__row .disc__items li {
    position: relative; z-index: 1; margin: 0 !important;
    padding: 0.72rem 0 0.72rem 1.7rem !important;
    border-top: 1px solid rgba(201,162,39,0.13);
    font-size: 1rem; line-height: 1.4; color: rgba(244,242,237,0.9) !important;
  }
  html.mx .disc__row .disc__items li:first-child { border-top: 0; }
  html.mx .disc__row .disc__items li::before {
    content: '' !important; position: absolute; left: 0; top: 1.4rem;
    width: 0.85rem; height: 2px; background: var(--gold-lift) !important; opacity: 1;
  }
}
