/* ZimaTec: wider desktop layout with responsive proportions. */
@media (min-width: 1100px) {
  #root section[style*="max-width:1240px"],
  #root section[style*="max-width: 1240px"],
  #root footer[style*="max-width:1240px"],
  #root footer[style*="max-width: 1240px"] {
    max-width: 1920px !important;
    width: 100% !important;
    padding-left: 2vw !important;
    padding-right: 2vw !important;
  }
  #root section[style*="max-width:1140px"],
  #root section[style*="max-width: 1140px"],
  #root header > div[style*="max-width:1140px"],
  #root header > div[style*="max-width: 1140px"] {
    max-width: 1680px !important;
    width: 92% !important;
  }
}

/* Scale the visual hierarchy with the wider desktop canvas. */
@media (min-width: 1100px) {
  #root header nav { gap: clamp(24px, 2.2vw, 40px) !important; }
  #root header nav a { font-size: clamp(15px, 1.1vw, 18px) !important; }
  #root header > div > a:first-child svg { width: 160px !important; }
  #root #top section h2 { font-size: clamp(36px, 2.9vw, 50px) !important; line-height: 1.12 !important; }
  #root #top section h3 { font-size: clamp(21px, 1.55vw, 26px) !important; line-height: 1.25 !important; }
  #root #top section p { font-size: clamp(17px, 1.25vw, 20px) !important; line-height: 1.65 !important; }
  #root #top section .btn-amber, #root #top section .btn-outline { font-size: clamp(16px, 1.15vw, 19px) !important; }
  #root #top section[style*="104px"] { padding-top: clamp(64px, 5vw, 88px) !important; padding-bottom: clamp(64px, 5vw, 88px) !important; }
  #root #top section[style*="padding:0 32px 104px"],
  #root #top section[style*="padding: 0px 32px 104px"] { padding-top: 0 !important; }
  #root #top section:has(h1) > div {
    padding: clamp(48px, 4.5vw, 80px) !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) !important;
    gap: clamp(36px, 4vw, 72px) !important;
  }
  #root #top section h1 { font-size: clamp(58px, 4.7vw, 86px) !important; line-height: 1.04 !important; max-width: 13ch; text-wrap: initial !important; }
  #root #top section:has(h1) p { max-width: 54ch !important; font-size: clamp(19px, 1.45vw, 24px) !important; line-height: 1.6 !important; }
  #root #top section:has(h1) > div > div { gap: clamp(24px, 2vw, 34px) !important; }
  #root #top section:has(h1) img { height: clamp(470px, 37vw, 640px) !important; object-position: center; }
  #root #leistungen > div:first-child { max-width: 820px !important; margin-bottom: 36px !important; }
  #root #leistungen > div:nth-child(2) > div { padding: clamp(28px, 2.5vw, 42px) !important; }
  #root #ueber > div { padding: clamp(40px, 4.2vw, 72px) !important; gap: clamp(40px, 4vw, 72px) !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
  #root #ueber div[style*="aspect-ratio"] { aspect-ratio: 4 / 3 !important; }
  #root #ueber h2 { max-width: 21ch; text-wrap: initial !important; }
  #root #warum > div { grid-template-columns: 1fr !important; gap: 32px !important; }
  #root #warum > div > div:first-child { max-width: 880px; }
  #root #warum > div > div:last-child { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 3vw, 48px); }
  #root #warum > div > div:last-child > div { padding: 24px 0 0 !important; border-bottom: 0 !important; }
  #root #top section > div[style*="max-width:720px"] { max-width: 980px !important; }
  #root #top section > div[style*="max-width:720px"] p { font-size: clamp(26px, 2vw, 34px) !important; line-height: 1.45 !important; }
  #root #kontakt > div { padding: clamp(40px, 3.5vw, 64px) !important; gap: 40px !important; }
  #root footer p { font-size: 16px !important; line-height: 1.6 !important; }
}