.homepage-hero-video {
  position: relative;
  width: 100%;
  aspect-ratio: 1920 / 920;
  min-height: 920px;
  overflow: hidden;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  background: #000;
	height: 75vh;
}
.homepage-hero-video .hhv__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.homepage-hero-video .homepage-hero-image {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  height: 75vh;
  min-height: 920px;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center bottom;
  object-position: center bottom;
}
.homepage-hero-video .homepage-hero-image img {
  width: 100vw;
  max-width: 100%;
  height: 75vh;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center bottom;
  object-position: center bottom;
  min-height: 920px;
}
/* Dark gradient overlay */
.hhv__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 300px;
  background: linear-gradient( to bottom, rgba(0,0,0,.45) 0%, rgba(0,0,0,.25) 50%, rgba(0,0,0,0) 100% );
  pointer-events: none;
  z-index: 1;
}
/* Content – 1200 px max-width container */
.hhv__content-wrap {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-top: 3.625rem;
}
.hhv__content-wrap.hhv-has-ribbon {
  margin-top: 24px;
}
/* Exclusive Badge */
.hhv__ribbon {
  display: inline-flex;
  background: #ff9c07;
  color: #000000;
  font-size: .875rem;
  font-weight: 700;
  text-transform: uppercase;
  padding: 0 8px;
  margin-bottom: 1.125rem;
  height: 26px;
  align-items: center;
}
/* Title */
.hhv__title {
  font-family: RazerF5,Arial,Helvetica,sans-serif;
  font-weight: 700;
  font-size: 2.5rem;
  text-transform: uppercase;
  line-height: 1.1;
  color: #FFFFFF;
  margin-bottom: 4px;
}
.homepage-hero-video.text-black .hhv__title { 
  color: #000000; 
}
/* Description */
.hhv__description {
  font-family: RazerF5,Arial,Helvetica,sans-serif;
  font-weight: 300;
  font-size: 1.5rem;
  color: #FFFFFF;
  font-weight: 400;
  margin-bottom: 0.8rem;
	text-transform: uppercase;
}
.homepage-hero-video.text-black .hhv__description { 
  color: #000000; 
}
.lowercase-exception { text-transform: lowercase; }
/* Button Group */
.hhv__actions {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1rem, 1.5vw, 1.5rem);
  justify-content: center;
  margin-top: clamp(.25rem, 1vw, .35rem);
}
/* Shared button base */
.hhv__btn {
  font-family: RazerF5,Arial,Helvetica,sans-serif;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  padding: 0 1rem;
  min-height: 44px;
  cursor: pointer;
  text-decoration: none;
  border-radius: 3px;
  min-width: 5rem;
  white-space: nowrap;
  text-decoration: none !important;
  /* Prevent layout shift on focus-visible outline */
  outline-offset: 3px;
  transition: background-color 0.3s ease; 
}
.hhv__btn:focus-visible {
  outline: 2px solid #44D62C;
}
/* "Learn More" primary variant button */
.hhv__btn--primary {
  background: #44D62C;
  color: #000000 !important;
  border-color: #44D62C;
}
.hhv__btn--primary:hover,
.hhv__btn--primary:focus-visible {
  background: #73e161;
}
/* "Buy" – secondary variant button */
.hhv__btn--secondary {
  background-color: rgba(0, 0, 0, 0.5);
  color: #44D62C;
  border: 2px solid #44D62C;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
.hhv__btn--secondary:hover,
.hhv__btn--secondary:focus-visible {
  background: #122f0d;
}
:lang(ar-MENA), :lang(en-MENA), :lang(zh-CN), :lang(pt-BR), :lang(es-MX) {
  .hhv__btn--secondary {
    display: none;
  }
}
/* Play / Pause Button */
/* Anchored relative to the 1200 px inner container */
.hhv__playback-wrap {
  position: absolute;
  bottom: clamp(.875rem, 2.5vw, 1.5rem);
  /* Right edge of the 1200 px container */
  right: max(calc((100% - 1200px) / 2), clamp(1rem, 4vw, 2.5rem));
  z-index: 3;
}
.hhv__playback-btn {
  width: clamp(2rem, 3.5vw, 2.75rem);
  height: clamp(2rem, 3.5vw, 2.75rem);
  border-radius: 50%;
  border: none;
  background: #44D62C;
  color: #000000;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.hhv__playback-btn:hover {
  background: #73e161;
}
.hhv__playback-btn:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
.hhv__playback-btn:active { transform: scale(.97); }
/* SVG icons inside the button */
.hhv__playback-btn svg {
  width: 55%;
  height: 55%;
  fill: currentColor;
  flex-shrink: 0;
	 min-width: 17px;
}
.hhv__playback-btn .icon-pause { display: block; }
.hhv__playback-btn .icon-play { display: none; }
.hhv__playback-btn[data-state="paused"] .icon-play  { display: block; }
.hhv__playback-btn[data-state="paused"] .icon-pause { display: none; }
/* Make the wrapper relative so the badge positions correctly */
.hhv__playback-btn { position: relative; }
@media (max-width: 1400px) {
  .homepage-hero-video .homepage-hero-image img {
    min-height: 700px;
  }
  .homepage-hero-video {
    min-height: 700px;
  }
}
/* Tablet view */
@media (max-width: 1024px) {
  .homepage-hero-video .hhv__title {
     font-size: 2rem;
  }
  .homepage-hero-video .hhv__description {
     font-size: 1.3125rem;
  }
}
/* Mobile view */
@media (max-width: 480px) {
  .homepage-hero-video {
    aspect-ratio: unset;
    padding: 0 0.625rem;
    min-height: 650px;
  }
  .homepage-hero-video .hhv__title {
     /* font-size: 2.5rem; */
  }
  .homepage-hero-video .hhv__description {
			 font-size: 1.1875rem;
     line-height: 1.8;
  }
  .homepage-hero-video .homepage-hero-image img, .homepage-hero-video .hhv__video {
    min-height: 650px;
  }
}