.treatment-accordion {
  display: none;
}

@media (max-width: 600px) {
  .treatment-accordion-ready .treatment-layout {
    display: none;
  }

  .treatment-accordion {
    display: grid;
    gap: 10px;
    margin-top: 32px;
  }

  .treatment-accordion > details {
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
  }

  .treatment-accordion > details[open] {
    background: var(--soft);
  }

  .treatment-accordion summary {
    display: grid;
    grid-template-columns: 2ch minmax(0, 1fr) 12px;
    align-items: center;
    gap: 12px;
    min-height: 72px;
    padding: 14px 16px;
    cursor: pointer;
    list-style: none;
  }

  .treatment-accordion summary::-webkit-details-marker {
    display: none;
  }

  .treatment-accordion summary::after {
    content: '';
    justify-self: center;
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
  }

  .treatment-accordion details[open] > summary::after {
    transform: translateY(2px) rotate(225deg);
  }

  .treatment-accordion summary:focus-visible {
    outline: 2px solid #8a7861;
    outline-offset: -3px;
  }

  .treatment-accordion summary > span:first-child {
    color: #8a7861;
    font-size: 10px;
  }

  .treatment-accordion summary > span:nth-child(2) {
    font-family: var(--serif);
    font-size: clamp(23px, 6.4vw, 27px);
    line-height: 1.12;
  }

  .treatment-accordion summary small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font: 11px/1.5 var(--sans);
  }

  .treatment-accordion-body {
    padding: 3px 16px 18px 44px;
  }

  .treatment-accordion-body h3 {
    margin: 10px 0;
    font-size: 31px;
  }

  .treatment-accordion-body p:not(.eyebrow) {
    color: var(--muted);
    font-size: 14px;
    line-height: 1.65;
  }

  .treatment-accordion-body .text-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin-top: 6px;
  }
}