.kontakt-page {
  overflow: clip;
}

.kontakt-page .kontakt-hero {
  padding-block: clamp(4rem, 9vw, 7.5rem) var(--space-8);
  background: var(--color-ivory-white);
}

.kontakt-hero__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--space-5);
  row-gap: var(--space-6);
}

.kontakt-hero__grid > * { min-width: 0; }

.kontakt-breadcrumbs {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  align-items: center;
  font-size: var(--text-meta);
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.kontakt-breadcrumbs a { text-decoration: none; border-bottom: 1px solid transparent; }
.kontakt-breadcrumbs a:hover { border-bottom-color: var(--color-satin-bronze); }

.kontakt-hero__copy {
  grid-column: 1 / span 6;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.kontakt-hero__copy > * { min-width: 0; margin: 0; }
.kontakt-hero__copy .eyebrow { margin: 0; }
.kontakt-hero__copy h1 { max-width: 620px; }
.kontakt-hero__copy .intro { max-width: 620px; }

.kontakt-hero__note {
  grid-column: 10 / span 3;
  align-self: end;
  min-height: 10rem;
  padding-left: var(--space-5);
  border-left: var(--border-detail);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: var(--space-3);
}

.kontakt-hero__note > * { min-width: 0; margin: 0; }
.kontakt-hero__note .meta { font-size: .625rem; }
.kontakt-hero__note p:last-child { font-size: .875rem; line-height: 1.55; }

.kontakt-channels { padding-top: 0; }
.kontakt-channels__grid {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 3fr) minmax(0, 5fr);
  gap: var(--space-5);
}
.kontakt-channels__grid > * { min-width: 0; }

.kontakt-channel {
  position: relative;
  min-height: 300px;
  padding: var(--space-6);
  border: 1px solid var(--color-satin-bronze);
  border-radius: var(--radius-card);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space-6);
}
.kontakt-channel > * { min-width: 0; }
.kontakt-channel--email { background: var(--color-sky-blue); color: var(--color-deep-olive); }
.kontakt-channel--phone { background: var(--color-terracotta); color: var(--color-warm-white); }
.kontakt-channel--address { background: var(--color-olive-green); color: var(--color-warm-white); }
.kontakt-channel--phone :is(h3, p, a, .meta), .kontakt-channel--address :is(h3, p, a, .meta) { color: var(--color-warm-white); }
.kontakt-channel__icon { width: 3rem; height: 3rem; align-self: flex-end; color: var(--color-satin-bronze); transition: transform var(--transition-control); }
.kontakt-channel--phone .kontakt-channel__icon { color: var(--color-warm-white); }
.kontakt-channel:hover .kontakt-channel__icon { transform: translateX(4px); }
.kontakt-channel__content { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.kontakt-channel__content > * { min-width: 0; margin: 0; }
.kontakt-channel__content h3 { font-family: var(--font-body); font-size: clamp(1.35rem, 2.1vw, 1.85rem); font-weight: 700; line-height: 1.15; letter-spacing: -.025em; overflow-wrap: anywhere; }
.kontakt-channel__content h3 a { color: inherit; text-decoration: none; }
.kontakt-channel__content > p:not(.meta) { max-width: 300px; font-size: .875rem; line-height: 1.55; }
.kontakt-text-link { display: inline-flex; align-items: center; min-height: 2.75rem; width: fit-content; max-width: 100%; font-size: var(--text-button); font-weight: 700; letter-spacing: .02em; text-decoration: none; border-bottom: 1px solid currentColor; }
.kontakt-text-link:hover { border-bottom-color: var(--color-satin-bronze); }

.kontakt-scope__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 6fr);
  gap: var(--space-5);
  align-items: start;
}
.kontakt-scope__grid > * { min-width: 0; }
.kontakt-scope__intro { grid-column: 1 / span 1; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.kontakt-scope__intro > * { min-width: 0; margin: 0; }
.kontakt-scope__intro > p:not(.eyebrow) { max-width: 600px; }
.kontakt-scope__jump { margin-top: var(--space-2); }
.kontakt-scope__modules { grid-column: 3 / span 1; display: flex; flex-direction: column; gap: var(--space-6); }
.kontakt-scope__modules > * { min-width: 0; }
.kontakt-scope__module { padding-top: var(--space-5); border-top: var(--border-detail); display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.kontakt-scope__module > * { min-width: 0; margin: 0; }
.kontakt-scope__module > p:not(.meta) { max-width: 390px; }

.kontakt-form-section { background: var(--color-linen); padding-block: clamp(4rem, 8vw, 6rem); }
.kontakt-form-section__intro { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.kontakt-form-section__intro > * { min-width: 0; margin: 0; }
.kontakt-form { width: min(100%, 880px); margin: var(--space-7) auto 0; padding: var(--space-6); border: var(--border); border-radius: var(--radius-card); background: var(--color-warm-white); display: flex; flex-direction: column; gap: var(--space-5); }
.kontakt-form > * { min-width: 0; margin: 0; }
.kontakt-form__required { color: var(--color-deep-olive); font-size: var(--text-small); font-weight: 700; }
.kontakt-form__required span, .kontakt-form label > span[aria-hidden="true"] { color: var(--color-terracotta); }
.kontakt-form__primary-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.kontakt-form__primary-fields > * { min-width: 0; }
.kontakt-form__planning-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: var(--space-5); }
.kontakt-form__planning-fields > * { min-width: 0; }
.kontakt-form textarea { min-height: 150px; }
.kontakt-form__message-field { gap: 0; }
.kontakt-form__action { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.kontakt-form__action > * { min-width: 0; margin: 0; }
.kontakt-form__note { max-width: 520px; font-size: var(--text-small); line-height: var(--line-small); }
.kontakt-form__status { width: 100%; padding: var(--space-4); border: 1px solid color-mix(in srgb, var(--color-success) 70%, var(--color-olive-green)); background: var(--color-success); color: var(--color-deep-olive); }

.kontakt-location__intro { width: min(100%, 560px); display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.kontakt-location__intro > * { min-width: 0; margin: 0; }
.kontakt-map-wrap { position: relative; margin-top: var(--space-7); }
.kontakt-map { position: relative; width: 100%; min-height: 500px; overflow: hidden; border: var(--border); background: var(--color-ivory-white); }
.kontakt-map svg { width: 100%; height: 100%; min-height: 500px; object-fit: cover; }
.kontakt-map__pin { cursor: default; outline: none; }
.kontakt-map__pin:focus { outline: 3px solid #5c9bb0; outline-offset: 3px; }
.kontakt-map__tooltip { position: absolute; left: 51%; top: 39%; max-width: 270px; padding: var(--space-3); border: var(--border-detail); border-radius: var(--radius-control); background: var(--color-warm-white); color: var(--color-deep-olive); font-size: var(--text-small); font-weight: 700; line-height: 1.45; opacity: 0; pointer-events: none; transform: translate(18px, -100%); transition: opacity var(--transition-control); }
.kontakt-map:has(.kontakt-map__pin:focus) .kontakt-map__tooltip, .kontakt-map:hover .kontakt-map__tooltip { opacity: 1; }
.kontakt-location__card { position: absolute; z-index: 1; bottom: calc(var(--space-6) * -1); left: var(--space-6); width: min(34%, 420px); padding: var(--space-5); border: var(--border-detail); background: var(--color-warm-white); display: flex; flex-direction: column; gap: var(--space-3); }
.kontakt-location__card > * { min-width: 0; margin: 0; }
.kontakt-location__card address { color: var(--color-deep-olive); font-family: var(--font-heading); font-size: clamp(1.3rem, 2vw, 1.75rem); line-height: 1.18; }
.kontakt-map-legend { margin-top: calc(var(--space-7) + var(--space-5)); display: flex; flex-wrap: wrap; gap: var(--space-5); color: var(--color-deep-olive); font-size: var(--text-small); font-weight: 700; }
.kontakt-map-legend > * { min-width: 0; display: inline-flex; align-items: center; gap: var(--space-2); }
.kontakt-map-legend__swatch { width: .9rem; height: .9rem; flex: 0 0 .9rem; border: 1px solid var(--color-deep-olive); }
.kontakt-map-legend__swatch--street { background: var(--color-sky-blue); }
.kontakt-map-legend__swatch--park { background: var(--color-olive-green); }
.kontakt-map-legend__swatch--pin { border-radius: 50%; background: var(--color-terracotta); }

.kontakt-practical { background: var(--color-sky-blue); }
.kontakt-practical__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 1fr) minmax(0, 7fr); gap: var(--space-5); align-items: start; }
.kontakt-practical__grid > * { min-width: 0; }
.kontakt-practical__intro { grid-column: 1; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.kontakt-practical__intro > * { min-width: 0; margin: 0; }
.kontakt-practical__intro > p:not(.eyebrow) { max-width: 460px; }
.kontakt-practical__content { grid-column: 3; display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 4fr); gap: var(--space-5); }
.kontakt-practical__content > * { min-width: 0; }
.kontakt-hours { padding: var(--space-5); border: var(--border); background: var(--color-warm-white); display: flex; flex-direction: column; gap: var(--space-3); }
.kontakt-hours > * { min-width: 0; margin: 0; }
.kontakt-hours dl { display: flex; flex-direction: column; gap: var(--space-3); }
.kontakt-hours dl > div { display: flex; flex-direction: column; gap: var(--space-1); padding-bottom: var(--space-3); border-bottom: 1px solid var(--color-stone); }
.kontakt-hours dl > div:last-child { padding-bottom: 0; border-bottom: 0; }
.kontakt-hours dd { margin: 0; color: var(--color-deep-olive); }
.kontakt-practical__modules { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.kontakt-practical__modules > * { min-width: 0; }
.kontakt-practical__module { min-height: 0; padding: var(--space-4); border: var(--border); background: color-mix(in srgb, var(--color-warm-white) 78%, transparent); display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.kontakt-practical__module > * { min-width: 0; margin: 0; }
.kontakt-practical__module svg { width: 2rem; height: 2rem; color: var(--color-deep-olive); }
.kontakt-practical__module h3 { font-family: var(--font-body); font-size: 1rem; font-weight: 700; line-height: 1.25; }
.kontakt-practical__module p { font-size: .8125rem; line-height: 1.55; }

.kontakt-responsible { padding-block: var(--section-space); background: var(--color-olive-plaster); }
.kontakt-responsible__copy { width: min(100%, 650px); margin-inline: auto; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.kontakt-responsible__copy > * { min-width: 0; margin: 0; }
.kontakt-responsible__copy p:not(.eyebrow) { max-width: 650px; }

.kontakt-final { padding-block: clamp(4rem, 8vw, 6rem); }
.kontakt-final__copy { width: min(100%, 620px); margin-inline: auto; display: flex; flex-direction: column; align-items: center; gap: var(--space-4); text-align: center; }
.kontakt-final__copy > * { min-width: 0; margin: 0; }
.kontakt-final__copy > p:not(.eyebrow) { max-width: 620px; }
.kontakt-final__links { font-size: var(--text-small); line-height: var(--line-small); }

@media (max-width: 63.9375rem) {
  .kontakt-hero__copy { grid-column: 1 / span 8; }
  .kontakt-hero__note { grid-column: 1 / span 8; min-height: 0; padding: var(--space-5) 0 0; border-left: 0; border-top: var(--border-detail); }
  .kontakt-channels__grid { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .kontakt-channel--email { grid-column: 1 / span 4; }
  .kontakt-channel--phone { grid-column: 5 / span 4; }
  .kontakt-channel--address { grid-column: 1 / -1; }
  .kontakt-scope__grid { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .kontakt-scope__intro { grid-column: 1 / -1; }
  .kontakt-scope__modules { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
  .kontakt-scope__module { min-width: 0; }
  .kontakt-form { width: 100%; }
  .kontakt-location__card { position: static; width: 100%; margin-top: var(--space-5); }
  .kontakt-map-legend { margin-top: var(--space-5); }
  .kontakt-practical__grid { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .kontakt-practical__intro { grid-column: 1 / -1; }
  .kontakt-practical__content { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 56.1875rem) {
  .kontakt-hero__copy, .kontakt-hero__note { grid-column: 1 / -1; }
  .kontakt-form-section { padding-block: var(--space-8); }
  .kontakt-map { min-height: 400px; }
  .kontakt-map svg { min-height: 400px; }
}

@media (max-width: 44.9375rem) {
  .kontakt-page .kontakt-hero { padding-block: var(--space-8) var(--space-7); }
  .kontakt-hero__grid { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-5); }
  .kontakt-breadcrumbs, .kontakt-hero__copy, .kontakt-hero__note { grid-column: 1; }
  .kontakt-hero__copy { gap: var(--space-3); }
  .kontakt-hero__copy h1 { font-size: clamp(2.75rem, 12vw, 3.2rem); }
  .kontakt-hero__note { padding-top: var(--space-4); }
  .kontakt-channels__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .kontakt-channel--email, .kontakt-channel--phone, .kontakt-channel--address { grid-column: 1; min-height: 248px; padding: var(--space-5); }
  .kontakt-channel__content h3 { font-size: clamp(1.45rem, 7vw, 1.8rem); }
  .kontakt-scope__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .kontakt-scope__intro, .kontakt-scope__modules { grid-column: 1; }
  .kontakt-scope__modules { display: flex; gap: var(--space-5); }
  .kontakt-scope__module { padding-top: var(--space-4); }
  .kontakt-form-section { padding-block: var(--space-7); }
  .kontakt-form-section__intro { width: 100%; }
  .kontakt-form { margin-top: var(--space-6); padding: 1.25rem; gap: var(--space-4); }
  .kontakt-form__primary-fields, .kontakt-form__planning-fields { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .kontakt-location__intro { width: 100%; }
  .kontakt-map-wrap { margin-top: var(--space-6); }
  .kontakt-map, .kontakt-map svg { min-height: 300px; }
  .kontakt-map__tooltip { left: 48%; top: 43%; max-width: 220px; }
  .kontakt-map-legend { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
  .kontakt-practical__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .kontakt-practical__intro, .kontakt-practical__content { grid-column: 1; }
  .kontakt-practical__content { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .kontakt-practical__modules { grid-template-columns: minmax(0, 1fr); gap: 0; border-top: var(--border); }
  .kontakt-practical__module { min-height: 0; padding: var(--space-5) 0; border: 0; border-bottom: var(--border); background: transparent; }
  .kontakt-practical__module p { max-width: none; }
  .kontakt-responsible { padding-block: var(--space-7); }
  .kontakt-responsible__copy { width: 100%; gap: var(--space-3); }
  .kontakt-final { padding-block: var(--space-8); }
  .kontakt-final__copy { width: 100%; }
  .kontakt-final__copy h2 { font-size: clamp(2.25rem, 10vw, 2.65rem); }
}

@media (max-width: 24.375rem) {
  .kontakt-final__copy .button { width: 100%; }
}
