/* Impressum und Datenschutzerklärung im ITM-Dokumentlayout (wie die Messprotokolle, siehe ui/itm/itm_layout.py):
   Lato, Schwarz auf Weiß, Logo oben rechts, feine graue Linien, keine Farben.
   Bewusst ohne app.css und ohne Farbschema: Diese Seiten sehen für alle gleich aus, auch im Dunkelmodus.
   Die Schrift kommt von diesem Server (Route /itm/fonts/), nichts wird bei Dritten abgerufen. */
@font-face{font-family:"Lato";font-style:normal;font-weight:400;font-display:swap;src:url(/itm/fonts/Lato-Regular.ttf) format("truetype")}
@font-face{font-family:"Lato";font-style:normal;font-weight:700;font-display:swap;src:url(/itm/fonts/Lato-Bold.ttf) format("truetype")}
:root{color-scheme:light}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:#000;font:400 16px/1.55 "Lato",sans-serif}
a{color:#000;text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;overflow-wrap:anywhere}
a:hover{text-decoration-thickness:2px}
a:focus-visible{outline:2px solid #000;outline-offset:2px}

/* Kopf: Wege links, Logo rechts (28,2 mm breit wie auf dem Briefbogen) */
.kopf{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:12.7mm 12.7mm 0}
.weg{display:flex;flex-wrap:wrap;gap:4px 20px;font-size:13px;padding-top:4px}
.logo{width:28.2mm;height:auto;flex:none;display:block;fill:#000}

.blatt{max-width:720px;margin:0 auto;padding:40px 24px 56px}
h1{font-size:30px;line-height:1.2;font-weight:700;margin:0 0 20px}
h2{font-size:20px;line-height:1.3;font-weight:700;margin:44px 0 10px;hyphens:manual}
h3{font-size:16px;line-height:1.35;font-weight:700;margin:28px 0 6px}
h4{font-size:16px;font-weight:700;margin:18px 0 4px}
p{margin:0 0 12px}
ul{margin:0 0 12px;padding-left:20px}
li{margin:0 0 6px}
.adr{margin:0 0 14px}
.vorspann{margin-bottom:8px}
/* Widerspruchsrecht: in der Vorlage in Großbuchstaben gesetzt, hier etwas kleiner, damit es lesbar bleibt */
.laut{font-size:13.5px;line-height:1.6;letter-spacing:.01em}
.stand{margin-top:40px;font-size:13px}

/* ITM-Tabellenstil: schwarzer Kopf mit weißer Schrift, feine hellgraue Linien zwischen den Zeilen, keine senkrechten */
.tabrahmen{overflow-x:auto;margin:4px 0 16px}
table{width:100%;border-collapse:collapse;font-size:14.5px}
th{background:#000;color:#fff;font-weight:700;text-align:left;padding:7px 10px}
td{padding:8px 10px;vertical-align:top;border-bottom:.3pt solid #ccc}
td:first-child{white-space:nowrap}


@media (max-width:640px){
  .kopf{padding:16px 16px 0}
  .logo{width:22mm}
  .blatt{padding:28px 16px 40px}
  h1{font-size:25px;overflow-wrap:anywhere}
  /* Tabelle als Blöcke: Name, darunter Zweck und Speicherdauer */
  table,tbody,tr,td{display:block}
  thead{display:none}
  tr{padding:10px 0;border-bottom:.3pt solid #ccc}
  tr:first-child{border-top:2px solid #000}
  td{padding:2px 0;border:0}
  td:first-child{white-space:normal;overflow-wrap:anywhere}
  td:last-child::before{content:"Speicherdauer: ";font-weight:700}
}
@media print{
  .weg{display:none}
  .blatt{max-width:none;padding:10mm 12.3mm}
  h2,h3,h4{break-after:avoid}
  a{text-decoration:none}
}
