/* SmartLife — Online · allgemein_mob.css
   Kompakte Ansicht unter 680px. Nach allgemein.css einbinden.
   Die Kopfleiste bringt ihre eigenen Breitenstufen in sl-base.css mit (M142). */

@media (max-width: 680px) {
  body { hyphens: auto; overflow-wrap: break-word; }
  /* Reduzierte Abstände */
  .hero { padding-top: 34px; padding-bottom: 26px; }
  .page-title { font-size: clamp(27px, 7.6vw, 38px); }
  .content-row { padding-top: 26px; }
  .art-col { gap: 44px; }
  .head-panel { max-width: none; }
  /* Blog */
  .page-title-lg { font-size: clamp(30px, 8.6vw, 42px); }
  .vs-panel { flex: 1 1 100%; }
  .cta-inner { padding-top: 52px; padding-bottom: 56px; }
  .table th:first-child, .section-body table th:first-child { width: 96px; }
  .table th, .table td, .section-body table th, .section-body table td { font-size: 13.5px; }
  /* Code-Blöcke kompakt */
  pre { padding: 14px 16px; font-size: 13px; }
}