/* Lighthouse intro overlay and hero background (lighthouse.js). */
.lh-layer { display:none; }
html.lh-intro { overflow:hidden; scrollbar-gutter:stable; }
html.lh-intro .lh-layer,
html.lh-outro .lh-layer {
  display:block;
  position:fixed;
  inset:0;
  z-index:1000;
  background:#02070b;
  transition:opacity .9s ease;
}
.lh-layer.lh-leaving { opacity:0; pointer-events:none; }

.lh-stage,
.lh-snapshot { position:absolute; inset:0; width:100%; height:100%; }
.lh-stage canvas,
.lh-hero canvas { display:block; width:100%; height:100%; }
.lh-stage canvas { opacity:0; transition:opacity 1.1s ease; }
.lh-stage canvas.lh-live { opacity:1; }
.lh-snapshot { display:block; transition:transform .9s ease; }
.lh-leaving .lh-snapshot { transform:scale(1.025); }

.lh-skip {
  position:absolute;
  right:max(18px, env(safe-area-inset-right));
  bottom:max(18px, env(safe-area-inset-bottom));
  z-index:3;
  min-height:40px;
  padding:0 16px;
  border:1px solid rgba(238,250,250,.24);
  border-radius:999px;
  background:rgba(2,10,15,.4);
  color:rgba(238,250,250,.78);
  font:600 13px/1 var(--font-body);
  letter-spacing:.04em;
  cursor:pointer;
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  transition:color .2s ease, border-color .2s ease, background .2s ease;
}
.lh-skip:hover,
.lh-skip:focus-visible { color:#fff; border-color:#78eee5; background:rgba(2,10,15,.62); outline:none; }
.lh-skip:focus-visible { box-shadow:0 0 0 3px rgba(120,238,229,.35); }

/* Without WebGL: a quiet still of light in the dark. */
.lh-fallback {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:
    radial-gradient(ellipse 60% 34% at 50% 46%, rgba(255,214,150,.2), transparent 70%),
    linear-gradient(180deg, #02070b 0%, #0b1922 62%, #03080c 100%);
}
.lh-fallback[hidden] { display:none; }
.lh-fallback span {
  font:700 clamp(52px, 13vw, 176px)/1 var(--font-display);
  letter-spacing:.03em;
  color:#fff4dd;
  text-shadow:0 0 22px rgba(255,200,130,.85), 0 0 90px rgba(255,170,80,.5);
  animation:lh-glow 1.6s ease both;
}
@keyframes lh-glow { from { opacity:0; filter:blur(8px); } to { opacity:1; filter:none; } }

/* In the hero the wrapper takes the video's place and class. */
.lh-hero { background:#02070b; opacity:0; transition:opacity 1.2s ease; }
.lh-hero.lh-on { opacity:1; }
.lh-hero.lh-instant { transition:none; }

@media (prefers-reduced-motion: reduce) {
  .lh-layer, .lh-stage canvas, .lh-snapshot, .lh-hero { transition-duration:.3s; }
  .lh-fallback span { animation:none; }
}
