.page-how .how-opening { max-width: 680px; font-size: 20px; line-height: 1.7; color: #435247; margin: 24px 0 32px; }
.page-how .visual-detail { border-top: 1px solid #cbd0c3; border-bottom: 1px solid #cbd0c3; margin: 30px 0; padding: 0 4px; color: #26372d; }
.page-how .visual-detail > summary { padding: 22px 0; cursor: pointer; font: 600 16px/1.6 Geist, Arial, sans-serif; }
.page-how .visual-detail[open] > summary { margin-bottom: 24px; }
.page-how .visual-detail .problem-grid { margin-top: 0; }
.page-how .product-gallery { display: flex; justify-content: center; gap: 30px; margin: 40px 0; }
.page-how .product-gallery figure { flex: 1; max-width: 340px; min-width: 0; margin: 0; }
.page-how .product-shot { padding: 24px; background: linear-gradient(145deg, #eee5d9, #e2e9dd); border: 1px solid #d7dccf; border-radius: 24px; }
.page-how .product-shot img { display: block; width: 100%; height: auto; border-radius: 18px; box-shadow: 0 12px 30px #26332720; }
.page-how .product-gallery figcaption { padding: 20px 4px; color: #435247; font: 14px/1.7 Geist, Arial, sans-serif; }
.page-how .product-gallery figcaption strong { display: block; color: #243329; font-size: 18px; margin-bottom: 6px; }
.page-how .product-gallery figcaption span { display: block; }
.page-how .visual-detail :is(.feature,.caps-group) { opacity: 1; transform: none; }
.page-how :is(.doors,.how,.features,.band) { padding-block: 72px; }
.page-how #contents { padding-block: 36px; }
.page-how .sc-contents .toc ol { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
.page-how #how > .wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .7fr); gap: 0 60px; align-items: start; }
.page-how #how :is(.section-eyebrow,.section-heading,.how-foot) { grid-column: 1 / -1; }
.page-how #how .steps { grid-template-columns: 1fr 1fr; margin-top: 30px; }
.page-how #how figure { margin: 30px auto 0 !important; width: 100%; }
.page-how #how .screenshot { padding: 24px; }
.page-how #how .how-foot { margin-top: 40px; }
@media (max-width: 650px) {
  .page-how .product-gallery { flex-direction: column; align-items: center; gap: 16px; }
  .page-how .product-gallery figure { width: 100%; max-width: 300px; }
  .page-how .product-shot { padding: 20px; }
  .page-how .how-opening { font-size: 18px; }
  .page-how :is(.doors,.how,.features,.band) { padding-block: 48px; }
  .page-how .sc-contents .toc ol { display: block; }
  .page-how #how > .wrap { display: block; }
  .page-how #how .steps { grid-template-columns: 1fr; }
}