/* Ergänzungen für schmale Geräte, sichere Abstände und große Schrift. */
@media (max-width: 820px) {
  body { min-width: 0; }
  .hero-visual > img { height: auto; }
  .hero-copy, .hero-visual, .calculator-copy, .calculator-card,
  .contact-copy, .contact-options, .contact-card > span:last-child,
  .area-region, .area-region-head > div { min-width: 0; }
  .contact-card strong { overflow-wrap: anywhere; }
  .menu-toggle, .header-read, .section-read, .footer-grid nav a,
  .footer-grid nav button { min-height: 44px; }
  .main-nav { scroll-padding-block: 12px; }
}
@media (min-width: 821px) and (max-width: 1240px) {
  .area-card { right: 0; }
}
@media (max-width: 620px) {
  body { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
  .mobile-contact { height: calc(70px + env(safe-area-inset-bottom, 0px));
    padding-bottom: calc(7px + env(safe-area-inset-bottom, 0px)); }
  .cookie-banner { bottom: calc(80px + env(safe-area-inset-bottom, 0px));
    max-height: min(50dvh, 360px); overflow-y: auto; overscroll-behavior: contain; }
  .person-card { max-width: 100%; gap: 10px; padding: 10px; }
  .hero-visual .person-icon { width: 72px !important; height: 72px;
    flex: 0 0 72px; aspect-ratio: 1; border-width: 4px; }
  .person-card > span:last-child { min-width: 0; }
  .person-card strong, .person-card small { overflow-wrap: anywhere; }
  .cookie-actions { grid-template-columns: minmax(0,1fr) minmax(0,1.5fr); }
  .cookie-actions button { padding: 8px 12px; }
}
@media (max-width: 820px) and (max-height: 500px) {
  .cookie-banner { max-height: 40dvh; overflow-y: auto; }
  .main-nav a { min-height: 48px; }
}