body[data-story=jam]{--ex-ink:#50180f;--ex-paper:#fff0d9;--ex-accent:#dd3d2a;overflow-x:clip}
.jam-stage{background:#dc382c;color:#fff0d9;padding:30px 5% 65px;min-height:0}
.jam-wordmark{position:relative;border-bottom:1px solid #fff0d970;padding-bottom:24px;margin-bottom:35px}
.jam-stage .jam-wordmark h1{font:900 italic clamp(130px,29vw,440px)/.96 Georgia,serif;letter-spacing:-.09em;margin:10px 0 0 -.035em}
.jam-wordmark h1 span{display:inline-block;font:normal .5em Georgia;letter-spacing:0;vertical-align:middle;transform:rotate(calc(-15deg + var(--section-progress,.3)*50deg));margin-left:.13em}
.jam-sticker{position:absolute;right:1%;bottom:20%;border:2px solid #50180f;background:#f0abc2;color:#50180f;border-radius:50%;width:128px;height:128px;display:grid;place-content:center;text-align:center;font:12px/1.6 Mono,monospace;transform:rotate(calc(18deg - var(--section-progress,.3)*45deg));box-shadow:5px 6px 0 #50180f}
.jam-hero-lower{display:grid;grid-template-columns:1.1fr 1fr;gap:5%;align-items:center}
.jam-product{position:relative;overflow:hidden;aspect-ratio:1.45;border-radius:2px}
.jam-product img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.08) translateY(calc((var(--section-progress,.3) - .3)*-35px))}
.jam-product figcaption{position:absolute;bottom:18px;left:18px;background:#fff0d9;color:#50180f;padding:10px;font:9px Mono,monospace}
.jam-stage .hero-caption{display:block}.jam-stage .hero-caption h2{font:clamp(28px,3.5vw,54px)/1.1 Inter,sans-serif;letter-spacing:-.055em}.jam-stage .hero-caption h2 em{font:italic 1.12em Georgia,serif;letter-spacing:-.04em}
.jam-stage .hero-caption p{max-width:470px;margin:20px 0;font-size:14px;line-height:1.75}
.jam-frequency{height:45px;display:flex;align-items:center;gap:4px;margin:25px 0}.jam-frequency i{height:calc(var(--beat)*100%);width:5px;border-radius:9px;background:currentColor;animation:jam-beat 1.3s ease-in-out infinite alternate;animation-delay:calc(var(--bar)*-87ms)}
.jam-down{font:10px Mono,monospace;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:6px}
.jam-sharing{background:#fff0d9;color:#50180f;padding:90px 6% 40px;display:grid;grid-template-columns:.85fr 1.15fr;gap:30px 6%;overflow:hidden}
.jam-sharing h2{font:clamp(44px,5.5vw,85px)/1.04 Display,sans-serif;text-transform:uppercase;margin:25px 0}.jam-sharing h2 em{font:italic .85em Georgia,serif;text-transform:none;letter-spacing:-.055em}.jam-sharing p{font-size:16px;line-height:1.7;max-width:380px}
.jam-pass{margin-top:30px;border:1px solid currentColor;background:#dc382c;color:#fff0d9;border-radius:100px;padding:17px 23px;display:flex;gap:35px;align-items:center;font:11px Mono,monospace}.jam-pass span{font-size:25px;line-height:.8}
.jam-slices{position:relative;min-width:0;height:410px;display:grid;place-items:center}
.jam-sound-ring{position:absolute;border:1px solid #dc382c70;width:90%;aspect-ratio:1;border-radius:50%;box-shadow:0 0 0 25px #dc382c08,0 0 0 55px #dc382c05;transform:scale(calc(.8 + var(--section-progress,.4)*.3))}
.jam-slice-card{position:absolute;left:50%;top:50%;width:48%;background:#fff;box-shadow:5px 8px 18px #50180f20;border:1px solid #50180f30;padding:10px;transform:translate(calc(-50% + (var(--slice) - 1)*17%),calc(-50% + (var(--slice) - 1)*-7%)) rotate(calc((var(--slice) - 1)*5deg));transition:transform .9s cubic-bezier(.22,1,.36,1)}
.jam-slice-card img{width:100%;height:auto}.jam-slice-card figcaption{font:8px Mono,monospace;color:#50180f;padding:12px 2px 5px;white-space:nowrap}
.jam-sharing.is-passed .jam-slice-card{transform:translate(calc(-50% + (var(--slice) - 1)*73%),calc(-50% + (var(--slice) - 1)*-15%)) rotate(calc((var(--slice) - 1)*-13deg))}
.jam-sharing-note{grid-column:1/-1;max-width:none!important;border-top:1px solid #50180f40;padding-top:20px;font:10px/1.7 Mono,monospace!important}
body[data-story=jam] .chapter{padding-top:110px;padding-bottom:110px}body[data-story=jam] .chapter h2{font:italic clamp(44px,6.6vw,100px)/1.03 Georgia,serif;text-transform:none;letter-spacing:-.06em}.jam-stage+.chapter{background:#fff0d9}
body[data-story=jam] .story-panels{gap:3%}body[data-story=jam] .story-panels figure{background:#f9e7d2;padding:12px 12px 0;transform:rotate(calc((var(--section-progress,.5) - .5)*-6deg))}body[data-story=jam] .story-panels figure:nth-child(2){background:#f1bbc9;transform:rotate(calc((var(--section-progress,.5) - .5)*8deg));margin-top:40px}
body[data-story=jam] .quote{overflow:hidden}body[data-story=jam] .quote p{transform:translateX(calc((var(--section-progress,.5) - .5)*35px))}
body[data-story=jam] .flavours{transition:background .7s ease,color .7s ease;background:#321d19}body[data-story=jam] .flavours[data-selected-flavour=strawberry]{background:#883142}body[data-story=jam] .flavours[data-selected-flavour=vanilla]{background:#e5c590;color:#3c2619}body[data-story=jam] .flavours[data-selected-flavour=vanilla] .label,body[data-story=jam] .flavours[data-selected-flavour=vanilla] h3{color:#8c301c}body[data-story=jam] .flavours[data-selected-flavour=vanilla] .flavour-buttons button{border-color:#3c2619}
body[data-story=jam] .flavour-photo{transform:rotate(calc(-7deg + var(--section-progress,.4)*10deg));border-radius:2px}body[data-story=jam] .details-grid figure:nth-child(even){margin-top:70px}body[data-story=jam] .details-grid img{border-radius:50% 50% 3px 3px}body[data-story=jam] .outro h2{font:italic clamp(45px,6vw,90px)/1 Georgia,serif;text-transform:none}
@keyframes jam-beat{to{transform:scaleY(.3)}}
.experience-reduced .jam-wordmark h1 span,.experience-reduced .jam-sticker,.experience-reduced .jam-product img,.experience-reduced .story-panels figure,.experience-reduced .quote p,.experience-reduced .flavour-photo{transform:none!important}
@media(max-width:760px){.jam-stage{padding:25px 6% 45px}.jam-stage .jam-wordmark h1{font-size:31vw;margin:25px 0 10px}.jam-sticker{width:72px;height:72px;right:0;bottom:30%;font-size:8px;box-shadow:3px 4px 0 #50180f}.jam-wordmark h1 span{font-size:.33em;margin-left:.08em}.jam-hero-lower{grid-template-columns:1fr;gap:28px}.jam-stage .hero-caption h2{font-size:39px}.jam-stage .hero-caption p{font-size:13px}.jam-frequency{height:30px}.jam-sharing{padding:65px 6% 30px;grid-template-columns:1fr;gap:20px}.jam-sharing h2{font-size:13vw}.jam-slices{height:340px}.jam-sharing-note{font-size:8px!important}.jam-slice-card{width:46%}.jam-slice-card figcaption{font-size:6px;letter-spacing:-.03em}.jam-sharing.is-passed .jam-slice-card{transform:translate(calc(-50% + (var(--slice) - 1)*65%),calc(-50% + (var(--slice) - 1)*-13%)) rotate(calc((var(--slice) - 1)*-12deg))}body[data-story=jam] .chapter{padding-top:65px;padding-bottom:65px}body[data-story=jam] .chapter h2{font-size:13vw}body[data-story=jam] .story-panels figure:nth-child(2),body[data-story=jam] .details-grid figure:nth-child(even){margin-top:0}.jam-product figcaption{font-size:7px;left:10px;bottom:10px}}
@media(max-width:760px){.jam-wordmark h1 span{display:none}}

/* Additional archive views: chocolate macro and a two-flavour detail duet. */
.jam-archive{position:relative;isolation:isolate;overflow:hidden}.jam-archive figure{margin:0}.jam-archive a{display:block}.jam-archive img{width:100%;height:100%;object-fit:cover}.jam-close-image{position:relative;height:clamp(380px,69vw,850px);overflow:hidden}.jam-close-image>a{height:100%}.jam-close-image img{object-position:50% 47%}.jam-ambient-waves{position:absolute;width:60%;aspect-ratio:1;right:-26%;bottom:-33%;border:1px solid #fff0d93b;border-radius:50%;box-shadow:0 0 0 35px #fff0d910,0 0 0 80px #fff0d908;pointer-events:none;animation:jam-breathe 8s ease-in-out infinite alternate}
.jam-archive-closeup{background:#3d201a;color:#fff0d9}.jam-archive-closeup figcaption{display:grid;grid-template-columns:1fr 1fr;gap:8%;padding:55px 6% 65px;align-items:end}.jam-archive h2{font:italic clamp(42px,6vw,88px)/1.03 Georgia,serif;letter-spacing:-.05em}.jam-archive h2 em{font-weight:normal}.jam-archive .label{display:block;font:9px Mono;margin-bottom:25px}.jam-archive p{font:15px/1.75 Inter,sans-serif;max-width:500px}.jam-archive small{display:block;font:9px/1.6 Mono;margin-top:25px;opacity:.8}
.jam-detail-duet{background:#efbac5;color:#50180f;padding:85px 6%}.jam-duet-heading{position:relative;max-width:750px;margin-bottom:50px}.jam-duet-heading p{margin-top:25px}.jam-duet-pictures{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:4%}.jam-duet-pictures figure:nth-child(2){margin-top:90px}.jam-duet-pictures a{aspect-ratio:1;overflow:hidden}.jam-duet-pictures img{object-position:54% 50%;transform:scale(1.1)}.jam-duet-pictures figcaption{font:10px/1.6 Mono;margin-top:17px;border-top:1px solid #50180f60;padding-top:14px}.jam-ambient-score{position:absolute;right:7%;top:20px;font:260px Georgia;color:#50180f0d;pointer-events:none;animation:jam-note-drift 12s ease-in-out infinite alternate}.jam-ambient-score span{display:inline-block;font-size:.5em;transform:translateY(50px)}
@keyframes jam-breathe{to{transform:scale(1.14);opacity:.35}}@keyframes jam-note-drift{to{transform:translate(-15px,25px) rotate(7deg)}}
@media(max-width:650px){.jam-close-image{height:65svh;min-height:370px}.jam-close-image img{object-position:56% 50%}.jam-archive-closeup figcaption{grid-template-columns:1fr;gap:25px;padding:38px 6% 45px}.jam-archive h2{font-size:47px}.jam-archive p{font-size:14px}.jam-detail-duet{padding:60px 6%}.jam-duet-pictures{grid-template-columns:1fr;gap:30px}.jam-duet-pictures figure:nth-child(2){margin-top:0}.jam-ambient-score{right:-12%;font-size:220px}}

/* The modules live directly in the page, free of their studio backdrops. */
.jam-sharing{grid-template-columns:.7fr 1.3fr;align-items:center}
.jam-slices{height:clamp(430px,47vw,720px)}
.jam-slice-card{width:49%;padding:0;border:0;background:none;box-shadow:none;filter:drop-shadow(0 22px 15px #50180f24)}
.jam-slice-card img{display:block;width:100%;height:auto;max-height:640px;object-fit:contain}
.jam-sharing.is-passed .jam-slice-card{transform:translate(calc(-50% + (var(--slice) - 1)*66%),calc(-50% + (var(--slice) - 1)*-11%)) rotate(calc((var(--slice) - 1)*-10deg))}
body[data-story=jam] .flavours{padding-block:0;overflow:hidden}
body[data-story=jam] .flavour-grid{grid-template-columns:.85fr 1.15fr;align-items:center;gap:3%}
body[data-story=jam] .flavour-grid>div{padding-block:90px;position:relative;z-index:2}
body[data-story=jam] .flavour-photo{background:none;border:0;box-shadow:none;padding:0;transform:none;overflow:visible;align-self:stretch;display:grid;place-items:center;min-height:700px}
body[data-story=jam] #flavour-image{width:115%;max-width:none;height:clamp(700px,70vw,1000px);object-fit:contain;filter:drop-shadow(0 25px 25px #1d090936)}
@media(max-width:760px){.jam-sharing{grid-template-columns:1fr}.jam-slices{height:450px;margin-inline:-3%}.jam-slice-card{width:48%}.jam-sharing.is-passed .jam-slice-card{transform:translate(calc(-50% + (var(--slice) - 1)*62%),calc(-50% + (var(--slice) - 1)*-10%)) rotate(calc((var(--slice) - 1)*-8deg))}body[data-story=jam] .flavour-grid{grid-template-columns:1fr;gap:0}body[data-story=jam] .flavour-grid>div{padding:60px 0 20px}body[data-story=jam] .flavour-photo{min-height:0;height:650px;margin-inline:-6vw}body[data-story=jam] #flavour-image{width:110%;height:700px;max-height:none}}
@media(max-width:400px){.jam-slices{height:350px}body[data-story=jam] .flavour-photo{height:510px}body[data-story=jam] #flavour-image{height:560px}}