/* Merksatz - Kontakt im neuen Look. Quelle: Entwurf 09/2026 */
[hidden] { display: none !important; }
.kgrid { display: grid; grid-template-columns: .95fr 1.05fr; gap: 56px; align-items: start; }
.ways { display: grid; gap: 14px; margin-top: 28px; }
.way { display: grid; grid-template-columns: 52px 1fr auto; gap: 16px; align-items: center; padding: 18px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); }
.way .ico { width: 52px; height: 52px; border-radius: 10px; background: var(--sun); color: var(--sun-ink); display: grid; place-items: center; }
.way .ico svg { width: 26px; height: 26px; }
.way .lab { font: 700 .74rem/1 "Nunito Sans", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.way .val { margin-top: 6px; font: 700 1.2rem/1.3 "Josefin Sans", sans-serif; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.way .val a { text-decoration: none; }
.way .val a:hover { text-decoration: underline; text-underline-offset: 4px; }
.way .btn { padding: 11px 16px; font-size: .95rem; white-space: nowrap; }
.before { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); }
.before p { color: var(--ink-2); }
.before ul { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 10px 0 0; padding: 0; font-weight: 700; }
.before a { text-underline-offset: 4px; }
.mapcard { position: relative; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--paper-2); aspect-ratio: 4 / 3.2; }
.mapcard svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.mapcard .road { fill: none; stroke: var(--card); stroke-linecap: round; }
.mapcard .park { fill: color-mix(in srgb, var(--f2) 22%, var(--paper-2)); }
.mapcard .block { fill: color-mix(in srgb, var(--ink) 7%, var(--paper-2)); }
.mapcard .pin { transition: opacity .3s ease; }
.consent { position: absolute; inset: 0; display: grid; place-items: center; padding: 20px; background: color-mix(in srgb, var(--paper) 72%, transparent); backdrop-filter: blur(2px); }
.consent .box { max-width: 360px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 22px; box-shadow: 0 16px 36px rgb(0 0 0 / .18); }
.consent h3 { font-size: 1.25rem; }
.consent p { margin-top: 8px; color: var(--ink-2); font-size: .95rem; }
.consent .btn { margin-top: 16px; }
.mapcard.loaded .consent { display: none; }
.mapnote { margin-top: 10px; font-size: .88rem; color: var(--ink-2); }
@media (max-width: 900px) { .kgrid { grid-template-columns: 1fr; gap: 36px; } }
@media (max-width: 520px) { .way { grid-template-columns: 52px 1fr; } .way .btn { grid-column: 1 / -1; } }
.mapcard iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }