@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&display=swap');

#novetaHeroRoot {
  width:100%;
  height:100vh;
  height:100svh;
  overflow:hidden;
}

.noveta-main-hero {
  position: relative;
  width: 100%;
  height: 100vh;
  height: 100svh;
  min-height: 100vh;
  min-height: 100svh;
  background: #000;
  color: #fff;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.nv-hero-video,
.nv-hero-man-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translateY(17%);
  transform-origin: center;
}

.nv-hero-video { z-index: 0; opacity: 0; }

.noveta-main-hero .nv-hero-video {
  object-fit: contain;
  transform: translateY(17%) scale(.68);
  transform-origin: center;
}

.nv-orbit-fallback { position:absolute; inset:0; z-index:3; overflow:hidden; }
.nv-orbit-fallback-track { position:absolute; left:50%; top:56%; width:1px; height:1px; animation:nvFallbackOrbit 36s linear infinite; }
.nv-orbit-fallback a { position:absolute; width:clamp(140px,8.5vw,170px); height:clamp(140px,8.5vw,170px); margin:calc(clamp(140px,8.5vw,170px) / -2); transform:rotate(calc(var(--i) * 45deg)) translateX(clamp(280px,26vw,510px)) rotate(calc(var(--i) * -45deg)); border:1px solid rgba(255,90,44,.6); border-radius:10px; overflow:hidden; box-shadow:0 18px 54px rgba(0,0,0,.7),0 0 18px rgba(255,90,44,.32); }
.nv-orbit-fallback img { width:100%; height:100%; object-fit:cover; display:block; }
@keyframes nvFallbackOrbit { to { transform:rotate(-360deg); } }

.nv-hero-man-frame {
  z-index: 1;
  opacity: 1;
  pointer-events: none;
  mix-blend-mode: normal;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 14%, #000 88%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 14%, #000 88%, transparent 100%);
  animation: nvMaleFrameDrift 9s ease-in-out infinite alternate;
}

@keyframes nvMaleFrameDrift {
  from { transform: translateY(17%) scale(1); }
  to { transform: translateY(17%) scale(1.018); }
}

.nv-hero-shade {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.12) 35%, rgba(0,0,0,.18) 67%, rgba(0,0,0,.7) 100%),
    radial-gradient(circle at 50% 52%, transparent 22%, rgba(0,0,0,.44) 100%);
}

.liquid-glass {
  background: rgba(255,255,255,.01);
  background-blend-mode: luminosity;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border: none;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.1);
  position: relative;
  overflow: hidden;
}

.liquid-glass::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1.4px;
  background: linear-gradient(180deg, rgba(255,255,255,.45) 0%, rgba(255,255,255,.15) 20%, rgba(255,255,255,0) 40%, rgba(255,255,255,0) 60%, rgba(255,255,255,.15) 80%, rgba(255,255,255,.45) 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

.nv-hero-nav {
  position: relative;
  z-index: 20;
  padding: 24px;
}

.nv-hero-nav-inner {
  width: min(100%, 1024px);
  margin: 0 auto;
  border-radius: 999px;
  padding: 12px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nv-hero-nav-left,
.nv-hero-logo,
.nv-hero-links,
.nv-hero-actions,
.nv-hero-socials { display: flex; align-items: center; }
.nv-hero-nav-left { gap: 32px; }
.nv-hero-logo { gap: 8px; color: #fff; font: 600 18px/1 'Manrope', sans-serif; }
.nv-hero-logo svg { width: 24px; height: 24px; }
.nv-hero-links { gap: 28px; }
.nv-hero-links a,
.nv-signup {
  color: rgba(255,255,255,.8);
  font: 500 14px/1 'Manrope', sans-serif;
  text-decoration: none;
  transition: color .2s ease;
}
.nv-hero-links a:hover,
.nv-signup:hover { color: #fff; }
.nv-hero-actions { gap: 16px; }
.nv-signup { color: #fff; background: none; border: 0; cursor: pointer; }
.nv-login {
  border-radius: 999px;
  padding: 10px 24px;
  color: #fff;
  font: 500 14px/1 'Manrope', sans-serif;
  cursor: pointer;
}

.nv-hero-content {
  position: relative;
  z-index: 10;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 24px;
  text-align: center;
  transform: translateY(-20%);
}

.nv-hero-heading {
  margin: 0 0 32px;
  color: #fff;
  font-family: 'Instrument Serif', serif;
  font-size: clamp(48px, 5vw, 72px);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -.025em;
  white-space: nowrap;
  text-shadow: 0 3px 24px rgba(0,0,0,.5);
}

.nv-hero-form-wrap { width: min(100%, 576px); display: grid; gap: 16px; }
.nv-email-bar {
  border-radius: 999px;
  padding: 8px 8px 8px 24px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.nv-email-bar input {
  min-width: 0;
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  font: 400 16px/1.4 'Manrope', sans-serif;
}
.nv-email-bar input::placeholder { color: rgba(255,255,255,.4); }
.nv-email-submit {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: #fff;
  color: #000;
  cursor: pointer;
  transition: transform .2s ease;
}
.nv-email-submit:hover { transform: rotate(-12deg) scale(1.04); }
.nv-hero-subtitle {
  margin: 0;
  padding: 0 16px;
  color: #fff;
  font: 400 14px/1.65 'Manrope', sans-serif;
  text-shadow: 0 2px 12px rgba(0,0,0,.75);
}
.nv-manifesto {
  justify-self: center;
  margin: 0 auto;
  border-radius: 999px;
  padding: 12px 32px;
  color: #fff;
  font: 500 14px/1 'Manrope', sans-serif;
  cursor: pointer;
  transition: background-color .2s ease, transform .2s ease;
}
.nv-manifesto:hover { background: rgba(255,255,255,.05); transform: translateY(-1px); }

.nv-hero-footer { position: relative; z-index: 10; padding-bottom: 48px; }
.nv-hero-socials { justify-content: center; gap: 16px; }
.nv-social {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 999px;
  color: rgba(255,255,255,.8);
  text-decoration: none;
  transition: color .2s ease, background-color .2s ease, transform .2s ease;
}
.nv-social:hover { color: #fff; background: rgba(255,255,255,.05); transform: translateY(-2px); }
.nv-icon { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

@media (max-width: 767px) {
  .noveta-main-hero .nv-hero-video { transform: translateY(17%) scale(.96); }
  .nv-orbit-fallback { inset:0; transform:none; }
  .nv-orbit-fallback a { width:clamp(94px,27vw,112px); height:clamp(94px,27vw,112px); margin:calc(clamp(94px,27vw,112px) / -2); transform:rotate(calc(var(--i) * 45deg)) translateX(clamp(108px,30vw,150px)) rotate(calc(var(--i) * -45deg)); }
  .nv-hero-nav { padding: 18px 16px; }
  .nv-hero-nav-inner { padding: 10px 14px; }
  .nv-hero-links { display: none; }
  .nv-hero-actions { gap: 10px; }
  .nv-login { padding: 10px 16px; }
  .nv-hero-content { padding: 30px 20px; transform: translateY(-12%); }
  .nv-hero-heading { font-size: clamp(43px, 13vw, 56px); margin-bottom: 24px; }
  .nv-hero-subtitle { padding: 0 5px; font-size: 13px; }
  .nv-hero-footer { padding-bottom: 24px; }
  .nv-hero-man-frame { opacity: 1; }
}

@media (max-width: 390px) {
  .nv-signup { display: none; }
  .nv-hero-heading { font-size: 43px; }
}

@media (prefers-reduced-motion: reduce) {
  .noveta-main-hero { display: flex !important; }
  .nv-email-submit,
  .nv-manifesto,
  .nv-social { transition: none; }
  .nv-hero-man-frame { animation: none; }
}
