.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

main#root {
  display: block;
  position: relative;
  z-index: 2;
}

body {
  color: #171717;
  font-family: "Barlow", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
}

.home-page main#root > div.min-h-screen.bg-background {
  background-color: transparent;
}

/* Keep condensed type for display headings and use Barlow for small UI copy. */
nav .font-heading,
a.font-heading,
button.font-heading,
label.font-heading,
p.font-heading,
span.font-heading {
  font-family: "Barlow", Arial, sans-serif;
  font-weight: 600;
}

[class*="tracking-"] {
  letter-spacing: 0;
}

.bg-background,
.bg-white,
.bg-\[\#f5f0e8\],
.bg-\[\#f6f1e9\] {
  color: #171717;
}

.bg-background .text-muted-foreground,
.bg-white .text-muted-foreground,
.bg-\[\#f5f0e8\] .text-muted-foreground,
.bg-\[\#f6f1e9\] .text-muted-foreground {
  color: #555;
}

.text-white\/50 {
  color: rgb(255 255 255 / 72%);
}

.text-white\/25,
.text-white\/40 {
  color: rgb(255 255 255 / 76%);
}

.text-white\/55 {
  color: rgb(255 255 255 / 78%);
}

.text-white\/60 {
  color: rgb(255 255 255 / 80%);
}

.text-white\/70 {
  color: rgb(255 255 255 / 88%);
}

.text-white\/80 {
  color: rgb(255 255 255 / 94%);
}

.text-\[9px\],
.text-\[10px\],
.text-\[11px\] {
  font-size: 12px;
}

.text-xs {
  font-size: 13px;
}

.animate-marquee {
  color: rgb(255 255 255 / 76%);
  font-size: 12px;
}

header nav a,
header [data-testid^="nav-link"],
header [data-testid="nav-cta"] {
  color: rgb(255 255 255 / 90%);
  font-size: 13px;
}

main#root > div > section:first-of-type p {
  color: rgb(255 255 255 / 90%);
  font-size: 16px;
  line-height: 1.65;
}

main#root > div > section.h-\[72svh\],
main#root > div > section.h-\[72svh\] > .absolute.inset-0.z-0 {
  background-color: transparent !important;
  background: transparent;
}

.bg-background .text-primary,
.bg-white .text-primary,
.bg-\[\#f5f0e8\] .text-primary,
.bg-\[\#f6f1e9\] .text-primary {
  color: #806018;
}

.bg-secondary .text-primary,
.bg-\[\#161616\] .text-primary,
.bg-\[\#0d0b09\] .text-primary,
footer .text-primary {
  color: #e0b43d;
}

button.bg-primary,
a.bg-primary,
span.bg-primary {
  color: #171717;
}

a.inline-block:has(> .hidden.lg\:inline-flex) {
  display: none;
}

@media (max-width: 767px) {
  body {
    font-size: 16px;
  }

  header {
    background-color: rgb(18 18 18 / 82%) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  header img {
    width: 96px;
    height: auto;
  }

  main#root > div > section:first-of-type p {
    font-size: 14px;
  }

  main#root > div > section.h-\[72svh\] a.inline-block span {
    padding-right: 16px;
    padding-left: 16px;
  }

  .text-\[9px\],
  .text-\[10px\],
  .text-\[11px\],
  .text-xs {
    font-size: 12px;
  }
}

@media (min-width: 1024px) {
  a.inline-block:has(> .hidden.lg\:inline-flex) {
    display: inline-block;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}