/* Readable mobile type, including narrow Android viewports. */
@media (max-width: 650px) {
  body { font-size: 16px; --muted: #52616c; }
  /* Override the small section-specific copy styles consistently. */
  body main p:not(.eyebrow) { font-size: 16px !important; line-height: 1.75; }
  body main p.eyebrow { font-size: 12px !important; line-height: 1.65; letter-spacing: .07em; }
  body main p.hero-product { font-size: 18px !important; line-height: 1.6; }
  body main p.contact-hint { font-size: 14px !important; }
  .hero h1, .hero h1 em { font-size: 38px; line-height: 1.18; letter-spacing: -.04em; }
  h2, .quote h2, .contact-band h2, .faq h2, .advice h2 { font-size: 32px; line-height: 1.3; }
  .compact-about h2 { font-size: 29px; }
  .hero-copy { padding-left: 22px; padding-right: 22px; }
  main .button { font-size: 15px !important; line-height: 1.45; min-height: 56px; }
  .hero .actions { gap: 10px; }
  .hero .actions a { padding: 14px 11px; min-height: 83px; }
  .hero .actions small { font-size: 12px; line-height: 1.5; }
  .hero .actions b { display: none; }
  .hero-foot { font-size: 11px; gap: 8px; flex-wrap: wrap; line-height: 1.6; }
  .hero-foot span { white-space: nowrap; }
  .header-call { font-size: 14px; }
  .header .mobile-menu nav a { font-size: 16px; padding: 13px 0; line-height: 1.5; }
  .intent-nav>span, .quote-checklist>span, .product-top, .service-list article>span { font-size: 12px; line-height: 1.6; letter-spacing: .05em; }
  .intent-nav a { font-size: 16px; padding: 14px; line-height: 1.5; }
  .product-top { gap: 12px; flex-wrap: wrap; }
  .text-link, .door-grid .text-link { font-size: 15px; line-height: 1.5; gap: 14px; min-height: 64px; }
  .quote-points li { font-size: 16px; line-height: 1.7; }
  .quote-checklist li strong { font-size: 17px; line-height: 1.5; }
  .quote-checklist li b, .timeline span { font-size: 13px; }
  .assurance-list h3, .service-list h3, .timeline h3 { font-size: 21px; line-height: 1.4; }
  .assurance-list article>span { font-size: 13px; }
  .equipment-item summary strong { font-size: 19px; line-height: 1.45; }
  .equipment-item summary small { font-size: 15px; line-height: 1.6; }
  .equipment-item summary .item-number { font-size: 13px; }
  .equipment-item summary { gap: 12px; padding: 21px 0; }
  .equipment-detail { padding-left: 0; }
  .equipment-note .button { white-space: normal; }
  .config-fold summary span, .faq summary { font-size: 17px; line-height: 1.55; }
  .config-fold .config-table>div { grid-template-columns: 1fr; gap: 7px; font-size: 16px; line-height: 1.7; }
  .config-table dt { font-weight: 600; }
  .swatch { width: 44px; height: 44px; }
  .consult-details>summary strong { font-size: 19px; }
  .consult-details>summary small { font-size: 14px; line-height: 1.6; }
  .consult-fields { grid-template-columns: 1fr; }
  .consult-fields label, .message-label { font-size: 15px; }
  select, textarea { font-size: 16px; line-height: 1.6; }
  select { padding: 12px; min-height: 48px; }
  .consult-actions { grid-template-columns: 1fr; }
  .hero-visual figcaption, .equipment-drawing figcaption, .product-picture small, .shaft-scene small, .color-preview>span, .visual-note span { font-size: 12px; line-height: 1.5; letter-spacing: .02em; }
  .equipment-drawing { padding-bottom: 52px; }
  .visual-note strong { font-size: 24px; }
  .full-footer p, .footer-main>div:first-child p, .footer-main nav a, .footer-contact>a { font-size: 14px; line-height: 1.7; }
  .footer-main strong { font-size: 16px; }
  .footer-bottom small, .footer-bottom small+small { font-size: 12px; line-height: 1.7; }
  .footer-main>div:first-child { align-items: flex-start; gap: 20px; }
  .mobile-contact { grid-template-columns: 1fr 1fr; gap: 8px; }
  .mobile-contact>a { padding: 10px 7px; gap: 8px; min-height: 62px; }
  .mobile-contact span { font-size: 16px; line-height: 1.2; }
  .mobile-contact small { font-size: 11px; line-height: 1.4; margin-top: 5px; }
  .mobile-contact b { font-size: 14px; }
  .mobile-contact svg { flex-shrink: 0; }
}
@media (max-width: 360px) {
  .hero h1, .hero h1 em { font-size: 34px; }
  .header { padding-left: 16px; padding-right: 16px; }
  .header-call { font-size: 13px; }
  .mobile-contact { padding-left: 8px; padding-right: 8px; gap: 6px; }
  .mobile-contact>a { gap: 5px; }
  .mobile-contact span { font-size: 15px; }
  .mobile-contact small { font-size: 11px; }
}