/*
 * LHM-HYBRID-005 — private Founder review
 * Strictly scoped to the manuscript story and LHOS sanctuary.
 */

.hybrid-005-review .manuscript-story {
  --preservation-opacity: 1;
  --preservation-material: 1;
  --atelier-opacity: 0;
  --atelier-reveal: 0;
  --transformation: 0;
  position: relative;
  height: 230svh;
  min-height: 1500px;
  overflow: clip;
  isolation: isolate;
  background: #b7aa84;
  color: #26391f;
}

.hybrid-005-review .manuscript-stage {
  position: sticky;
  top: 0;
  height: 100svh;
  min-height: 700px;
  overflow: hidden;
  isolation: isolate;
}

.hybrid-005-review .manuscript-wall,
.hybrid-005-review .manuscript-sheet {
  display: block;
  width: 100%;
  height: 100%;
}

.hybrid-005-review .manuscript-wall {
  position: absolute;
  inset: 0;
  z-index: -4;
  object-fit: cover;
  object-position: center;
}

.hybrid-005-review .manuscript-light {
  position: absolute;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(250, 238, 197, .12), transparent 48%, rgba(255, 245, 188, .18)),
    radial-gradient(ellipse at 77% 30%, rgba(255, 241, 171, .22), transparent 34%);
  mix-blend-mode: screen;
}

.hybrid-005-review .manuscript-state {
  position: absolute;
  top: 50%;
  left: clamp(2.5vw, 5vw, 90px);
  width: min(72vw, 1120px);
  aspect-ratio: 16 / 9;
  transform: translateY(-50%);
  transform-origin: 50% 45%;
}

.hybrid-005-review .manuscript-sheet {
  position: absolute;
  inset: 0;
  object-fit: contain;
  filter: drop-shadow(0 24px 34px rgba(25, 28, 13, .3));
  user-select: none;
}

.hybrid-005-review .manuscript-state--preservation {
  z-index: 3;
  opacity: var(--preservation-opacity);
  filter: blur(calc((1 - var(--preservation-material)) * 3px));
  transform: translateY(-50%) scale(calc(.985 + var(--preservation-material) * .015));
}

.hybrid-005-review .manuscript-state--preservation .manuscript-sheet {
  clip-path: polygon(
    calc((1 - var(--preservation-material)) * 48%) 0,
    calc(100% - (1 - var(--preservation-material)) * 44%) 0,
    calc(100% - (1 - var(--preservation-material)) * 50%) 100%,
    calc((1 - var(--preservation-material)) * 46%) 100%
  );
}

.hybrid-005-review .manuscript-state--atelier {
  z-index: 2;
  opacity: var(--atelier-opacity);
  transform: translateY(-50%) scale(calc(.975 + var(--atelier-reveal) * .025));
}

.hybrid-005-review .manuscript-state--atelier .manuscript-sheet {
  clip-path: inset(calc((1 - var(--atelier-reveal)) * 49%) calc((1 - var(--atelier-reveal)) * 48%));
  filter:
    drop-shadow(0 24px 34px rgba(25, 28, 13, .3))
    brightness(calc(.82 + var(--atelier-reveal) * .18));
}

.hybrid-005-review .manuscript-copy {
  position: absolute;
  inset: 0;
  z-index: 2;
  color: #2b3c25;
  text-shadow: 0 1px rgba(255, 251, 230, .52);
}

.hybrid-005-review .manuscript-copy .kicker {
  margin: 0 0 5px;
  color: #738544;
  font-size: clamp(.62rem, .65vw, .76rem);
  letter-spacing: .16em;
}

.hybrid-005-review .manuscript-copy h2 {
  margin: 0;
  color: #41562f;
  font-size: clamp(1.55rem, 2.35vw, 2.8rem);
  line-height: .98;
}

.hybrid-005-review .manuscript-copy h3 {
  margin: 2px 0 4px;
  color: #3f552e;
  font: 600 clamp(.76rem, .88vw, 1.04rem)/1.1 var(--sans);
  letter-spacing: .03em;
}

.hybrid-005-review .manuscript-copy p {
  color: #31422a;
}

.hybrid-005-review .manuscript-copy--preservation {
  padding: 6.8% 9% 8.5%;
}

.hybrid-005-review .manuscript-copy--preservation > header {
  width: 68%;
  margin: 0 auto;
  text-align: center;
}

.hybrid-005-review .manuscript-copy--preservation > header > p:last-child {
  max-width: 600px;
  margin: 7px auto 0;
  font-size: clamp(.67rem, .77vw, .9rem);
  line-height: 1.38;
}

.hybrid-005-review .manuscript-values {
  position: absolute;
  inset: 33% 8.3% 10%;
  display: grid;
  grid-template: 1fr 1fr / 1fr 1fr;
  column-gap: 24%;
  row-gap: 6%;
}

.hybrid-005-review .manuscript-values article {
  position: relative;
  padding: 4.8% 5% 3% 15%;
}

.hybrid-005-review .manuscript-values article > span {
  position: absolute;
  top: 15%;
  left: 4%;
  color: #aa7a28;
  font: 500 clamp(.65rem, .75vw, .86rem)/1 var(--serif);
}

.hybrid-005-review .manuscript-values p {
  margin: 0;
  font-size: clamp(.68rem, .72vw, .83rem);
  line-height: 1.36;
}

.hybrid-005-review .manuscript-copy--atelier {
  padding: 7.8% 8.5% 8%;
}

.hybrid-005-review .manuscript-copy--atelier > header {
  width: 48%;
}

.hybrid-005-review .manuscript-copy--atelier > header h2 {
  font-size: clamp(1.38rem, 2.05vw, 2.42rem);
}

.hybrid-005-review .manuscript-copy--atelier > header > p:last-child {
  margin: 9px 0 0;
  font-size: clamp(.61rem, .69vw, .81rem);
  line-height: 1.4;
}

.hybrid-005-review .manuscript-copy--atelier .atelier-principle {
  position: absolute;
  top: 51%;
  left: 9%;
  width: 42%;
  margin: 0;
  color: #53683c !important;
  font: italic 500 clamp(.67rem, .78vw, .9rem)/1.35 var(--serif);
}

.hybrid-005-review .manuscript-copy--atelier dl {
  position: absolute;
  right: 8.5%;
  bottom: 8%;
  left: 8.5%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2%;
  margin: 0;
}

.hybrid-005-review .manuscript-copy--atelier dl > div {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6% 7%;
}

.hybrid-005-review .manuscript-copy--atelier dt {
  color: #a87824;
  font: 500 clamp(.62rem, .7vw, .8rem)/1 var(--serif);
}

.hybrid-005-review .manuscript-copy--atelier dd {
  margin: 0;
  color: #3a4d2d;
  font-size: clamp(.62rem, .72vw, .84rem);
}

.hybrid-005-review .manuscript-copy--atelier .text-link {
  position: absolute;
  right: 10%;
  top: 46%;
  min-height: 40px;
  padding: 10px 14px;
  border-color: rgba(129, 96, 39, .45);
  color: #40552f;
  font-size: clamp(.58rem, .66vw, .76rem);
}

.hybrid-005-review .manuscript-state--preservation .manuscript-copy {
  opacity: var(--preservation-opacity);
  transform: translateY(calc((1 - var(--preservation-material)) * -10px));
}

.hybrid-005-review .manuscript-state--atelier .manuscript-copy {
  opacity: var(--atelier-reveal);
  transform: translateY(calc((1 - var(--atelier-reveal)) * 10px));
}

.hybrid-005-review .manuscript-particles {
  position: absolute;
  top: 50%;
  left: calc(clamp(2.5vw, 5vw, 90px) + min(36vw, 560px));
  z-index: 5;
  width: min(66vw, 1000px);
  height: min(45vw, 670px);
  transform: translate(-50%, -50%);
  opacity: calc(var(--transformation) * 1.5);
  pointer-events: none;
}

.hybrid-005-review .manuscript-particles i {
  --dx: 210px;
  --dy: -130px;
  --size: 4px;
  position: absolute;
  top: var(--y, 50%);
  left: var(--x, 50%);
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  background: #bfe991;
  box-shadow: 0 0 10px 3px rgba(126, 195, 94, .78), 0 0 19px rgba(238, 196, 92, .58);
  opacity: calc(var(--transformation) * .9);
  transform: translate(
    calc((var(--transformation) - .5) * var(--dx)),
    calc((var(--transformation) - .5) * var(--dy))
  ) scale(calc(.55 + var(--transformation)));
}

.hybrid-005-review .manuscript-particles i::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 2px;
  width: clamp(10px, 1.6vw, 24px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(184, 224, 117, .66));
  transform: translateY(-50%);
  filter: blur(.2px);
}

.hybrid-005-review .manuscript-particles i:nth-child(1) { --x: 16%; --y: 25%; --dx: -210px; --dy: -90px; --size: 3px; }
.hybrid-005-review .manuscript-particles i:nth-child(2) { --x: 27%; --y: 68%; --dx: -150px; --dy: 110px; --size: 5px; }
.hybrid-005-review .manuscript-particles i:nth-child(3) { --x: 39%; --y: 38%; --dx: -90px; --dy: -160px; --size: 2px; }
.hybrid-005-review .manuscript-particles i:nth-child(4) { --x: 47%; --y: 78%; --dx: -20px; --dy: 135px; --size: 4px; }
.hybrid-005-review .manuscript-particles i:nth-child(5) { --x: 55%; --y: 22%; --dx: 60px; --dy: -150px; --size: 3px; }
.hybrid-005-review .manuscript-particles i:nth-child(6) { --x: 64%; --y: 55%; --dx: 120px; --dy: 40px; --size: 5px; }
.hybrid-005-review .manuscript-particles i:nth-child(7) { --x: 73%; --y: 31%; --dx: 190px; --dy: -100px; --size: 3px; }
.hybrid-005-review .manuscript-particles i:nth-child(8) { --x: 82%; --y: 72%; --dx: 230px; --dy: 120px; --size: 2px; }
.hybrid-005-review .manuscript-particles i:nth-child(9) { --x: 21%; --y: 49%; --dx: -180px; --dy: 10px; --size: 2px; }
.hybrid-005-review .manuscript-particles i:nth-child(10) { --x: 45%; --y: 15%; --dx: -35px; --dy: -190px; --size: 4px; }
.hybrid-005-review .manuscript-particles i:nth-child(11) { --x: 68%; --y: 82%; --dx: 150px; --dy: 170px; --size: 3px; }
.hybrid-005-review .manuscript-particles i:nth-child(12) { --x: 89%; --y: 42%; --dx: 260px; --dy: -20px; --size: 4px; }

.hybrid-005-review .manuscript-progress {
  position: absolute;
  right: 28px;
  bottom: 28px;
  z-index: 6;
  display: flex;
  gap: 8px;
}

.hybrid-005-review .manuscript-progress span {
  width: 26px;
  height: 2px;
  background: rgba(255, 245, 197, .45);
}

.hybrid-005-review .manuscript-progress span:first-child {
  background: color-mix(in srgb, #d6a24a calc(var(--preservation-opacity) * 100%), rgba(255, 245, 197, .35));
}

.hybrid-005-review .manuscript-progress span:last-child {
  background: color-mix(in srgb, #d6a24a calc(var(--atelier-opacity) * 100%), rgba(255, 245, 197, .35));
}

/* LHOS: the existing orbit remains untouched; only its sanctuary and placement change. */
.hybrid-005-review .lhos {
  min-height: auto;
  padding: clamp(64px, 7vw, 100px) clamp(18px, 3vw, 54px) clamp(55px, 6vw, 90px);
  background: #163323;
}

.hybrid-005-review .lhos::after {
  display: none;
}

.hybrid-005-review .lhos .lhos-intro {
  position: relative;
  z-index: 4;
  max-width: 560px;
  margin: 0 auto 20px;
}

.hybrid-005-review .lhos .lhos-intro h2 {
  font-size: clamp(1.7rem, 2.6vw, 3.25rem);
  line-height: 1;
}

.hybrid-005-review .lhos .lhos-intro > p:last-child {
  margin-top: 9px;
  font-size: clamp(.8rem, .9vw, 1rem);
}

.hybrid-005-review .lhos-sanctuary-stage {
  position: relative;
  width: min(1500px, 100%);
  aspect-ratio: 16 / 9;
  min-height: 620px;
  margin: 0 auto;
  overflow: hidden;
  isolation: isolate;
}

.hybrid-005-review .lhos-sanctuary-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(6, 31, 22, .25), transparent 22% 78%, rgba(6, 31, 22, .25)),
    linear-gradient(0deg, rgba(5, 28, 19, .22), transparent 30%);
}

.hybrid-005-review .lhos-sanctuary-stage .lhos-forest {
  inset: 0;
  z-index: -2;
  object-position: 50% 50%;
}

.hybrid-005-review .lhos-sanctuary-stage .lhos-layout {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0 2.5%;
  grid-template-columns: minmax(190px, 1fr) minmax(440px, 34vw) minmax(190px, 1fr);
  transform: translateY(-2.8%);
}

.hybrid-005-review .lhos-sanctuary-stage .orbit {
  width: min(34vw, 570px);
  max-width: 100%;
}

.hybrid-005-review .lhos-sanctuary-stage .assignment-map {
  opacity: .34;
}

.hybrid-005-review .lhos-sanctuary-stage .lhos-notes article {
  background: rgba(17, 48, 34, .72);
  border-color: rgba(207, 169, 78, .45);
  box-shadow: 0 10px 28px rgba(4, 25, 17, .18);
  backdrop-filter: blur(6px);
}

.hybrid-005-review .lhos-sanctuary-stage .lhos-notes p,
.hybrid-005-review .lhos-sanctuary-stage .lhos-notes h3 {
  text-shadow: 0 1px 2px rgba(0, 17, 10, .72);
}

.hybrid-005-review .lhos-sanctuary-glow {
  inset: 0;
  z-index: 1;
  overflow: hidden;
}

.hybrid-005-review .lhos-sanctuary-glow i {
  background: #c7ef9a;
  box-shadow: 0 0 12px 3px rgba(128, 213, 103, .62), 0 0 24px rgba(230, 187, 82, .36);
  opacity: .35;
  animation-duration: 8s;
}

@media (max-width: 1100px) {
  .hybrid-005-review .manuscript-state {
    left: 1vw;
    width: 78vw;
  }

  .hybrid-005-review .manuscript-copy--preservation {
    padding-inline: 8%;
  }

  .hybrid-005-review .manuscript-values {
    inset-inline: 7%;
    column-gap: 23%;
  }

  .hybrid-005-review .lhos-sanctuary-stage {
    min-height: 590px;
  }

  .hybrid-005-review .lhos-sanctuary-stage .lhos-layout {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) minmax(390px, 43vw) minmax(160px, 1fr);
    padding-inline: 1.5%;
  }

  .hybrid-005-review .lhos-sanctuary-stage .orbit {
    width: min(43vw, 500px);
  }

  .hybrid-005-review .lhos-sanctuary-stage .lhos-notes article {
    padding: 10px;
  }
}

@media (max-width: 850px) {
  .hybrid-005-review .manuscript-story {
    height: auto;
    min-height: 0;
    overflow: hidden;
    background:
      linear-gradient(rgba(237, 224, 184, .12), rgba(172, 156, 111, .25)),
      url("assets/stonewall-workshop-005.webp") 72% top / auto 100svh fixed;
  }

  .hybrid-005-review .manuscript-stage {
    position: relative;
    height: auto;
    min-height: 0;
    overflow: visible;
    padding: 72px 10px;
  }

  .hybrid-005-review .manuscript-wall {
    display: none;
  }

  .hybrid-005-review .manuscript-light {
    position: absolute;
    background: linear-gradient(rgba(255, 246, 209, .16), rgba(255, 248, 221, .06));
  }

  .hybrid-005-review .manuscript-state {
    position: relative;
    top: auto;
    left: auto;
    width: min(760px, 100%);
    min-height: clamp(620px, 152vw, 920px);
    margin: 0 auto 46px;
    aspect-ratio: auto;
    opacity: 1;
    filter: none;
    transform: none;
  }

  .hybrid-005-review .manuscript-state--atelier {
    margin-bottom: 0;
    scroll-margin-top: 74px;
  }

  .hybrid-005-review .manuscript-sheet,
  .hybrid-005-review .manuscript-state--preservation .manuscript-sheet,
  .hybrid-005-review .manuscript-state--atelier .manuscript-sheet {
    position: absolute;
    inset: 0;
    object-fit: fill;
    clip-path: none;
    filter: drop-shadow(0 18px 25px rgba(25, 28, 13, .28));
  }

  .hybrid-005-review .manuscript-copy,
  .hybrid-005-review .manuscript-state--preservation .manuscript-copy,
  .hybrid-005-review .manuscript-state--atelier .manuscript-copy {
    position: relative;
    min-height: inherit;
    opacity: 1;
    transform: none;
  }

  .hybrid-005-review .manuscript-copy .kicker {
    font-size: .62rem;
  }

  .hybrid-005-review .manuscript-copy h2 {
    font-size: clamp(1.45rem, 7vw, 2.25rem);
  }

  .hybrid-005-review .manuscript-copy--preservation {
    padding: 9% 11% 10%;
  }

  .hybrid-005-review .manuscript-copy--preservation > header {
    width: 100%;
  }

  .hybrid-005-review .manuscript-copy--preservation > header > p:last-child {
    font-size: .74rem;
  }

  .hybrid-005-review .manuscript-values {
    position: relative;
    inset: auto;
    grid-template-columns: 1fr;
    gap: 7px;
    margin-top: 8%;
  }

  .hybrid-005-review .manuscript-values article {
    min-height: 95px;
    padding: 14px 14px 12px 50px;
    background: rgba(247, 235, 191, .34);
    border: 1px solid rgba(93, 117, 56, .2);
  }

  .hybrid-005-review .manuscript-values article > span {
    top: 19px;
    left: 15px;
    font-size: .72rem;
  }

  .hybrid-005-review .manuscript-values h3 {
    font-size: .9rem;
  }

  .hybrid-005-review .manuscript-values p {
    font-size: .74rem;
  }

  .hybrid-005-review .manuscript-copy--atelier {
    padding: 10% 11%;
  }

  .hybrid-005-review .manuscript-copy--atelier > header {
    width: 100%;
  }

  .hybrid-005-review .manuscript-copy--atelier > header > p:last-child {
    padding: 12px;
    background: rgba(247, 235, 191, .36);
    font-size: .74rem;
  }

  .hybrid-005-review .manuscript-copy--atelier .atelier-principle {
    position: relative;
    top: auto;
    left: auto;
    width: auto;
    margin: 12px 0;
    padding: 12px;
    font-size: .78rem;
  }

  .hybrid-005-review .manuscript-copy--atelier dl {
    position: relative;
    inset: auto;
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .hybrid-005-review .manuscript-copy--atelier dl > div {
    padding: 13px;
    background: rgba(247, 235, 191, .36);
    border: 1px solid rgba(93, 117, 56, .2);
  }

  .hybrid-005-review .manuscript-copy--atelier dt,
  .hybrid-005-review .manuscript-copy--atelier dd {
    font-size: .76rem;
  }

  .hybrid-005-review .manuscript-copy--atelier .text-link {
    position: relative;
    top: auto;
    right: auto;
    display: inline-flex;
    margin-top: 14px;
    font-size: .68rem;
  }

  .hybrid-005-review .manuscript-particles,
  .hybrid-005-review .manuscript-progress {
    display: none;
  }

  .hybrid-005-review .lhos {
    padding: 60px 14px 64px;
  }

  .hybrid-005-review .lhos .lhos-intro {
    margin-bottom: 12px;
  }

  .hybrid-005-review .lhos .lhos-intro h2 {
    font-size: clamp(1.7rem, 8vw, 2.5rem);
  }

  .hybrid-005-review .lhos-sanctuary-stage {
    width: 100%;
    min-height: 0;
    aspect-ratio: auto;
    overflow: visible;
    padding-top: calc(100vw - 28px);
  }

  .hybrid-005-review .lhos-sanctuary-stage .lhos-forest {
    top: 0;
    right: 0;
    bottom: auto;
    left: 0;
    width: 100%;
    height: calc(100vw - 28px);
    object-fit: cover;
    object-position: center;
  }

  .hybrid-005-review .lhos-sanctuary-stage::after {
    bottom: auto;
    height: calc(100vw - 28px);
    background: radial-gradient(circle, transparent 52%, rgba(6, 31, 22, .24));
  }

  .hybrid-005-review .lhos-sanctuary-stage .lhos-layout {
    position: static;
    display: block;
    height: auto;
    padding: 24px 0 0;
    transform: none;
  }

  .hybrid-005-review .lhos-sanctuary-stage .orbit {
    position: absolute;
    top: calc((100vw - 28px) / 2);
    left: 50%;
    width: min(68vw, 500px);
    max-width: calc(100vw - 52px);
    transform: translate(-50%, -50%);
  }

  .hybrid-005-review .lhos-sanctuary-stage .lhos-notes {
    display: grid;
    gap: 10px;
    margin-top: 0;
  }

  .hybrid-005-review .lhos-sanctuary-stage .lhos-notes + .orbit + .lhos-notes {
    margin-top: 10px;
  }

  .hybrid-005-review .lhos-sanctuary-stage .assignment-map {
    display: none;
  }

  .hybrid-005-review .lhos-sanctuary-glow {
    height: calc(100vw - 28px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hybrid-005-review .manuscript-state,
  .hybrid-005-review .manuscript-sheet,
  .hybrid-005-review .manuscript-copy {
    transition: none !important;
  }

  .hybrid-005-review .manuscript-particles {
    display: none;
  }

  .hybrid-005-review .lhos-sanctuary-glow i {
    animation: none !important;
    opacity: .25;
  }
}
