/* Ocelot: parallax. Big outlined section words behind the headings (the hero is never touched).
   A firm outline with a faint fill, so they read clearly without competing with the heading in front of them. */

/* hidden first for older iPhones without clip, so a word sliding past the edge never makes the page scroll sideways */
.px-host{position:relative;overflow:hidden;overflow:clip}
.px-host>.wrap{position:relative;z-index:1}
.px-word{position:absolute;z-index:0;pointer-events:none;top:14px;left:50%;white-space:nowrap;
  font:700 clamp(110px,17vw,240px)/1 "Zilla Slab",Georgia,serif;letter-spacing:.02em;
  color:rgba(15,34,25,.04);-webkit-text-stroke:2px rgba(15,34,25,.24);will-change:transform}
.px-word.px-dark{color:rgba(224,166,75,.07);-webkit-text-stroke-color:rgba(224,166,75,.46)}
@media(max-width:760px){.px-word{top:10px;font-size:clamp(64px,20vw,120px);-webkit-text-stroke-width:1.6px}}