.main-nav > a {
  position: relative;
  isolation: isolate;
  transition: color 230ms ease, transform 230ms ease;
}
.main-nav > a::before {
  content: '';
  position: absolute;
  inset: 4px -9px;
  z-index: -1;
  background: #eaf2f8;
  border-radius: 7px;
  opacity: 0;
  transition: opacity 230ms ease;
  pointer-events: none;
}
.main-nav > a::after {
  content: '';
  position: absolute;
  bottom: 6px;
  left: 13%;
  width: 74%;
  height: 2px;
  background: var(--granat);
  border-radius: 99px;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 290ms cubic-bezier(.2, .8, .2, 1);
  pointer-events: none;
}
.main-nav > a.is-active::after,
.main-nav > a:focus-visible::after { transform: scaleX(1); }
.main-nav > a:focus-visible::before { opacity: 1; }

.phone-pill {
  position: relative;
  transition: background-color 250ms ease, box-shadow 250ms ease,
              transform 220ms cubic-bezier(.2, .7, .2, 1);
}
.phone-pill svg {
  transition: transform 250ms ease;
  transform-origin: 50% 50%;
}
.phone-pill:focus-visible {
  box-shadow: 0 0 0 4px rgba(15,84,148,.15);
}

.btn,
.filter-apply,
.view-switch button,
.pagination button,
.mobile-menu-button,
.clear-link,
.footer-map-link {
  transition: transform 200ms ease, background-color 240ms ease,
              border-color 240ms ease, color 240ms ease, box-shadow 240ms ease;
}
.mobile-menu-button svg { transition: transform 240ms ease; }

.main-nav > a:active,
.main-nav > a.is-clicked { transform: translateY(1px) scale(.975); }
.main-nav > a.is-clicked::before { opacity: 1; }
.main-nav > a.is-clicked::after { transform: scaleX(1); }

.phone-pill:active,
.phone-pill.is-clicked,
.btn:active,
.btn.is-clicked,
.filter-apply:active,
.filter-apply.is-clicked,
.view-switch button:active,
.view-switch button.is-clicked,
.pagination button:active:not(:disabled),
.pagination button.is-clicked,
.mobile-menu-button:active,
.mobile-menu-button.is-clicked {
  transform: translateY(1px) scale(.96);
}

.mobile-menu-button[aria-expanded='true'] {
  background: #e5eff6;
  border-color: #9dbbd0;
  box-shadow: 0 0 0 2px rgba(15,84,148,.06);
}
.mobile-menu-button[aria-expanded='true'] svg { transform: rotate(90deg); }

@media (hover: hover) and (pointer: fine) {
  .main-nav > a:hover { color: var(--granat-ciemny); transform: translateY(-1px); }
  .main-nav > a:hover::before { opacity: 1; }
  .main-nav > a:hover::after { transform: scaleX(1); }
  .phone-pill:hover {
    background: var(--granat-ciemny);
    transform: translateY(-2px);
    box-shadow: 0 7px 17px rgba(15,84,148,.24);
  }
  .phone-pill:hover svg { transform: translateX(2px) rotate(-9deg); }
  .btn:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,24,68,.18); }
  .btn--light:hover { background: #edf5fa; }
  .btn--outline:hover { background: rgba(255,255,255,.13); }
  .btn--solid:hover, .filter-apply:hover { background: var(--granat-ciemny); }
  .filter-apply:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(15,84,148,.18); }
  .view-switch button:hover,
  .pagination button:hover:not(:disabled),
  .mobile-menu-button:hover { background: #e7f0f6; border-color: #a3bfd3; transform: translateY(-1px); }
  .view-switch button[aria-pressed='true']:hover,
  .pagination button.is-current:hover { background: var(--granat-ciemny); color: #fff; }
  .clear-link:hover { color: var(--granat-gleboki); transform: translateY(-1px); }
  .footer-map-link:hover { transform: translateY(-1px); }
  .logo--header { transition: transform 250ms ease, filter 250ms ease; }
  .logo--header:hover { transform: translateY(-1px); filter: drop-shadow(0 2px 4px rgba(15,84,148,.12)); }
}

@media (max-width: 1120px) {
  .main-nav > a::before { inset: 3px 0; }
  .main-nav > a::after { width: 34px; left: 12px; bottom: 6px; transform-origin: left; }
  .main-nav > a:hover { transform: none; }
  .main-nav.is-mobile-open { animation: menu-mobilne-pojawienie 210ms ease-out both; }
}
@keyframes menu-mobilne-pojawienie {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .main-nav > a, .main-nav > a::before, .main-nav > a::after,
  .phone-pill, .phone-pill svg, .btn, .filter-apply,
  .view-switch button, .pagination button, .mobile-menu-button,
  .mobile-menu-button svg, .clear-link, .footer-map-link,
  .logo--header, .main-nav.is-mobile-open { transition: none !important; animation: none !important; }
  .main-nav > a:hover, .main-nav > a:active, .main-nav > a.is-clicked,
  .phone-pill:hover, .phone-pill:active, .phone-pill.is-clicked,
  .btn:hover, .btn:active, .btn.is-clicked, .filter-apply:hover,
  .filter-apply:active, .filter-apply.is-clicked,
  .mobile-menu-button[aria-expanded='true'] svg, .logo--header:hover {
    transform: none !important;
  }
}