/* Home page "How We Build Your Estimate": on phones each step is a dropdown (title row, tap to open the text).
   Everything is scoped to .steps.acc, which the script adds only on phone-width screens. */
@media (max-width:640px){
  .steps.acc .step{align-items:center}
  .steps.acc .step.is-open{align-items:start}
  .steps.acc .step-head{position:relative;margin-bottom:0;padding-right:30px;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .steps.acc .step.is-open .step-head{margin-bottom:10px}
  .steps.acc .step-head::after{content:"";position:absolute;right:4px;top:50%;width:9px;height:9px;margin-top:-6px;border-right:2px solid var(--teal);border-bottom:2px solid var(--teal);transform:rotate(45deg);transition:transform .2s}
  .steps.acc .step.is-open .step-head::after{margin-top:-2px;transform:rotate(-135deg)}
  .steps.acc .step p{display:none}
  .steps.acc .step.is-open p{display:block}
  .steps.acc .step-head:focus-visible{outline:2px solid var(--teal);outline-offset:4px;border-radius:8px}
}