html {
  overflow-x: hidden;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  min-width: 320px;
  overflow-x: hidden;
}

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

img {
  height: auto;
}

a,
button,
input,
select,
textarea {
  min-width: 0;
}

p,
h1,
h2,
h3,
h4,
h5,
h6,
span,
a,
li {
  overflow-wrap: anywhere;
}

.px-margin-desktop {
  padding-left: clamp(1.25rem, 5vw, 4rem) !important;
  padding-right: clamp(1.25rem, 5vw, 4rem) !important;
}

.max-w-container-max {
  width: min(100%, 1280px);
}

.text-display-lg,
.text-display-lg-mobile {
  font-size: clamp(2.5rem, 8vw, 4.5rem) !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

.text-headline-lg {
  font-size: clamp(2rem, 5vw, 2.5rem) !important;
  line-height: 1.18 !important;
}

.text-headline-md {
  font-size: clamp(1.5rem, 4vw, 2rem) !important;
  line-height: 1.24 !important;
}

.text-body-lg {
  font-size: clamp(1rem, 2.2vw, 1.25rem) !important;
  line-height: 1.6 !important;
}

.font-label-caps {
  letter-spacing: 0.08em;
}

.grid {
  min-width: 0;
}

.grid > * {
  min-width: 0;
}

.aspect-square,
.aspect-video,
div[class*="aspect-"] {
  max-width: 100%;
}

.matte-card,
article,
section,
footer {
  min-width: 0;
}

input,
select,
textarea {
  max-width: 100%;
}

@media (max-width: 767px) {
  .reveal-hidden,
  .scale-hidden {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  nav .h-20 {
    height: 4.5rem;
  }

  main {
    padding-top: 4.5rem !important;
  }

  section {
    padding-top: clamp(3rem, 12vw, 5rem) !important;
    padding-bottom: clamp(3rem, 12vw, 5rem) !important;
  }

  .min-h-\[90vh\] {
    min-height: auto !important;
  }

  .px-10 {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
  }

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

  .gap-gutter {
    gap: 1.25rem !important;
  }

  .space-x-8 > :not([hidden]) ~ :not([hidden]) {
    margin-left: 0 !important;
  }

  .w-\[45\%\],
  .w-\[55\%\],
  .w-1\/2,
  .w-1\/3 {
    width: 100% !important;
  }

  .pr-20,
  .pl-20 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .absolute.left-1\/2,
  .absolute.-left-\[12px\],
  .absolute.-left-\[24px\] {
    display: none !important;
  }

  .flex.items-center.justify-between {
    align-items: flex-start;
  }

  .rounded-2xl {
    border-radius: 0.5rem !important;
  }

  .text-\[10px\] {
    font-size: 0.7rem !important;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .px-margin-desktop {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
  }

  .md\:grid-cols-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1536px) {
  body {
    background: #f8f9fa;
  }

  .max-w-container-max {
    width: min(100%, 1360px);
  }
}