/* =====================================================================
   A2 FARMER — Parallax variant (loads AFTER styles.css)
   Only additive: depth layers, inner-image glides, progress bar.
   All motion is compositor-only (translate/scale) and fully disabled
   under prefers-reduced-motion (parallax.js exits early there too).
   ===================================================================== */

/* ---------- gold scroll-progress bar ---------- */
.plx-progress{
  position:fixed;top:0;left:0;height:3px;width:0;z-index:99;
  background:linear-gradient(90deg,var(--gold),var(--gold-2),var(--gold-3));
  box-shadow:0 0 14px rgba(201,151,47,.55);
  pointer-events:none;
}

/* ---------- hero depth ---------- */
/* slightly taller bleed so the slow-zoomed bg never shows edges */
.hero__bg{inset:-12% 0 -12% 0;transform-origin:center 30%}
.hero__copy,.hero__bg{will-change:transform,opacity}

/* ---------- photo bands: bigger bleed for stronger travel ---------- */
.tradition__bg,.cta__bg{inset:-16% 0;transform-origin:center}
.tradition__content,.cta__inner{will-change:transform}

/* ---------- inner-image parallax (image glides inside its frame) ---------- */
.plx-inner{overflow:hidden}
.plx-inner img{
  height:120% !important;
  width:100%;object-fit:cover;
  will-change:transform;
}
/* the method cards already zoom on hover — compose, don't fight */
.step:hover .step__media.plx-inner img,
.savourcard:hover .photo.plx-inner img{transition:none}

/* wrapper injected around the buffalo portrait (its styles move here) */
.plx-clip{
  border-radius:22px;overflow:hidden;box-shadow:var(--shadow);
  aspect-ratio:4/5;width:100%;
}
.plx-clip img{width:100%;height:120%;object-fit:cover;display:block;will-change:transform}

/* ---------- gallery stage: gentle settle-in zoom ---------- */
.gallery__stage .slide img{will-change:transform}

/* ---------- reduced motion: kill everything ---------- */
@media(prefers-reduced-motion:reduce){
  .plx-progress{display:none}
  .plx-inner img,.plx-clip img{height:100% !important;transform:none !important;translate:none !important}
  .hero__bg,.tradition__bg,.cta__bg,.hero__copy,.tradition__content,.cta__inner{translate:none !important;scale:none !important;transform:none !important}
}