@font-face {
  font-family: "Allura Local";
  src: url("../fonts/Allura-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

.infinite-scroll-hero,
.infinite-scroll-hero * {
  box-sizing: border-box;
}

.infinite-scroll-hero {
  position: relative;
  width: 100%;
  color: #f4f1ea;
  background:
    radial-gradient(circle at 20% 10%, rgba(239, 63, 53, 0.08), transparent 20%),
    radial-gradient(circle at 80% 0%, rgba(255, 255, 255, 0.04), transparent 24%),
    linear-gradient(180deg, #080808 0%, #030303 100%);
  overflow: clip;
  isolation: isolate;
  font-family: Arial, Helvetica, sans-serif;
  letter-spacing: 0.01em;
}

.infinite-scroll-hero .wrapper {
  position: relative;
  min-height: 100vh;
  overflow: visible;
}

.infinite-scroll-hero .content {
  position: relative;
}

.infinite-scroll-hero .hero {
  position: relative;
  width: 100%;
  min-height: 100svh;
  overflow: clip;
  isolation: isolate;
  /* Removed display: grid and align-items: end to prevent alignment issues */
}

/* Removed ::before and ::after overlays to ensure no internal spacing or masks are applied */

.infinite-scroll-hero .hero-image,
.infinite-scroll-hero .hero-image img,
.infinite-scroll-hero .hero-image video,
.infinite-scroll-hero img.hero-image,
.infinite-scroll-hero video.hero-image {
  display: block;
}

.infinite-scroll-hero .hero-image {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #000;
}

.infinite-scroll-hero .hero-image img,
.infinite-scroll-hero img.hero-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 85%;
  filter: grayscale(1) saturate(0.2) contrast(1.08);
}

.infinite-scroll-hero .hero-image video,
.infinite-scroll-hero video.hero-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 85%;
  filter: none;
}

.infinite-scroll-hero .hero--one .hero-image img,
.infinite-scroll-hero .hero--one img.hero-image {
  object-fit: contain;
  object-position: center center;
}

.infinite-scroll-hero .marquees {
  position: absolute;
  inset: 0;
  z-index: 3;
  overflow: visible;
  pointer-events: none;
}

.infinite-scroll-hero .radial-text-marquee {
  position: absolute;
  left: 0;
  right: 0;
  overflow: visible;
}

.infinite-scroll-hero .radial-text-marquee:first-child {
  top: 35%;
  transform: translateY(-50%);
}

.infinite-scroll-hero .radial-text-marquee.script {
  top: 65%;
  transform: translateY(-50%);
  z-index: 2;
}

.infinite-scroll-hero .radial-text-marquee svg {
  position: absolute;
  overflow: visible;
}

.infinite-scroll-hero .radial-text-marquee path {
  stroke: red;
  stroke-width: 2;
  fill: none;
}

.infinite-scroll-hero .radial-text-marquee--white [data-radial-text-marquee-text] {
  font-family: "League Gothic", sans-serif;
  font-size: 16rem;
  text-transform: uppercase;
}

.infinite-scroll-hero .radial-text-marquee--red [data-radial-text-marquee-text] {
  font-size: 11.5rem;
  color: rgba(147, 113, 129, 1);
  font-family: "Allura Local", cursive;
}

.infinite-scroll-hero .red {
  color: rgba(147, 113, 129, 1);
}

.infinite-scroll-hero .hero-copy {
  position: relative;
  z-index: 3;
  max-width: 440px;
  padding: clamp(24px, 5vw, 60px);
  margin-bottom: clamp(30px, 7vw, 70px);
  margin-left: clamp(12px, 3vw, 40px);
}

.infinite-scroll-hero .eyebrow {
  margin: 0 0 16px;
  color: rgba(244, 241, 234, 0.68);
  font-size: 12px;
  letter-spacing: 0.34em;
  text-transform: uppercase;
}

.infinite-scroll-hero .hero-copy h2 {
  margin: 0;
  color: #f4f1ea;
  font-family: "Arial Black", "Impact", sans-serif;
  font-size: clamp(48px, 8vw, 90px);
  line-height: 0.88;
  letter-spacing: -0.06em;
  text-transform: uppercase;
  text-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
}

.infinite-scroll-hero .hero-copy h3 {
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: clamp(20px, 3vw, 30px);
  line-height: 1;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.infinite-scroll-hero .description {
  max-width: 280px;
  margin: 18px 0 0;
  color: rgba(244, 241, 234, 0.68);
  font-size: 15px;
  line-height: 1.6;
}

.infinite-scroll-hero .hero--two .hero-copy {
  margin-left: auto;
  margin-right: clamp(12px, 3vw, 40px);
  text-align: right;
}

.infinite-scroll-hero .hero--two .description {
  margin-left: auto;
}