/* Gemeinsames Aussehen der öffentlichen Info-Seiten (Lenkspuren, Feldgrenzen, Koordinatenkonverter, AMA Fotos App).
   Farben und Schriften wie auf der Startseite. */
:root{
  --blue:#0A62F1; --blue-dk:#0849B4; --blue-lt:#E7F0FE; --yellow:#F8C527;
  --text:#111; --text-2:#555; --text-3:#888; --bg:#fff; --bg-2:#F7F7F7; --border:#E2E2E2;
  --streifen-blau:5px; --streifen-gelb:3px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:var(--bg-2);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;padding:0 16px 32px}
.seite{max-width:720px;margin:0 auto}
.kopf{padding:28px 0 0;text-align:center}
.kopf a.heim{display:inline-block}
.marke{height:36px;width:auto;max-width:100%}
.pfad{font-size:13px;color:var(--text-3);margin:14px 0 0}
.pfad a{color:var(--text-3)}
h1{font-size:23px;line-height:1.25;font-weight:700;margin:14px 0 10px;text-wrap:balance}
.lead{font-size:16px;color:var(--text-2);text-wrap:pretty}
.knopf{display:inline-block;margin-top:18px;padding:12px 22px;font-size:15px;font-weight:700;color:#fff;background:var(--blue);border-radius:9px;text-decoration:none}
.knopf:hover{background:var(--blue-dk)}
.knopf-neben{display:block;margin-top:8px;font-size:13px;color:var(--text-3)}
.karte{margin-top:28px;background:var(--bg);border:1px solid var(--border);border-radius:14px;box-shadow:0 1px 3px rgba(0,0,0,.08);overflow:hidden}
.streifen{height:calc(var(--streifen-blau) + var(--streifen-gelb));background:linear-gradient(to bottom,#0A62F1 0,#0A62F1 var(--streifen-blau),#F8C527 var(--streifen-blau),#F8C527 100%)}
.inhalt{padding:8px 22px 26px}
.inhalt h2{font-size:18px;font-weight:700;color:var(--blue-dk);margin:24px 0 8px;line-height:1.3}
.inhalt p,.inhalt li,.inhalt dd{font-size:15px;color:var(--text)}
.inhalt p+p{margin-top:10px}
.inhalt ol,.inhalt ul{padding-left:22px;margin-top:6px}
.inhalt li{margin:6px 0}
.inhalt dl{margin-top:6px}
.inhalt dt{font-weight:700;font-size:15px;margin-top:12px}
.inhalt dd{margin-left:0}
.inhalt a{color:var(--blue-dk)}
figure{margin:20px -22px 4px}
figure .bild{display:block;width:100%;height:auto}
figcaption{font-size:13px;color:var(--text-2);padding:10px 22px 0}
.legende{display:inline-block;width:18px;height:4px;border-radius:2px;vertical-align:middle;margin:0 4px 2px 0}
.tabelle{width:100%;border-collapse:collapse;margin-top:8px;font-size:14.5px}
.tabelle th,.tabelle td{text-align:left;padding:8px 10px 8px 0;border-bottom:1px solid var(--border);vertical-align:top}
.tabelle th{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--text-2)}
.hinweis{background:var(--blue-lt);border-radius:9px;padding:12px 14px;margin-top:14px;font-size:14.5px;color:var(--blue-dk)}
.faq{margin-top:10px}
.faq details{border-bottom:1px solid var(--border);padding:10px 0}
.faq summary{cursor:pointer;font-size:15px;font-weight:600;color:var(--blue-dk);list-style:none;display:flex;justify-content:space-between;gap:10px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-weight:400;color:var(--text-3)}
.faq details[open] summary::after{content:'–'}
.faq details p{margin-top:6px}
.weiter{margin-top:28px}
.weiter h2{font-size:15px;font-weight:700;margin-bottom:8px}
.weiter ul{list-style:none;display:grid;gap:10px}
.weiter a{display:block;background:var(--bg);border:1px solid var(--border);border-radius:11px;padding:12px 14px;text-decoration:none;color:var(--text)}
.weiter a strong{display:block;color:var(--blue-dk);font-size:15px}
.weiter a span{font-size:13.5px;color:var(--text-2)}
.weiter a:hover{border-color:var(--blue)}
.klein{font-size:12px;color:var(--text-3);margin-top:26px}
.fuss{margin-top:16px;font-size:12px;color:var(--text-3);text-align:center}
.fuss a{color:var(--text-3)}
a:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
@media(min-width:760px){
  .kopf{padding-top:40px}
  h1{font-size:30px}
  .lead{font-size:17px;max-width:620px;margin:0 auto}
  .inhalt{padding:10px 36px 32px}
  figure{margin-left:-36px;margin-right:-36px}
  figcaption{padding-left:36px;padding-right:36px}
  .weiter ul{grid-template-columns:1fr 1fr}
}
.knopf-neben a{color:var(--text-2)}
