/**
 * Karta / Google Maps Styles
 */

.smort-map {
  width: 100%;
  padding: var(--space-8, 3rem) 0;
}

.smort-contact-map-layout .smort-map__container,
.smort-contact-map-layout .smort-contact__container {
  width: 100%;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

.smort-map__container {
  --smort-map-height: 450px;
}

.smort-map__heading {
  margin: 0 0 1rem;
  font-size: var(--h2-lg-size);
  line-height: 1.15;
  font-weight: var(--font-weight-heading);
}

.smort-map__frame-wrap {
  position: relative;
  width: 100%;
  height: var(--smort-map-height);
  border: 1px solid var(--secondary, #1c1c1c);
  border-radius: var(--border-radius-smort, 0.25rem);
  overflow: hidden;
  background: var(--secondary, #1c1c1c);
}

.smort-map__frame {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  filter: grayscale(1) contrast(1.08) brightness(0.78);
  transition: filter 0.3s ease;
}

.smort-map__frame-wrap:hover .smort-map__frame,
.smort-map__frame-wrap:focus-within .smort-map__frame {
  filter: grayscale(1) contrast(1.04) brightness(0.92);
}

.smort-map__notice {
  margin: 0;
  padding: 1rem;
  border: 1px solid #ddd;
  border-radius: 0.5rem;
  background: #f7f7f7;
}

@media (max-width: 767px) {
  .smort-map__frame-wrap {
    height: clamp(280px, 55vw, 420px);
  }
}