/* Original Design Scout direction: the statement becomes an optical cut, not another headline wall. */
.manifesto.manifesto-rebuild {
  --ink: #15171d;
  position: relative;
  z-index: 0;
  min-height: 100svh;
  padding: clamp(56px, 7.8vh, 94px) var(--page) clamp(40px, 5vh, 66px);
  display: grid;
  grid-template-columns: minmax(510px, .98fr) minmax(460px, .82fr);
  gap: clamp(50px, 9vw, 170px);
  align-items: center;
  overflow: hidden;
  isolation: isolate;
  background: #f3f0ea;
}
.manifesto-rebuild::before {
  content: '';
  position: absolute;
  z-index: -2;
  inset: 0;
  background:
    radial-gradient(ellipse 38% 55% at 84% 44%, rgba(249,157,80,.20), transparent 73%),
    radial-gradient(ellipse 28% 50% at 69% 72%, rgba(91,118,191,.17), transparent 72%),
    linear-gradient(112deg, #f7f5f1 0%, #efebe4 100%);
}
.manifesto-rebuild::after {
  content: 'PRAYTĒS';
  position: absolute;
  z-index: -1;
  left: calc(var(--page) - .06em);
  bottom: -0.14em;
  color: rgba(21,23,29,.035);
  font: 800 clamp(110px, 16.3vw, 285px)/.7 var(--sans);
  letter-spacing: -.12em;
  pointer-events: none;
}
.manifesto-rebuild-copy { position: relative; z-index: 2; align-self: center; }
.manifesto-rebuild h2 {
  width: min(100%, 690px);
  margin: 0;
  color: var(--ink);
  font-size: clamp(46px, 3.82vw, 64px);
  font-weight: 700;
  line-height: .98;
  letter-spacing: -.075em;
}
.manifesto-rebuild h2 span { display: block; max-width: none; }
.manifesto-rebuild h2 span:nth-child(2) { margin-left: clamp(18px,3vw,52px); }
.manifesto-rebuild h2 span:nth-child(3) { max-width: 14ch; margin-top: .23em; }
.manifesto-rebuild h2 span:nth-child(4) { max-width: 13ch; margin: .16em 0 0 clamp(18px,4.6vw,78px); }
.manifesto-rebuild h2 em { color: #dd6c2c; font-style: normal; }

.manifesto-optic {
  position: relative;
  justify-self: center;
  width: min(100%, 510px);
  aspect-ratio: 1 / .9;
  transform: perspective(1000px) rotateX(3deg) rotateY(-5deg);
  transform-style: preserve-3d;
}
.optic-shadow {
  position: absolute;
  left: 15%;
  right: 8%;
  bottom: 3%;
  height: 17%;
  border-radius: 50%;
  background: rgba(39,40,49,.26);
  filter: blur(30px);
  transform: rotate(-7deg);
}
.optic-plane {
  position: absolute;
  overflow: hidden;
  width: 68%;
  height: 48%;
  border: 1px solid rgba(255,255,255,.52);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.64), 0 24px 40px rgba(38,42,63,.10);
  backdrop-filter: blur(11px) saturate(1.25);
  -webkit-backdrop-filter: blur(11px) saturate(1.25);
  transform-style: preserve-3d;
}
.optic-plane::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .7;
  background: linear-gradient(118deg, rgba(255,255,255,.85), transparent 35%, rgba(255,255,255,.10) 65%, rgba(255,255,255,.58));
}
.optic-plane::after {
  content: '';
  position: absolute;
  width: 75%;
  height: 120%;
  top: -52%;
  left: -20%;
  border-radius: 47% 53% 52% 48% / 39% 52% 48% 61%;
  background: rgba(255,255,255,.42);
  filter: blur(18px);
  transform: rotate(-26deg);
}
.optic-plane i {
  position: absolute;
  z-index: 1;
  right: 18px;
  bottom: 14px;
  color: rgba(21,23,29,.52);
  font: 500 9px/1 var(--mono);
  font-style: normal;
  letter-spacing: .12em;
}
.optic-plane-one { top: 9%; left: 4%; border-radius: 42% 58% 42% 58% / 49% 38% 62% 51%; background: linear-gradient(135deg, rgba(95,132,213,.71), rgba(179,199,251,.35)); transform: translateZ(10px) rotate(-13deg); animation: optic-one 7s ease-in-out infinite alternate; }
.optic-plane-two { top: 2%; right: 0; border-radius: 56% 44% 58% 42% / 41% 59% 41% 59%; background: linear-gradient(135deg, rgba(255,184,105,.64), rgba(241,108,79,.31)); transform: translateZ(24px) rotate(14deg); animation: optic-two 8s ease-in-out infinite alternate; }
.optic-plane-three { bottom: 2%; left: 2%; border-radius: 53% 47% 39% 61% / 53% 43% 57% 47%; background: linear-gradient(145deg, rgba(207,75,103,.58), rgba(112,93,185,.34)); transform: translateZ(38px) rotate(8deg); animation: optic-three 9s ease-in-out infinite alternate; }
.optic-plane-four { right: 6%; bottom: 5%; border-radius: 42% 58% 53% 47% / 59% 44% 56% 41%; background: linear-gradient(130deg, rgba(221,104,45,.68), rgba(242,197,155,.29)); transform: translateZ(52px) rotate(-17deg); animation: optic-four 7.5s ease-in-out infinite alternate; }
.optic-core {
  position: absolute;
  z-index: 4;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 25%;
  aspect-ratio: 1;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  background: linear-gradient(138deg, #fff8e8 0%, #ed7331 44%, #c94155 74%, #5755ab 100%);
  box-shadow: 0 12px 24px rgba(61,43,67,.25), inset 5px 5px 13px rgba(255,255,255,.58), inset -7px -7px 15px rgba(73,32,68,.24);
  transform: translate3d(-50%,-50%,70px) rotate(45deg);
  animation: optic-core 8s ease-in-out infinite alternate;
}
.optic-core span { width: 32%; height: 32%; background: rgba(255,255,255,.72); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); filter: blur(1px); }
.optic-core b { position: absolute; inset: 13%; border: 1px solid rgba(255,255,255,.46); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.manifesto-rebuild:hover .optic-plane-one { animation-duration: 3.8s; }
.manifesto-rebuild:hover .optic-plane-two { animation-duration: 4.2s; }
.manifesto-rebuild:hover .optic-plane-three { animation-duration: 4.8s; }
.manifesto-rebuild:hover .optic-plane-four { animation-duration: 4s; }
@keyframes optic-one { to { transform: translate3d(20px,12px,17px) rotate(-6deg); } }
@keyframes optic-two { to { transform: translate3d(-13px,18px,34px) rotate(8deg); } }
@keyframes optic-three { to { transform: translate3d(19px,-13px,48px) rotate(2deg); } }
@keyframes optic-four { to { transform: translate3d(-16px,-17px,65px) rotate(-8deg); } }
@keyframes optic-core { to { transform: translate3d(-50%,-50%,88px) rotate(120deg) scale(1.12); } }
.manifesto-rebuild.is-inview .manifesto-rebuild-copy { animation: manifesto-copy-in .8s cubic-bezier(.2,.82,.2,1) both; }
@keyframes manifesto-copy-in { from { transform: translate3d(0,26px,0); } to { transform: none; } }

@media (max-width: 900px) {
  .manifesto.manifesto-rebuild { min-height: 0; padding: 92px 22px 72px; display: block; }
  .manifesto-rebuild h2 { font-size: clamp(45px, 11.6vw, 68px); }
  .manifesto-rebuild h2 span:nth-child(2), .manifesto-rebuild h2 span:nth-child(4) { margin-left: 0; }
  .manifesto-optic { width: min(100%, 430px); margin: 55px auto 0; }
}
@media (prefers-reduced-motion: reduce) {
  .optic-plane, .optic-core, .manifesto-rebuild.is-inview .manifesto-rebuild-copy { animation: none; }
}
