/* Reduced cartographic hero: static local SVG and regular document scrolling. */
.home-calm { position: relative; isolation: isolate; overflow: clip; background: var(--fc-white); color: var(--fc-black); padding: clamp(100px, 10vw, 152px) var(--fc-edge) 96px; min-height: min(820px, calc(100svh - var(--fc-header-h))); }
.home-calm__map { position: absolute; z-index: -1; inset: 0; pointer-events: none; overflow: hidden; }
.home-calm__map img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.home-calm__map::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,var(--fc-white) 18%,rgba(255,255,255,.98) 37%,rgba(255,255,255,.86) 47%,rgba(255,255,255,0) 67%); }
.home-calm__content { position: relative; width: 54%; max-width: 840px; }
.home-calm__content .fc-kicker { color: var(--fc-green-800); margin: 0 0 24px; }
.home-calm__content h1 { margin: 0; font-weight: 500; letter-spacing: -.018em; color: var(--fc-black); }
.home-calm__content h1 span { display: block; color: var(--fc-green-800); }
.home-calm__lead { max-width: 555px; margin: 28px 0 30px; color: var(--fc-gray-dark); }
.home-calm__content .fc-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.home-calm__scope { display: flex; gap: 18px; margin: 34px 0 0; text-transform: uppercase; letter-spacing: .12em; color: var(--fc-gray-dark); }
.home-calm__scope span { color: var(--fc-green-800); }
.home-calm__case { position: absolute; right: 6%; top: 49%; width: 250px; padding: 24px; background: var(--fc-white); border: 1px solid var(--fc-line); border-radius: 16px; box-shadow: 0 10px 32px rgba(25,27,25,.06); }
.home-calm__case > p { margin: 0 0 12px; color: var(--fc-green-800); text-transform: uppercase; letter-spacing: .07em; font-weight: 500; }
.home-calm__case > p span { color: var(--fc-muted); }
.home-calm__case h2 { margin: 0; color: var(--fc-black); font-weight: 500; }
.home-calm__case dl { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding-top: 16px; margin: 16px 0 0; border-top: 1px solid var(--fc-line); }
.home-calm__case dt { color: var(--fc-muted); }
.home-calm__case dd { color: var(--fc-gray-dark); margin: 6px 0 0; white-space: nowrap; }
@media (max-width: 991px) {
 .home-calm { padding-top: calc(var(--fc-header-h) + 48px); padding-bottom: 390px; min-height: 0; }
 .home-calm__content { width: 100%; max-width: 670px; }
 .home-calm__map { top: auto; height: 490px; }
 .home-calm__map img { width: 1100px; max-width: none; position: absolute; right: -15%; object-fit: contain; object-position: right bottom; }
 .home-calm__map::after { background: linear-gradient(180deg,var(--fc-white),rgba(255,255,255,0) 40%); }
 .home-calm__case { top: auto; bottom: 65px; right: 12%; }
}
@media (max-width: 767px) {
 .home-calm { padding-top: calc(var(--fc-header-h) + 36px); padding-bottom: 320px; }
 .home-calm__content .fc-kicker { margin-bottom: 16px; }
 .home-calm__lead { margin: 22px 0 24px; }
 .home-calm__content .fc-actions { gap: 10px; }
 .home-calm__content .fc-button { padding: 12px 18px; }
 .home-calm__scope { margin-top: 24px; }
 .home-calm__map { height: 370px; }
 .home-calm__map img { width: 820px; height: auto; right: -5%; bottom: -45px; }
 .home-calm__case { width: 220px; padding: 20px; right: var(--fc-edge); bottom: 44px; }
}

/* One local map scene, then a still Fairly mark. Content remains fully visible. */
.home-calm__camera { position: absolute; inset: 0; transform-origin: 0 0; }
.home-calm__map::after { z-index: 1; }
.home-calm__event { position: absolute; z-index: 2; left: 71.33%; top: 29.2%; width: 0; height: 0; }
.home-calm__pin { position: absolute; left: -6px; top: -6px; width: 12px; height: 12px; border: 3px solid var(--fc-white); border-radius: 50%; background: var(--fc-green-800); box-shadow: 0 0 0 1px var(--fc-green-800); }
.home-calm__pulse { position: absolute; left: -15px; top: -15px; width: 30px; height: 30px; border: 1px solid var(--fc-green-800); background: rgba(26,81,63,.1); border-radius: 50%; opacity: 0; }
.home-calm__label { position: absolute; left: 0; bottom: 24px; transform: translateX(-50%); }
.home-calm__notice { position: absolute; bottom: 0; left: 50%; translate: -50% 0; opacity: 0; white-space: nowrap; background: var(--fc-white); padding: 12px 18px; border: 1px solid var(--fc-line); border-radius: 8px; color: var(--fc-green-800); box-shadow: 0 6px 22px rgba(25,27,25,.06); }
.home-calm__brand { background: rgba(255,255,255,.96); padding: 15px 20px; border: 1px solid var(--fc-line); border-radius: 8px; box-shadow: 0 6px 22px rgba(25,27,25,.06); }
.home-calm__brand img { position: static; display: block; width: 169px; height: 40px; max-width: none; object-fit: contain; }
@media (max-width: 767px) {
 .home-calm__brand img { width: 144px; height: auto; }
 .home-calm__brand { padding: 14px 18px; }
}

.js .home-calm:not(.map-scene-ready) .home-calm__event { visibility: hidden; }


/* Street-level camera rendered with Remotion / MapLibre. */
.home-calm__film { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 76% 48%; opacity: 0; }
.home-calm.has-map-film .home-calm__film { opacity: 1; }
.home-calm__camera { transform: none; }
.home-calm__event { left: 76%; top: 48%; visibility: hidden; }
.home-calm.map-scene-ready .home-calm__event { visibility: visible; }
.home-calm__pin { left: -7px; top: -7px; width: 14px; height: 14px; box-shadow: 0 0 0 1px var(--fc-green-800),0 3px 9px rgba(25,27,25,.08); }
.home-calm__label { width: 286px; bottom: 28px; }
.home-calm__notice { position: relative; bottom: auto; left: auto; translate: none; width: 286px; white-space: normal; padding: 22px 24px; background: rgba(255,255,255,.98); border-radius: 12px; box-shadow: 0 10px 40px rgba(25,27,25,.08); }
.home-calm__location { display: block; text-transform: uppercase; letter-spacing: .1em; color: var(--fc-muted); margin-bottom: 8px; }
.home-calm__notice strong { display: block; color: var(--fc-black); font-family: var(--fc-font-display); font-weight: 500; }
.home-calm__status { height: 0; opacity: 0; overflow: hidden; display: flex; align-items: center; gap: 9px; color: var(--fc-green-800); }
.home-calm__status svg { flex: none; }
.home-calm__brand { position: absolute; left: 0; top: 0; bottom: auto; translate: -50% -50%; opacity: 0; padding: 0; background: none; border: 0; border-radius: 0; box-shadow: none; transform-origin: center; }
.home-calm__brand img { width: 100%; height: auto; }
.home-calm__play { position: absolute; bottom: 38px; right: var(--fc-edge); display: inline-flex; align-items: center; gap: 8px; padding: 6px 0; border: 0; background: none; color: var(--fc-gray-dark); font-family: var(--fc-font); cursor: pointer; }
.home-calm__play[hidden] { display: none; }
.home-calm__play:hover { color: var(--fc-green-800); }
.home-calm__play:focus-visible { outline: 2px solid var(--fc-green-800); outline-offset: 5px; }
.home-calm__play-icon { width: 9px; height: 10px; border-left: 2px solid currentColor; border-right: 2px solid currentColor; }
.home-calm__play[data-state="paused"] .home-calm__play-icon,.home-calm__play[data-state="replay"] .home-calm__play-icon { border: 0; width: 10px; height: 10px; background: currentColor; clip-path: polygon(0 0,100% 50%,0 100%); }
.home-calm__credit { position: absolute; bottom: 16px; right: var(--fc-edge); color: var(--fc-muted); margin: 0; }
.home-calm__credit a { color: inherit; text-decoration: none; }
.home-calm__credit a:hover { text-decoration: underline; }
@media (max-width: 991px) { .home-calm__event { left: 52%; top: 77%; } .home-calm__film { object-position: 52% 77%; } }
@media (max-width: 767px) {
 .home-calm__label,.home-calm__notice { width: 260px; }
 .home-calm__notice { padding: 18px 20px; }
 .home-calm__brand { top: -32px; padding: 0; }
 .home-calm__brand img { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .home-calm__film { display: none; } .home-calm__play { display: none; } }

/* Poster and film use identical crops, including the mobile map anchor. */
.home-calm__camera picture { display: block; width: 100%; height: 100%; }
.home-calm__camera img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 76% 48%; }
@media (max-width: 991px) { .home-calm__camera img { object-position: 52% 77%; } }

/* Ruhige Zweispalten-Komposition, vertikal im ersten Bildschirm ausbalanciert. */
.home-calm { display: flex; align-items: center; }
.home-calm__content { width: 56%; max-width: 980px; }
.home-calm__lead { max-width: 610px; }
@media (max-width: 991px) { .home-calm { display: block; } .home-calm__content { width: 100%; } }
