/* ============================================================
   SHARED CINEMATIC BUNDLE — pitch-sites
   Inherits site's own palette via --accent-color var
   ============================================================ */

/* Scroll progress bar */
.cinematic-scroll-progress{
  position:fixed;top:0;left:0;right:0;height:2px;
  background:transparent;z-index:9999;pointer-events:none;
}
.cinematic-scroll-progress__bar{
  height:100%;width:0%;
  background:var(--accent-color,#C8A558);
  transition:width .1s linear;
  box-shadow:0 0 12px var(--accent-color,#C8A558);
}

/* Scroll reveal — base state */
[data-reveal]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity 1s cubic-bezier(.2,.8,.2,1),transform 1s cubic-bezier(.2,.8,.2,1);
  will-change:opacity,transform;
}
[data-reveal].in-view{opacity:1;transform:translateY(0)}
[data-reveal-delay="1"]{transition-delay:.08s}
[data-reveal-delay="2"]{transition-delay:.16s}
[data-reveal-delay="3"]{transition-delay:.24s}
[data-reveal-delay="4"]{transition-delay:.32s}
[data-reveal-delay="5"]{transition-delay:.40s}
[data-reveal-delay="6"]{transition-delay:.48s}

/* Hero cursor spotlight */
.cinematic-hero-spotlight{
  position:relative;
  isolation:isolate;
}
.cinematic-hero-spotlight::after{
  content:'';
  position:absolute;inset:0;
  background:radial-gradient(circle 340px at var(--cx,50%) var(--cy,50%),
    rgba(var(--accent-rgb,200,165,88),.12),transparent 60%);
  opacity:0;
  transition:opacity .4s ease;
  pointer-events:none;
  z-index:1;
}
.cinematic-hero-spotlight:hover::after{opacity:1}
.cinematic-hero-spotlight > *{position:relative;z-index:2}

/* Magnetic buttons */
[data-magnetic]{
  transition:transform .35s cubic-bezier(.2,.8,.2,1);
  will-change:transform;
}

/* Spotlight border cards — no overflow clip so offset badges stay visible */
[data-spotlight-card]{
  position:relative;
}
[data-spotlight-card]::before{
  content:'';
  position:absolute;inset:-1px;
  background:radial-gradient(circle 220px at var(--mx,50%) var(--my,50%),
    rgba(var(--accent-rgb,200,165,88),.14),transparent 60%);
  opacity:0;
  transition:opacity .35s ease;
  pointer-events:none;
  z-index:1;
}
[data-spotlight-card]:hover::before{opacity:1}
[data-spotlight-card] > *{position:relative;z-index:2}

/* Image hover lift */
[data-image-lift]{
  overflow:hidden;
  border-radius:inherit;
}
[data-image-lift] img{
  transition:transform 1.2s cubic-bezier(.2,.8,.2,1),filter .6s ease;
}
[data-image-lift]:hover img{
  transform:scale(1.04);
  filter:brightness(1.04) saturate(1.08);
}

/* Parallax hero */
[data-parallax]{
  will-change:transform;
}

/* SVG divider draw-in */
[data-svg-divider]{
  stroke-dasharray:var(--dash,1000);
  stroke-dashoffset:var(--dash,1000);
  transition:stroke-dashoffset 1.6s cubic-bezier(.2,.8,.2,1);
}
[data-svg-divider].in-view{stroke-dashoffset:0}

/* Odometer */
.cinematic-odometer{
  display:inline-flex;
  line-height:1;
  overflow:hidden;
  font-variant-numeric:tabular-nums;
}
.cinematic-odo-digit{
  display:inline-block;
  overflow:hidden;
  height:1em;
  position:relative;
}
.cinematic-odo-strip{
  display:flex;flex-direction:column;
  transition:transform 1.8s cubic-bezier(.16,1,.3,1);
}
.cinematic-odo-strip span{display:block;height:1em;line-height:1}

/* Marquee kinetic strip */
.cinematic-marquee{
  overflow:hidden;
  position:relative;
  padding:28px 0;
  border-top:1px solid var(--hairline-color,rgba(0,0,0,.08));
  border-bottom:1px solid var(--hairline-color,rgba(0,0,0,.08));
}
.cinematic-marquee__track{
  display:flex;
  gap:64px;
  white-space:nowrap;
  animation:cinematic-marquee 55s linear infinite;
  will-change:transform;
}
.cinematic-marquee:hover .cinematic-marquee__track{animation-play-state:paused}
.cinematic-marquee__item{
  display:inline-flex;align-items:center;gap:28px;
  flex-shrink:0;
  font-size:clamp(1.4rem,3vw,2.6rem);
  letter-spacing:-.01em;
  text-transform:uppercase;
  font-weight:500;
  color:var(--marquee-color,inherit);
}
.cinematic-marquee__item::after{
  content:'●';
  display:inline-block;
  font-size:.3em;
  opacity:.45;
  color:var(--accent-color,#C8A558);
  margin-left:28px;
}
@keyframes cinematic-marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

/* Text reveal (hero headline) — simple fade-up that preserves inner HTML */
[data-text-reveal]{
  display:inline-block;
  max-width:100%;
  opacity:0;
  transform:translateY(28px);
  transition:opacity 1.3s cubic-bezier(.2,.8,.2,1),transform 1.3s cubic-bezier(.2,.8,.2,1);
  will-change:opacity,transform;
}
[data-text-reveal].in-view{
  opacity:1;
  transform:translateY(0);
}

/* Corner decorations (reveal on scroll) */
[data-corners]{position:relative}
[data-corners]::before,
[data-corners]::after{
  content:'';
  position:absolute;
  width:22px;height:22px;
  border-color:var(--accent-color,#C8A558);
  opacity:0;
  transition:opacity .8s ease .3s;
  pointer-events:none;
}
[data-corners]::before{
  top:10px;left:10px;
  border-top:1.5px solid;
  border-left:1.5px solid;
}
[data-corners]::after{
  bottom:10px;right:10px;
  border-bottom:1.5px solid;
  border-right:1.5px solid;
}
[data-corners].in-view::before,
[data-corners].in-view::after{opacity:1}

/* Smooth scroll */
html{scroll-behavior:smooth}

/* Reduce motion safety */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001s !important;
    transition-duration:.001s !important;
  }
  .cinematic-marquee__track{animation:none !important}
  [data-reveal]{opacity:1 !important;transform:none !important}
}