/* ==========================================================================
   Downtown Hobart — scroll-scrub orbit hero (homepage only)
   Namespaced .orbit-* so nothing here collides with three-d.css.
   Depends on the palette vars in styles.css.
   ========================================================================== */

.orbit-wrap { position: relative; height: 300vh; }

.orbit-stage {
  position: sticky; top: 0;
  height: 100vh; min-height: 600px;
  overflow: hidden;
  background: #1a1814;
}
/* No 3D context here on purpose: the orbit is the motion, so there is no
   pointer-tilt to composite and the video can sit 1:1 instead of being
   oversampled for a parallax zoom. */
.orbit-media { position: absolute; inset: 0; overflow: hidden; }
.orbit-media video,
.orbit-media .orbit-plate {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.orbit-media .orbit-plate { background-size: cover; background-position: center; }
.orbit-lqip { filter: blur(14px); transform: scale(1.06); }
#orbitPoster, #orbitVideo { opacity: 0; transition: opacity .6s ease; }
#orbitPoster.in, #orbitVideo.in { opacity: 1; }

/* flat wash: pushes the whole orbit back a plane */
.orbit-tint {
  position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background: rgba(28,23,17, var(--tint, .40));
}

/* one directional gradient carries legibility; bottom bed seats the footer */
.orbit-scrim {
  position: absolute; inset: 0; z-index: 4; pointer-events: none; opacity: var(--scrimK, 1);
  background:
    linear-gradient(101deg, rgba(24,20,15,.90) 0%, rgba(26,21,16,.78) 22%,
                            rgba(28,23,18,.46) 46%, rgba(30,25,19,.12) 68%, rgba(30,25,19,0) 84%),
    linear-gradient(0deg,   rgba(22,18,14,.72) 0%, rgba(22,18,14,.16) 18%, rgba(22,18,14,0) 34%),
    linear-gradient(180deg, rgba(22,18,14,.52) 0%, rgba(22,18,14,0) 16%);
}

.orbit-micro {
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: .7rem; line-height: 1;
  letter-spacing: .2em; text-transform: uppercase;
}

/* ---- the lockup, anchored left ---- */
.orbit-lockup {
  position: absolute; z-index: 10;
  left: clamp(24px, 4.4vw, 64px);
  top: 50%; transform: translateY(-50%);
  max-width: min(56%, 44rem);
  will-change: transform, opacity;
}
.orbit-kicker { display: flex; align-items: center; gap: 16px; margin: 0 0 1.9rem; }
.orbit-kicker i { width: 52px; height: 2px; background: var(--gold); display: block; }
.orbit-kicker span { color: var(--gold); letter-spacing: .2em; }

.orbit-lockup h1 {
  margin: 0;
  font-family: 'Fraunces', Georgia, serif; font-variation-settings: 'opsz' 144;
  font-weight: 600; color: var(--cream);
  font-size: clamp(2.9rem, 7vw, 5.9rem); line-height: .96; letter-spacing: -.025em;
}
.orbit-lockup h1 b { display: block; font-weight: 600; }
.orbit-lead {
  color: rgba(246,244,240,.88);
  font: 400 clamp(1rem, 1.35vw, 1.2rem)/1.62 'Inter', sans-serif;
  margin: 1.9rem 0 0; max-width: 30rem;
}

.orbit-acts { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 2.5rem; }
.orbit-btn, .orbit-btn-line {
  display: inline-flex; align-items: center; gap: .9rem; border-radius: 2px;
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: .8rem;
  letter-spacing: .12em; text-transform: uppercase;
  padding: 1.12rem 2.1rem;
  transition: background .22s ease, border-color .22s ease, transform .22s ease;
}
.orbit-btn { background: var(--terra); color: #fff; border: 1px solid var(--terra); }
.orbit-btn:hover { background: #ce7854; border-color: #ce7854; transform: translateY(-1px); }
.orbit-btn-line { color: var(--cream); border: 1px solid rgba(246,244,240,.52); }
.orbit-btn-line:hover { border-color: var(--cream); background: rgba(246,244,240,.08); }

/* ---- bottom chrome ---- */
.orbit-foot {
  position: absolute; z-index: 12; left: 0; right: 0; bottom: 0;
  padding: 0 clamp(24px, 4.4vw, 64px) 26px;
}
.orbit-foot .orbit-rule { height: 1px; background: rgba(246,244,240,.20); margin-bottom: 22px; }
.orbit-foot .orbit-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.orbit-foot .orbit-row span { color: rgba(246,244,240,.72); letter-spacing: .18em; }
.orbit-foot .orbit-row b { color: var(--gold); font-weight: 600; }

/* shared photographic grain over type AND footage */
.orbit-grain {
  position: absolute; inset: 0; z-index: 14; pointer-events: none;
  opacity: .07; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* --------------------------------------------------------------------------
   While the sticky hero owns the viewport the shared header must NOT flip to
   its cream .scrolled state — otherwise a cream bar sits over dark footage
   for the whole 300vh. js/hero-orbit.js toggles .orbit-active on <html>.
   -------------------------------------------------------------------------- */
html.orbit-active .site-header.scrolled {
  padding: 1.4rem 0;
  background: linear-gradient(180deg, rgba(20,24,20,.55) 0%, rgba(20,24,20,.18) 60%, rgba(20,24,20,0) 100%);
  backdrop-filter: none;
  box-shadow: none;
}
html.orbit-active .site-header.scrolled .nav-link,
html.orbit-active .site-header.scrolled .nav-link.active,
html.orbit-active .site-header.scrolled .brand-mark {
  color: #fff; text-shadow: 0 1px 10px rgba(0,0,0,.45);
}
html.orbit-active .site-header.scrolled .brand-logo { height: 34px; }
html.orbit-active .site-header.scrolled .brand-logo-white { display: block; }
html.orbit-active .site-header.scrolled .brand-logo-green { display: none; }
html.orbit-active .to-top { opacity: 0 !important; pointer-events: none; }

@media (max-width: 860px) {
  .orbit-lockup { max-width: none; right: clamp(24px, 4.4vw, 64px); }
  .orbit-scrim {
    background:
      linear-gradient(101deg, rgba(24,20,15,.88) 0%, rgba(26,21,16,.72) 46%, rgba(28,23,18,.42) 100%),
      linear-gradient(0deg, rgba(22,18,14,.74) 0%, rgba(22,18,14,0) 34%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .orbit-wrap { height: 100vh; }
  .orbit-stage { position: relative; }
}
