@media (max-width: 767px) {
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  main,
  section,
  header,
  footer,
  aside,
  div {
    min-width: 0;
  }

  img,
  svg,
  canvas,
  video {
    max-width: 100%;
  }

  pre,
  code,
  .font-code-md {
    overflow-wrap: anywhere;
  }

  .text-headline-lg {
    font-size: 36px !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
  }

  .text-headline-md {
    font-size: 28px !important;
    line-height: 1.18 !important;
    letter-spacing: 0 !important;
  }

  .text-headline-sm {
    font-size: 22px !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
  }

  .font-headline-lg,
  .font-headline-md,
  .font-headline-sm {
    letter-spacing: 0 !important;
  }

  .px-8 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .px-6 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .py-32 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
  }

  .py-24 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
  }

  .py-20 {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }

  .gap-16 {
    gap: 2.5rem !important;
  }

  .gap-12 {
    gap: 2rem !important;
  }

  .mb-20 {
    margin-bottom: 3rem !important;
  }

  .mb-16 {
    margin-bottom: 2.5rem !important;
  }

  .flex.flex-wrap.gap-4 > a,
  .flex.flex-wrap.gap-4 > button,
  .flex.flex-col.sm\:flex-row > a,
  .flex.flex-col.sm\:flex-row > button {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  [class*="min-h-[716px]"] {
    min-height: auto !important;
  }

  [class*="w-[600px]"] {
    width: 260px !important;
    height: 260px !important;
  }

  [class*="text-[150px]"] {
    font-size: 76px !important;
  }

  [class*="text-[120px]"] {
    font-size: 72px !important;
  }

  [class*="tracking-[0.2em]"] {
    letter-spacing: 0.08em !important;
  }

  .mobile-nav-panel {
    display: none;
  }

  .mobile-nav-panel.is-open {
    display: flex;
  }

  .mobile-brand {
    max-width: calc(100vw - 128px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 16px !important;
  }

  .mobile-contact {
    display: none !important;
  }

  .dashboard-page aside {
    border-right: 0 !important;
    border-bottom: 1px solid #222222;
  }

  .dashboard-page aside nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .dashboard-page main {
    padding: 1rem !important;
  }

  .dashboard-page [class*="grid-cols-[1fr_auto]"] {
    grid-template-columns: 1fr !important;
  }

  .dashboard-page .text-right {
    text-align: left !important;
  }

  .dashboard-page .h-72 {
    height: 18rem !important;
  }

  .dashboard-page .absolute.top-5.right-5 {
    top: 0.75rem !important;
    right: 0.75rem !important;
    gap: 0.75rem !important;
  }

  .signin-page main {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 420px) {
  .text-headline-lg {
    font-size: 32px !important;
  }

  .text-headline-md {
    font-size: 26px !important;
  }

  .dashboard-page aside nav {
    grid-template-columns: 1fr;
  }

  .dashboard-page .h-72 {
    height: 16rem !important;
  }
}