/* MAI Fußbodenheizung – Basis: nur was inline nicht möglich ist.
   Schriften lokal ausgeliefert, kein Google-Fonts-Abruf. */

/* Schriftdateien: Plus Jakarta Sans (Weights 400/500/600/700/800) als WOFF2 in
   assets/fonts/ ablegen, dann diesen Block einkommentieren. Bis dahin greift der
   System-Fallback aus --font. Kein Abruf von Google Fonts – bewusst so.

@font-face { font-family:"Plus Jakarta Sans"; src:url("fonts/PlusJakartaSans-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Plus Jakarta Sans"; src:url("fonts/PlusJakartaSans-Medium.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:"Plus Jakarta Sans"; src:url("fonts/PlusJakartaSans-SemiBold.woff2") format("woff2"); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:"Plus Jakarta Sans"; src:url("fonts/PlusJakartaSans-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"Plus Jakarta Sans"; src:url("fonts/PlusJakartaSans-ExtraBold.woff2") format("woff2"); font-weight:800; font-style:normal; font-display:swap; }
*/

:root {
  --navy: #304161;
  --navy-dark: #24314A;
  --red: #B02C31;
  --red-dark: #8E2227;
  --gray: #5A6472;
  --gray-light: #F4F6F8;
  --line: #E2E6EC;
  --white: #FFFFFF;
  --font: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.7;
  color: var(--navy);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}
h1, h2, h3, h4 { margin: 0; letter-spacing: -0.022em; line-height: 1.12; font-weight: 800; }
p, figure, blockquote { margin: 0; }
ul, ol { margin: 0; padding: 0; }
li { list-style: none; }
img { display: block; max-width: 100%; }
a { color: var(--red); text-decoration: none; }
a:hover { color: var(--red-dark); }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; border-radius: 4px; }
summary::-webkit-details-marker { display: none; }
summary { list-style: none; cursor: pointer; }

@keyframes rohr-zeichnen { from { stroke-dashoffset: var(--len, 2000); } to { stroke-dashoffset: 0; } }
@keyframes laufband { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes einblenden { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}

@media print {
  body { font-size: 11pt; }
}