:root {
  color-scheme: dark;
  --bg: #000;
  --fg: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.62);
  --soft: rgba(255,255,255,.12);
  --hairline: rgba(255,255,255,.22);
  --max: 1440px;
  --tracking: .26em;
  --mx: 0;
  --my: 0;
  --tone-duration: 1600ms;
}

body.page-home {
  transition: background-color var(--tone-duration) ease, color var(--tone-duration) ease;
}
body.page-home.is-light {
  background: #f4f4f1;
  color: rgba(0,0,0,.9);
}

* { box-sizing: border-box; }
html { min-height: 100%; background: #000; scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100%;
  background: #000;
  color: var(--fg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
a { color: inherit; text-decoration: none; }
a:hover { color: #fff; }

.skip-link {
  position: fixed;
  left: 1rem;
  top: .75rem;
  z-index: 1000;
  transform: translateY(-160%);
  border: 1px solid var(--hairline);
  background: rgba(0,0,0,.9);
  padding: .75rem 1rem;
}
.skip-link:focus { transform: translateY(0); }
.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;
}

.site-bg {
  position: fixed;
  inset: 0;
  z-index: -3;
  overflow: hidden;
  background: #000 url("particle-poster.jpg") center / cover no-repeat;
  transition: filter var(--tone-duration) ease, background-color var(--tone-duration) ease;
  will-change: filter;
  perspective: 900px;
}
body.page-home.is-light .site-bg {
  background-color: #fff;
  filter: invert(1) grayscale(1) contrast(1.04) brightness(1.04);
}
.bg-video {
  position: absolute;
  z-index: 0;
  inset: -3%;
  width: 106%;
  height: 106%;
  object-fit: cover;
  filter: grayscale(1) contrast(1.12) brightness(.84);
  opacity: .98;
  transform: translate3d(calc(var(--mx) * -18px), calc(var(--my) * -14px), 0) scale(1.055);
  transition: transform .22s ease-out, filter var(--tone-duration) ease, opacity var(--tone-duration) ease;
  will-change: transform, filter;
}
.bg-depth {
  position: absolute;
  inset: -18%;
  z-index: 1;
  pointer-events: none;
  mix-blend-mode: screen;
  will-change: transform, opacity, filter, background-position;
  transition: opacity var(--tone-duration) ease, filter var(--tone-duration) ease, transform .28s ease-out;
}
.bg-depth-a {
  opacity: .55;
  transform: translate3d(calc(var(--mx) * 28px), calc(var(--my) * 22px), 0) scale(1.08);
  background:
    radial-gradient(circle at 24% 48%, rgba(255,255,255,.25), transparent 19rem),
    radial-gradient(circle at 72% 35%, rgba(255,255,255,.19), transparent 17rem),
    radial-gradient(circle at 48% 68%, rgba(255,255,255,.16), transparent 15rem),
    conic-gradient(from 90deg at 50% 50%, transparent, rgba(255,255,255,.16), transparent, rgba(255,255,255,.08), transparent);
  filter: blur(1.2px) contrast(1.28);
  animation: depthPulse 12s ease-in-out infinite alternate;
}
.bg-depth-b {
  opacity: .36;
  transform: translate3d(calc(var(--mx) * -44px), calc(var(--my) * -30px), 0) scale(1.16) rotate(.001deg);
  background-image:
    radial-gradient(circle, rgba(255,255,255,.85) 0 1px, transparent 1.8px),
    radial-gradient(circle, rgba(255,255,255,.45) 0 1px, transparent 2.2px),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.16), transparent 29rem);
  background-size: 42px 42px, 73px 73px, 100% 100%;
  background-position: 0 0, 12px 18px, center;
  filter: blur(.4px);
  animation: starDrift 28s linear infinite;
}
.bg-vignette {
  position: absolute;
  z-index: 2;
  inset: 0;
  background:
    radial-gradient(circle at calc(50% + (var(--mx) * 4%)) calc(42% + (var(--my) * 3%)), rgba(255,255,255,.13), transparent 22rem),
    radial-gradient(circle at 50% 50%, transparent 0 22%, rgba(0,0,0,.17) 52%, rgba(0,0,0,.58) 92%),
    linear-gradient(to bottom, rgba(0,0,0,.28), rgba(0,0,0,.07) 38%, rgba(0,0,0,.55));
  transition: background var(--tone-duration) ease, opacity var(--tone-duration) ease;
}
.bg-grain {
  position: absolute;
  z-index: 3;
  inset: -50%;
  opacity: .15;
  pointer-events: none;
  background-image:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.2) 0 1px, transparent 1.2px),
    radial-gradient(circle at 70% 80%, rgba(255,255,255,.16) 0 1px, transparent 1.2px);
  background-size: 3px 3px, 5px 5px;
  animation: grainShift 16s steps(4) infinite;
}
@keyframes grainShift {
  0%, 100% { transform: translate3d(0,0,0); }
  25% { transform: translate3d(-1.5%,1%,0); }
  50% { transform: translate3d(1%,1.5%,0); }
  75% { transform: translate3d(1.5%,-1%,0); }
}
@keyframes depthPulse {
  0% { opacity: .34; filter: blur(2px) contrast(1.06) brightness(.9); }
  45% { opacity: .68; filter: blur(.8px) contrast(1.42) brightness(1.16); }
  100% { opacity: .46; filter: blur(1.6px) contrast(1.22) brightness(.98); }
}
@keyframes starDrift {
  0% { background-position: 0 0, 12px 18px, center; opacity: .24; }
  50% { background-position: 46px -38px, -28px 64px, center; opacity: .44; }
  100% { background-position: 92px -76px, -68px 110px, center; opacity: .28; }
}

.site-header { display: none; }
.mini-brand,
.nav-link,
.maintenance-copy,
.legal-links,
.back-home,
.eyebrow {
  font-size: clamp(.62rem, .72vw, .82rem);
  letter-spacing: var(--tracking);
  text-transform: uppercase;
}
.menu-toggle { display: none; }

.hero {
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 5rem) clamp(10.5rem, 16vw, 13rem);
  overflow: clip;
}
.logo-stage {
  position: relative;
  width: min(46vw, 780px);
  aspect-ratio: 2048 / 588;
  transform: translateY(clamp(-2.2rem, -4vw, -3.6rem));
  animation: logoIntro 1400ms cubic-bezier(.2,.7,.1,1) both;
}
@keyframes logoIntro {
  from { opacity: 0; transform: translateY(.75rem) scale(.985); filter: blur(10px); }
  to { opacity: 1; transform: translateY(clamp(-2.2rem, -4vw, -3.6rem)) scale(1); filter: blur(0); }
}
.logo-mask {
  position: absolute;
  inset: 0;
  -webkit-mask-image: url("filmfinity-logo-mask.png");
  mask-image: url("filmfinity-logo-mask.png");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  isolation: isolate;
  filter:
    drop-shadow(0 0 .7rem rgba(255,255,255,.24))
    drop-shadow(0 1.4rem 2.8rem rgba(255,255,255,.10));
}
.logo-mask::before,
.logo-mask::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}
.logo-mask::before {
  background:
    linear-gradient(105deg, rgba(255,255,255,.04), rgba(255,255,255,.65) 22%, rgba(255,255,255,.08) 35%, rgba(255,255,255,.86) 62%, rgba(255,255,255,.18) 78%, rgba(255,255,255,.5)),
    radial-gradient(circle at 44% 47%, rgba(255,255,255,.78), transparent 15%);
  mix-blend-mode: screen;
  opacity: .48;
}
.logo-mask::after {
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.12) 0 1px, transparent 1px 27px),
    linear-gradient(to bottom, rgba(255,255,255,.82), rgba(255,255,255,.2) 45%, rgba(255,255,255,.7));
  opacity: .18;
  mix-blend-mode: overlay;
}
.logo-video {
  position: absolute;
  inset: -10%;
  width: 120%;
  height: 120%;
  object-fit: cover;
  filter: grayscale(1) brightness(2.2) contrast(1.7);
  opacity: .92;
  transform: translate3d(-2%, -3%, 0) scale(1.05);
}
.logo-edge {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: .12;
  filter: drop-shadow(0 0 .6rem rgba(255,255,255,.18));
  mix-blend-mode: screen;
  pointer-events: none;
}
body.page-home.is-light .logo-mask {
  filter:
    invert(1)
    drop-shadow(0 0 .8rem rgba(0,0,0,.22))
    drop-shadow(0 1.4rem 2.8rem rgba(0,0,0,.10));
}
body.page-home.is-light .logo-edge {
  opacity: .16;
  filter: invert(1) drop-shadow(0 0 .55rem rgba(0,0,0,.16));
  mix-blend-mode: multiply;
}

.cursor-dust {
  position: fixed;
  inset: 0;
  z-index: 35;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: .92;
  transition: mix-blend-mode var(--tone-duration) ease, opacity var(--tone-duration) ease;
}
body.page-home.is-light .cursor-dust {
  mix-blend-mode: multiply;
  opacity: .78;
}

.maintenance-copy {
  position: fixed;
  z-index: 10;
  left: 50%;
  bottom: clamp(1.45rem, 3.2vw, 3.35rem);
  width: min(92vw, 1040px);
  transform: translateX(-50%);
  display: grid;
  gap: .48rem;
  text-align: center;
  color: rgba(255,255,255,.72);
  line-height: 1.45;
  text-shadow: 0 0 1.7rem rgba(0,0,0,.9);
}
.maintenance-copy p { margin: 0; }
.maintenance-copy p:nth-child(1) { color: rgba(255,255,255,.86); }
.maintenance-copy p:nth-child(2) { color: rgba(255,255,255,.7); }
body.page-home.is-light .maintenance-copy {
  color: rgba(0,0,0,.68);
  text-shadow: 0 0 1.8rem rgba(255,255,255,.95);
}
body.page-home.is-light .maintenance-copy p:nth-child(1) { color: rgba(0,0,0,.88); }
body.page-home.is-light .maintenance-copy p:nth-child(2) { color: rgba(0,0,0,.7); }
body.page-home.is-light .legal-links { color: rgba(0,0,0,.55); }
.maintenance-copy a { transition: opacity .25s ease; }
.maintenance-copy a:hover { opacity: .75; }
.legal-links {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .78rem 1.25rem;
  margin-top: .55rem;
  color: rgba(255,255,255,.56);
}
.legal-links a {
  position: relative;
  transition: color .25s ease, opacity .25s ease;
}
.legal-links a::after {
  content: "";
  position: absolute;
  left: 0;
  right: .25em;
  bottom: -.28rem;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s ease;
}
.legal-links a:hover { color: #fff; }
.legal-links a:hover::after { transform: scaleX(1); }
.maintenance-placeholders { position: absolute; height: 0; overflow: hidden; }

.site-bg-policy .bg-video { opacity: .42; filter: grayscale(1) contrast(1.15) brightness(.45) blur(1px); }
.site-bg-policy .bg-depth { opacity: .14; }
.policy-header { mix-blend-mode: normal; background: linear-gradient(to bottom, rgba(0,0,0,.68), transparent); }
.policy-shell {
  width: min(1120px, calc(100% - 2rem));
  margin: 0 auto;
  padding: clamp(7rem, 11vw, 10rem) 0 clamp(4rem, 10vw, 8rem);
}
.back-home {
  display: inline-flex;
  color: rgba(255,255,255,.62);
  margin-bottom: 1.8rem;
}
.back-home:hover { color: #fff; }
.policy-logo {
  display: block;
  width: min(480px, 74vw);
  margin: 0 0 clamp(1.5rem, 4vw, 3rem);
  opacity: .84;
  filter: drop-shadow(0 0 1.6rem rgba(255,255,255,.12));
}
.policy-card {
  border: 1px solid rgba(255,255,255,.16);
  background:
    linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.025)),
    rgba(0,0,0,.62);
  box-shadow: 0 2rem 7rem rgba(0,0,0,.62);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  padding: clamp(1.25rem, 4vw, 4rem);
}
.eyebrow {
  color: rgba(255,255,255,.48);
  margin-bottom: .65rem;
}
.policy-card h1 {
  margin: 0 0 clamp(1.25rem, 3vw, 2.4rem);
  font-size: clamp(2rem, 5.5vw, 5.25rem);
  letter-spacing: .04em;
  line-height: .9;
  text-transform: uppercase;
}
.policy-copy {
  white-space: pre-wrap;
  color: rgba(255,255,255,.76);
  line-height: 1.72;
  font-size: clamp(.9rem, 1vw, 1rem);
}
.policy-copy::selection,
.policy-card h1::selection,
.policy-card a::selection { background: rgba(255,255,255,.28); }
.policy-footer {
  border-top: 1px solid rgba(255,255,255,.14);
  margin-top: clamp(2rem, 4vw, 3.4rem);
  padding-top: 1.6rem;
  text-align: center;
  color: rgba(255,255,255,.55);
  font-size: .78rem;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.policy-footer p { margin: .35rem 0; }
.policy-footer .legal-links { margin-top: 1rem; }

@media (max-width: 920px) {
  .logo-stage { width: min(64vw, 620px); }
  .hero { padding-bottom: 13.2rem; }
  .maintenance-copy { gap: .38rem; --tracking: .18em; }
}

@media (max-width: 620px) {
  .hero {
    align-items: center;
    padding-top: 3rem;
    padding-bottom: 16rem;
  }
  .logo-stage {
    width: min(84vw, 520px);
    transform: translateY(-2.1rem);
  }
  .maintenance-copy {
    bottom: 1.05rem;
    font-size: .62rem;
    letter-spacing: .16em;
    gap: .35rem;
  }
  .legal-links { gap: .52rem .8rem; }
  .policy-shell { width: min(100% - 1rem, 1120px); }
  .policy-card { padding: 1rem; }
  .policy-copy { font-size: .86rem; line-height: 1.64; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
  .bg-video, .logo-video, .bg-depth, .cursor-dust { display: none; }
  .logo-mask { background: rgba(255,255,255,.75) url("particle-poster.jpg") center / cover no-repeat; }
}
