/* =====================================================================
   ORIGEN — "100% leche de libre pastoreo"
   Cinematic full-bleed parallax band. Dark section, strong scrim.
   ===================================================================== */
#origen.origen {
  position: relative;
  isolation: isolate;
  overflow: clip;
  /* let the photo breathe — a touch taller than default rhythm */
  padding-block: clamp(6rem, 4rem + 12vw, 12rem);
  min-height: clamp(560px, 82vh, 860px);
  display: flex;
  align-items: center;
  background: var(--dark-bg);
}

/* ---- Full-bleed background layer (parallax-safe overscan) ---- */
#origen .origen__bg {
  position: absolute;
  inset: -12% 0;          /* vertical overscan so parallax never reveals edges */
  z-index: 0;
  pointer-events: none;
}
#origen .origen__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
  will-change: transform;
  transform: scale(1.04);  /* hide subpixel gaps during parallax */
}

/* ---- Scrim: legible left-weighted dark wash + bottom anchor ---- */
#origen .origen__scrim {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      100deg,
      color-mix(in oklab, var(--dark-bg) 88%, transparent) 0%,
      color-mix(in oklab, var(--dark-bg) 70%, transparent) 38%,
      color-mix(in oklab, var(--dark-bg) 30%, transparent) 72%,
      color-mix(in oklab, var(--dark-bg) 52%, transparent) 100%
    ),
    linear-gradient(
      to top,
      color-mix(in oklab, var(--dark-bg) 78%, transparent) 0%,
      transparent 42%
    );
}
/* subtle grain over the photo for film texture */
#origen .origen__grain {
  position: absolute;
  inset: 0;
  opacity: .5;
  mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}

/* ---- Content ---- */
#origen .origen__inner {
  position: relative;
  z-index: 2;
}
#origen .origen__content {
  max-width: 46rem;
}

#origen .eyebrow {
  color: var(--gold-400);
}
#origen .origen__leaf {
  display: inline-flex;
  width: 1.2em;
  height: 1.2em;
}
#origen .origen__leaf svg { width: 100%; height: 100%; }
/* hide the eyebrow's default gold dash since we lead with the leaf mark */
#origen .eyebrow::before { display: none; }

#origen .origen__title {
  font-size: var(--step-6);
  line-height: var(--lh-tight);
  letter-spacing: -0.02em;
  margin-top: .85rem;
  color: var(--on-dark);
  text-shadow: 0 2px 30px rgba(0, 0, 0, .35);
}
#origen .origen__title-em {
  font-style: italic;
  color: var(--gold-400);
  font-variation-settings: "SOFT" 40, "WONK" 1;
}

#origen .origen__lead {
  margin-top: clamp(1.3rem, 1rem + 1.4vw, 1.9rem);
  max-width: 42ch;
  font-size: var(--step-1);
  line-height: var(--lh-body);
  color: var(--on-dark);
  text-shadow: 0 1px 18px rgba(0, 0, 0, .4);
}
#origen .origen__lead strong {
  color: var(--gold-300);
  font-weight: 700;
}

/* ---- Stat / commitment chips ---- */
#origen .origen__chips {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem .8rem;
  margin-top: clamp(1.8rem, 1.4rem + 1.8vw, 2.6rem);
}
#origen .origen__chip.pill {
  /* legible green pill tuned for the dark photo */
  background: color-mix(in oklab, var(--pasture-300) 22%, rgba(20, 24, 12, .55));
  color: var(--cream-50);
  border-color: color-mix(in oklab, var(--pasture-300) 50%, transparent);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 10px 28px -16px rgba(0, 0, 0, .7);
  letter-spacing: .05em;
  padding: .62em 1.05em;
  transition: transform var(--dur-2) var(--ease-out-quint),
              border-color var(--dur-2) var(--ease-out-quint),
              background var(--dur-2) var(--ease-out-quint);
}
#origen .origen__chip.pill::before {
  background: var(--pasture-300);
  box-shadow: 0 0 0 4px color-mix(in oklab, var(--pasture-300) 24%, transparent);
}
#origen .origen__chip.pill:hover {
  transform: translateY(-2px);
  border-color: color-mix(in oklab, var(--gold-400) 60%, transparent);
  background: color-mix(in oklab, var(--pasture-300) 28%, rgba(20, 24, 12, .55));
}

/* ---- Vertical edge caption (decorative, large screens) ---- */
#origen .origen__caption {
  position: absolute;
  right: clamp(1rem, -1rem + 3vw, 2.2rem);
  bottom: clamp(2rem, 1rem + 4vw, 4rem);
  z-index: 2;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-family: var(--font-sans);
  font-size: var(--step--2);
  font-weight: 700;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: color-mix(in oklab, var(--on-dark) 70%, transparent);
}

@media (max-width: 980px) {
  #origen .origen__caption { display: none; }
}

@media (max-width: 640px) {
  #origen .origen__img { object-position: center 32%; }
  #origen .origen__content { max-width: 100%; }
  #origen .origen__title { font-size: var(--step-5); }
  #origen .origen__scrim {
    background:
      linear-gradient(
        to top,
        color-mix(in oklab, var(--dark-bg) 90%, transparent) 0%,
        color-mix(in oklab, var(--dark-bg) 62%, transparent) 55%,
        color-mix(in oklab, var(--dark-bg) 48%, transparent) 100%
      );
  }
}

@media (prefers-reduced-motion: reduce) {
  #origen .origen__img { transform: none; }
}