/* Scroll-led photo chapter and dimensional product stage. */
.pep-photo-journey {height:240svh;margin:15px 0 110px;position:relative;}
.pep-photo-journey .pep-photo-story {position:sticky;top:0;height:100svh;min-height:0;margin:0;overflow:clip;}
.pep-photo-story__expansion {position:absolute;z-index:3;overflow:hidden;pointer-events:none;border:var(--expand-border,3px) solid #fff;left:var(--expand-left,2.65%);top:var(--expand-top,13.5%);width:var(--expand-width,24.4%);height:var(--expand-height,24.4vw);opacity:var(--expand-visible,0);}
.pep-photo-story__expansion img {display:block;width:100%;height:100%;object-fit:cover;object-position:var(--expanded-position,50% 18%);}
.pep-photo-story__expansion::after {content:'';position:absolute;inset:0;background:linear-gradient(0deg,#0009,transparent 65%);opacity:var(--chapter-opacity,0);}
.pep-photo-story__chapter {position:absolute;z-index:4;inset:auto clamp(24px,3.5vw,64px) 7%;display:grid;grid-template-columns:1.5fr 1fr;align-items:end;gap:5vw;pointer-events:none;opacity:var(--chapter-opacity,0);transform:translateY(var(--chapter-y,35px));color:#fff;}
.pep-photo-story__chapter p:first-child {font-size:11px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:20px;}
.pep-photo-story__chapter h3 {font-family:Impact,'Arial Narrow',sans-serif;font-weight:400;font-size:clamp(70px,10vw,170px);line-height:.9;letter-spacing:-.025em;}
.pep-photo-story__chapter > p {font-size:clamp(15px,1.4vw,22px);line-height:1.5;max-width:30ch;padding-bottom:5px;}
.pep-photo-journey .pep-photo-story__eyebrow,.pep-photo-journey .pep-photo-story__title,.pep-photo-journey .pep-photo-story__controls {opacity:var(--scene-opacity,1);}
.pep-photo-journey .pep-photo-story__next-photo {opacity:var(--thumbnail-opacity,1);}
/* Each podium has a lit top, shaded side and a textured front. */
.pep-character-stage {min-height:clamp(780px,67vw,1080px);perspective:1500px;}
.pep-character-stage__three {font-size:clamp(700px,66vw,1050px);top:-.13em;transform:translateY(var(--numeral-y,0px));}
.pep-character-stage__pals {left:28%;right:3%;gap:0;perspective:1300px;}
.pep-character-pal {--depth:clamp(22px,2.6vw,42px);--roof:calc(var(--depth)*.57735);--step:clamp(140px,11vw,180px);height:var(--step);transform-style:preserve-3d;transform:translate3d(0,var(--pillar-y,0px),0) rotateY(var(--pillar-turn,0deg));transition:rotate .5s ease;}
.pep-character-pal--mango {--step:clamp(230px,19vw,305px);--pal-colour:#ff8424;}
.pep-character-pal--fire {--step:clamp(320px,27vw,430px);--pal-colour:#f13725;}
.pep-character-pal--joe {--pal-colour:#83cd37;}
.pep-character-pal figcaption {position:absolute;left:0;top:0;width:calc(100% - var(--depth));height:calc(100% + 180px);padding:clamp(24px,2.4vw,38px) clamp(14px,2vw,32px);background:linear-gradient(105deg,#ffffff12,#0000000d),var(--pal-colour);box-shadow:inset 1px 0 #ffffff26;}
.pep-character-pal figcaption::after {content:'';position:absolute;inset:0;pointer-events:none;opacity:.12;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23888' filter='url(%23n)' opacity='.8' d='M0 0h180v180H0z'/%3E%3C/svg%3E");}
.pep-character-pal__top {position:absolute;left:0;right:0;bottom:100%;height:var(--roof);background:linear-gradient(110deg,#ffffff65,#ffffff15),var(--pal-colour);clip-path:polygon(0 100%,var(--depth) 0,100% 0,calc(100% - var(--depth)) 100%);}
.pep-character-pal__side {position:absolute;right:0;top:0;width:var(--depth);height:calc(100% + 180px);background:linear-gradient(90deg,#00000024,#00000040),var(--pal-colour);transform:skewY(-30deg);transform-origin:left top;}
.pep-character-stage .pep-character-pal__art {bottom:calc(var(--step) + var(--roof)*.25);right:var(--depth);left:0;height:clamp(315px,30vw,470px);padding:0 2%;opacity:1;transform:none;transition:none;isolation:isolate;}
.pep-character-pal__art::before {content:'';position:absolute;z-index:-1;left:8%;right:0;bottom:-6px;height:15px;border-radius:50%;background:#17180ec4;filter:blur(6px);transform:scaleX(var(--shadow-scale,1));opacity:var(--shadow-opacity,.4);}
.pep-character-pal__bottle {width:57%;transform:translate3d(0,var(--bottle-y,0px),25px) rotate(var(--bottle-turn,0deg));transform-origin:center bottom;filter:drop-shadow(4px 6px 3px #0002);}
.pep-character-stage .pep-character-pal__mascot {width:43%;height:58%;transform:translate3d(0,var(--mascot-y,0px),45px) scale(2.05) rotate(var(--mascot-turn,-3deg));transition:none;filter:drop-shadow(2px 4px 1px #0002);}
.pep-character-pal__name {position:relative;z-index:1;font-family:Impact,'Arial Narrow',sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(23px,2.2vw,36px);}
.pep-character-pal__voice {position:relative;z-index:1;font-size:clamp(8px,.67vw,11px);letter-spacing:.11em;}
@media(max-width:1100px) and (min-width:701px){.pep-character-stage {min-height:800px;}.pep-character-stage__heading {left:33%;}.pep-character-stage__pals {left:27%;right:3%;}.pep-character-stage .pep-character-pal__art {height:310px;}.pep-character-pal__name {font-size:22px;}.pep-character-pal__voice {font-size:8px;letter-spacing:.02em;}.pep-character-pal figcaption {padding:24px 12px;}}
@media(max-width:700px){
 .pep-character-stage {min-height:0;perspective:900px;padding-bottom:0;}
 .pep-character-stage__three {font-size:245px;top:5px;}
 .pep-character-stage__pals {left:auto;right:auto;height:370px;margin:60px -10px 0;}
 .pep-character-pal {--depth:14px;--step:105px;}.pep-character-pal--mango {--step:150px;}.pep-character-pal--fire {--step:195px;}
 .pep-character-stage .pep-character-pal__art {height:170px;padding:0;}
 .pep-character-pal figcaption {padding:17px 8px;height:calc(100% + 90px);}
 .pep-character-pal__side {height:calc(100% + 90px);}
 .pep-character-pal__name {font-size:17px;}.pep-character-pal__voice {font-size:7px;letter-spacing:.01em;}
 .pep-photo-story__expansion img {object-position:var(--expanded-mobile-position,75% 50%);}
 .pep-photo-journey {height:225svh;margin-bottom:65px;}
 .pep-photo-story__chapter {display:block;bottom:7%;}
 .pep-photo-story__chapter h3 {font-size:clamp(64px,17vw,105px);}
 .pep-photo-story__chapter > p {font-size:14px;line-height:1.5;max-width:29ch;margin-top:26px;}
 .pep-photo-story__chapter p:first-child {font-size:9px;margin-bottom:15px;}
}
@media(prefers-reduced-motion:reduce){
 .pep-photo-journey {height:auto;}
 .pep-photo-journey .pep-photo-story {position:relative;height:100svh;min-height:600px;}
 .pep-photo-story__expansion,.pep-photo-story__chapter {display:none;}
 .pep-character-stage__three,.pep-character-pal,.pep-character-pal__bottle {transform:none!important;}
 .pep-character-stage .pep-character-pal__mascot {transform:scale(2.05)!important;}
}