* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
img { max-width: 100%; }
section, footer, #alicja { scroll-margin-top: 24px; }
a:focus-visible { outline: 2px solid white; outline-offset: 6px; }
a:active { opacity: .75; }
.skip-link { position: fixed; left: 20px; top: -100px; z-index: 10; background: white; color: black; padding: 12px 18px; }
.skip-link:focus { top: 20px; }
.dev-card { padding: 32px; border: 1px solid #303030; transition: border-color .25s; }
.dev-card:hover { border-color: #aaa; }
@media (max-width: 600px) {
  nav > div { gap: 16px 20px !important; font-size: 12px !important; letter-spacing: 1.5px !important; }
  header { min-height: auto !important; }
  header > div:last-child { padding-top: 70px !important; padding-bottom: 70px !important; gap: 32px !important; }
  h1 { font-size: clamp(44px, 10vw, 64px) !important; }
  h1 img { max-width: 68%; height: auto !important; }
  h2 { font-size: 38px !important; }
  section, footer { padding: 56px 24px !important; }
  .dev-card { padding: 24px; }
  .dev-card h3 { font-size: 28px !important; }
  footer a[href^="mailto:"] { font-size: 28px !important; overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}