/* Mobile reading rhythm. Desktop rules and application behaviour stay intact. */
@media (max-width: 768px) {
  :root { --space: 64px; }
  body { font-size: 19px; line-height: 1.65; }
  main, .df-pages, .df-near, .rg-artikel, .legal-content { font-size: 19px; line-height: 1.65; }
  main :is(p, li, dt, dd, td, th, summary), .fuss p {
    font-size: 19px !important;
    line-height: 1.65;
  }
  main :is(p, li, dd), .fuss p { overflow-wrap: break-word; }
  main p { margin-bottom: 24px; }
  main p:last-child { margin-bottom: 0; }
  main h2 { line-height: 1.25; margin-bottom: 24px; }
  main h3 { line-height: 1.35; margin-bottom: 16px; }
  main :is(.karte, .df-card, .abl-text, .rg-karte-text) :is(h2, h3) { font-size: 23px; line-height: 1.35; }

  /* One section scale, with smaller gaps for related items inside a section. */
  .sec, .df-pages .df-section, .df-pages > .sec, .df-near .near-section,
  .df-location, .details-section { padding-block: 64px; }
  .hero .wrap { padding-top: 48px; gap: 40px; }
  .hero-form { padding-bottom: 48px; }
  .hero .frage { margin-top: 32px; margin-bottom: 16px; }
  .hero .lead { margin-bottom: 24px; }
  .hero .checks { margin-top: 28px; }
  .vertrauen { flex-wrap: wrap; gap: 16px; margin-top: 32px; }
  .vertrauen p { flex: 1 1 220px; min-width: 0; margin: 0; }
  .checks li { padding-block: 16px; }
  .checks li::before { top: 25px; }
  .kopfzeile, .df-pages .df-section-head, .near-heading { margin-bottom: 36px; }
  .kopfzeile h2, .df-pages .df-section-head h2 { margin-bottom: 20px; }
  .zwei, .zwei.vsec, .df-pages .df-split, .df-pages .df-founder,
  .df-pages .df-gallery-intro, .df-pages .df-reading-grid,
  .near-process-grid, .near-advice-grid, .near-faq-grid { gap: 36px; }
  .aktion { margin-top: 32px; gap: 16px; }

  /* Give the larger text a full-width card instead of two narrow columns. */
  .raster, .raster.r2, .df-pages .df-gallery-grid, .df-pages .df-grid-3,
  .df-pages .df-grid-4, .df-pages .df-offer-details .df-grid-4,
  .df-pages .df-contact-grid, .rg-karten, .near-service-grid,
  .near-region-grid, .solution-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .karte .kt, .df-pages .df-gallery-grid .kt, .df-pages .df-card,
  .df-pages .df-offer-details .df-card, .rg-hub .rg-karte-text,
  .near-service, .near-region { padding: 28px 24px; }
  .karte h3, .df-pages .df-gallery-grid h3, .df-pages .df-card h3 { margin-bottom: 16px; }
  .karte p, .df-pages .df-gallery-grid p, .df-pages .df-card p { line-height: 1.65; }
  .schritte { padding: 8px 24px; }
  .schritt { padding-block: 28px; gap: 16px; }
  .ablauf { row-gap: 32px; }
  .ablauf-compact .ablauf > li { padding-block: 32px; }
  .ablauf-compact .abl-text h3 { margin-bottom: 16px; }
  .ablauf-compact .abl-text p { line-height: 1.65; }
  .punkte li { padding-block: 12px; }

  .df-pages .df-page-intro { padding-block: 48px; }
  .df-pages .df-form-hero, .near-hero-grid { gap: 28px; }
  .df-pages .df-form-hero > .df-form-column, .near-hero-grid > .hero-form { margin-top: 12px; }
  .df-pages .df-contact-card { padding: 24px; gap: 10px; }
  .df-pages .df-contact-card strong { font-size: 21px; }
  .df-pages .df-contact-card > span:not(.df-contact-tag):not(.df-contact-arrow) { font-size: 19px; }
  .df-pages .df-facts { gap: 0; }
  .df-pages .df-facts li { grid-template-columns: 1fr; gap: 8px; padding-block: 22px; }
  .df-pages .df-facts strong { font-size: 23px; }
  .df-pages .df-facts span { font-size: 19px; line-height: 1.55; }
  .df-pages .df-hours > div { flex-wrap: wrap; gap: 8px 20px; padding-block: 18px; }
  .df-pages .df-hours dd { text-align: left; }
  .df-pages .df-final, .near-final { padding: 32px 24px; gap: 28px; }
  .df-pages .df-final-section, .near-final-section { padding-top: 24px; }

  .local-editorial .local-upper, .local-editorial .local-area,
  .local-editorial .local-contact { padding: 36px 24px; }
  .city-local .local-copy p, .city-local .local-note { line-height: 1.7; margin-bottom: 24px; }
  .city-local .local-assurances { margin-bottom: 32px; }
  .city-local .local-assurances li { flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px 16px; }
  .city-local .local-assurances .local-benefit-label { max-width: none; }
  .city-local .local-contact .aktion { gap: 16px; margin-top: 28px; }
  .city-local .local-contact .aktion a { padding-block: 16px; font-size: 19px; line-height: 1.45; }
  .near-checklist { padding: 28px 24px; }
  .near-checklist li { padding-block: 22px; gap: 10px; }

  .faq details { margin-bottom: 16px; }
  .df-pages .df-faq, .near-faq { gap: 16px; }
  .faq summary, .df-pages .df-detail summary, .near-faq summary { padding: 24px; line-height: 1.5; }
  .faq-a, .df-pages .df-detail-body, .df-near .near-faq details p { padding: 0 24px 24px; }
  .df-pages .df-detail[open] .df-detail-body, .df-near .near-faq details p { padding-top: 24px; }
  .df-pages .df-card-detail summary { padding: 20px 0 0; }
  .df-pages .df-card-detail .df-detail-body { padding: 20px 0 0; }
  .rg-teil { margin-top: 48px; padding-top: 12px; }
  .rg-artikel p { margin-bottom: 24px; }
  .rg-artikel h2 { margin-bottom: 24px; }
  .rg-artikel li + li { margin-top: 12px; }
  .rg-hub .rg-hub-kopf { margin-block: 28px 40px; }
  .legal-content section { margin-block: 48px; }
  .legal-content p, .legal-content li { line-height: 1.7; }

  /* Readable form controls, including when the same form opens in a dialog. */
  body .dfi { font-size: 19px; line-height: 1.6; }
  body .dfi :is(.qt, .qhint, .hint, .lexpl, label, .choice, .chip, .btn,
    input[type="text"], input[type="email"], input[type="tel"], select, textarea,
    .consent, .upload, .dfi-err) { font-size: 19px !important; line-height: 1.5; }
  body .dfi .qt { font-size: 22px !important; }
  body .dfi .ctitle { font-size: 23px; line-height: 1.35; }
  body .dfi .chead { padding: 28px 20px 24px; }
  body .dfi .app { padding: 28px 20px; }
  body .dfi .app > * + * { margin-top: 24px; }
  body .dfi .objgrid, body .dfi .objgrid:has(.ci) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  body .dfi .choice, body .dfi .choice:has(.ci) { padding: 16px 10px; min-height: 76px; overflow-wrap: break-word; }
  body .dfi .two { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  body .dfi .meter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  body .dfi .meter-grid .chip { min-height: 52px; padding: 12px 8px; }
  body .dfi .nav { margin-top: 28px; gap: 12px; }
  body .dfi .btn { min-height: 56px; }
  .rechner label, .rechner input, .rechner select, .form-anruf { font-size: 19px; line-height: 1.5; }
  .rechner .df-form-grid { gap: 24px; }

  /* Small labels retain their hierarchy; reading copy is consistently 19px. */
  main :is(.kicker, .marke, .near-eyebrow, .df-eyebrow, .df-location-eyebrow,
    .local-region-label), body .dfi :is(.badge, .steplabel, .dfi-swiss, .cta-note, .dfi-reassure) {
    font-size: 16px !important; line-height: 1.5;
  }
  .df-pages figcaption, .rg-bild figcaption, .df-location .df-location-legend { font-size: 16px !important; line-height: 1.5; }
  .menu, .menu .sub a { font-size: 19px; line-height: 1.5; }
  #menu-t:checked ~ .menu { max-height: calc(100dvh - 68px); overflow-y: auto; }
  .df-breadcrumb { font-size: 16px; }
  .df-breadcrumb ol { padding-block: 16px; row-gap: 8px; }
  .df-location .df-location-heading { margin-bottom: 28px; }
  .df-location .df-location-home { margin-top: 24px; font-size: 19px; }
  .fuss { padding-block: 64px 36px; font-size: 19px; line-height: 1.65; }
  .fuss .wrap { gap: 36px; }
  .fuss h4 { font-size: 16px; margin-bottom: 18px; }
  .fuss p { margin-bottom: 14px; }
  .fuss .recht { font-size: 17px; gap: 16px 24px; padding-top: 28px; }
}

/* Owner preference: mobile headings and paragraphs align left. */
@media (max-width: 768px) {
  body :is(h1, h2, h3, h4, h5, h6, p),
  body .dfi :is(.chead, .ctitle, .qt, .qhint, .hint, .lexpl) {
    text-align: left !important;
  }
  body .dfi .ctitle { align-items: flex-start; }
  body .dfi .dfi-swiss { justify-content: flex-start; }
}

/* Restore navigation type and give mobile cards more horizontal room. */
@media (max-width: 768px) {
  body .df-breadcrumb, body .df-breadcrumb :is(ol, li, a, span) {
    font-size: 13px !important;
    line-height: 1.5;
  }
  main .wrap, main .city-local .wrap { padding-inline: 12px; }
  .business-hero-photo ~ .wrap, .problem-solution .wrap {
    width: calc(100% - 24px);
    padding-inline: 0;
  }
  .local-editorial .local-upper, .local-editorial .local-area,
  .local-editorial .local-contact { padding-inline: 16px; }
  .karte .kt, .df-pages .df-gallery-grid .kt, .df-pages .df-card,
  .df-pages .df-offer-details .df-card, .df-pages .df-contact-card,
  .rg-hub .rg-karte-text, .near-service, .near-region, .solution-card {
    padding-inline: 20px;
  }
}
