.landing-panel[data-landing-variant="explore-map"] .landing-panel__photo--next {
  transition-duration: 2.6s;
  transition-timing-function: ease-in-out;
}

.landing-panel[data-landing-variant="explore-map"] .landing-panel__photo-grid {
  display: block;
  isolation: isolate;
  cursor: default;
}

.landing-panel[data-landing-variant="explore-map"] .landing-panel__photo-grid::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      rgba(0, 43, 57, 0.88) 0%,
      rgba(0, 64, 82, 0.63) 25%,
      rgba(0, 119, 151, 0.22) 57%,
      rgba(0, 70, 91, 0.38) 100%
    );
}

.landing-panel[data-landing-variant="explore-map"] .landing-panel__photo-tile {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}

@media (min-width: 961px) {
  .landing-panel__photo-grid {
    isolation: isolate;
  }

  .landing-panel__photo-grid::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
      linear-gradient(
        180deg,
        rgba(0, 43, 57, 0.88) 0%,
        rgba(0, 64, 82, 0.63) 25%,
        rgba(0, 119, 151, 0.22) 57%,
        rgba(0, 70, 91, 0.38) 100%
      );
  }

  .landing-panel__inner {
    top: 50%;
    z-index: 2;
    transform: translateY(-50%);
  }

  .landing-panel__head {
    display: none;
  }

  .landing-panel--test-variant .landing-panel__inner {
    top: 50%;
    transform: translate(-50%, -50%);
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__photo-grid,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__photo-grid {
    display: block;
    cursor: default;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__photo--next,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__photo--next {
    transition-duration: 2.6s;
    transition-timing-function: ease-in-out;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__photo-tile,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__photo-tile {
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__photo-grid::after,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__photo-grid::after {
    background:
      linear-gradient(
        180deg,
        rgba(0, 43, 57, 0.96) 0%,
        rgba(0, 64, 82, 0.76) 25%,
        rgba(0, 119, 151, 0.27) 57%,
        rgba(0, 70, 91, 0.46) 100%
      );
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__inner,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__inner {
    left: 50%;
    top: 50%;
    width: min(760px, calc(100vw - 64px));
    min-height: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transform: translate(-50%, -50%);
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__body,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__body {
    padding: 0;
    text-align: center;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__kicker,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__kicker {
    display: none;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__title,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__title {
    margin: 0;
    font-size: clamp(32px, 3.2vw, 42px);
    line-height: 1.08;
    text-align: center;
    text-wrap: balance;
    text-shadow: 0 2px 12px rgba(0, 32, 43, 0.35);
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__copy,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__copy {
    max-width: 42em;
    margin: 28px auto 0;
    font-size: clamp(14px, 1.35vw, 17px);
    line-height: 1.18;
    font-weight: 600;
    text-align: center;
    white-space: pre-line;
    color: rgba(255, 255, 255, 0.98);
    text-shadow: 0 2px 10px rgba(0, 32, 43, 0.4);
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__actions,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__actions {
    width: min(620px, 100%);
    margin: 68px auto 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(48px, 7vw, 82px);
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__action,
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__action {
    min-height: 46px;
    border: 2px solid rgba(255, 255, 255, 0.5);
    border-radius: 6px;
    padding: 11px 16px;
    font-size: 14px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
    box-shadow:
      0 3px 0 rgba(0, 38, 49, 0.28),
      0 9px 20px rgba(0, 24, 34, 0.2);
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__action[data-landing-action="explore"],
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__action[data-landing-action="explore"] {
    order: -1;
    background: #5fa862;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__action[data-landing-action="ask_question"],
  .landing-panel[data-landing-variant="simple-version"] .landing-panel__action[data-landing-action="ask_question"] {
    background: #34c0cb;
  }
}

@media (max-width: 700px) {
  .app-ui.is-landing-open.is-explore-map-landing .app-toolbar {
    display: none;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__inner {
    z-index: 2;
    inset: 0;
    width: auto;
    max-height: none;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transform: none;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__head {
    display: none;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__body {
    box-sizing: border-box;
    min-height: 100%;
    padding:
      max(17px, env(safe-area-inset-top))
      18px
      max(34px, env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
    color: #ffffff;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__kicker {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    margin: 0;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__kicker-logo {
    width: 48px;
    height: 48px;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__kicker-wordmark {
    width: min(178px, 54vw);
    margin-top: 0;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__title {
    margin: clamp(30px, 7.2dvh, 54px) -10px 0;
    font-size: clamp(25px, 7.35vw, 29px);
    line-height: 1.08;
    text-align: center;
    text-wrap: balance;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__copy {
    max-width: 31em;
    margin-top: 23px;
    font-size: clamp(14px, 4vw, 16px);
    line-height: 1.22;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.98);
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__actions {
    margin: auto 12px 30px;
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(20px, 4.2dvh, 30px);
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__action {
    min-height: clamp(54px, 7.7dvh, 60px);
    border: 3px solid rgba(255, 255, 255, 0.52);
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 17px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
    box-shadow:
      0 4px 0 rgba(0, 38, 49, 0.3),
      0 9px 18px rgba(0, 24, 34, 0.2);
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__action--explore {
    order: -1;
    background: #5fa862;
  }

  .landing-panel[data-landing-variant="explore-map"] .landing-panel__action--question {
    background: #34c0cb;
  }
}