/* The pointer changes the illumination of the wave surface while the camera stays still. */
.hero-shade{background:radial-gradient(circle 250px at var(--light-x,50%) var(--light-y,48%),rgba(255,127,50,.23),transparent 72%),radial-gradient(circle 480px at var(--light-x,50%) var(--light-y,48%),rgba(255,83,18,.11),transparent 75%),linear-gradient(180deg,#08050344 0%,#08050388 24%,#0805038c 53%,#080503e8 91%,#080503 100%),radial-gradient(ellipse at 50% 35%,#08050377,transparent 70%)}
@media(max-width:680px){
  .footer{min-height:880px;background:linear-gradient(90deg,#080706 0%,#080706 50%,#170e09 100%)}
  .footer .brand-monument{position:absolute;top:0;right:0;left:auto;bottom:auto;display:flex;align-items:center;justify-content:center;width:50%;height:calc(100% - 74px);max-height:none;writing-mode:vertical-rl;text-orientation:mixed;transform:none;white-space:nowrap;font-size:clamp(130px,33vw,190px);line-height:1;letter-spacing:.07em;opacity:.65;overflow:hidden;background:linear-gradient(90deg,#b17e5f,#67402b);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
  .footer-bottom{position:relative;z-index:3;margin-top:35px}
  .steps{grid-template-columns:1fr}
  .service-grid>.service,.route-grid>.route-card,.deliverable-grid>article,.steps>article,.intro-points>div,.values>article,.contact-intro>.contact-option{position:sticky;top:82px;z-index:var(--stack-z,1);box-shadow:0 -10px 24px #08070622,0 15px 35px #08070620;margin-bottom:10px}
  .intro-points>div,.values>article{background:#fff;border-radius:14px;padding:22px}
  .steps>article{background:#fff}
}
@media(prefers-reduced-motion:reduce){.hero-shade{background:linear-gradient(180deg,#08050344,#080503e8)}}
.motion-paused .hero-shade{background:linear-gradient(180deg,#08050344,#080503e8)}
