/* Full photographic assembly; load after the base page stylesheet. */
.assembly-section.has-photo-assembly{height:175vh;height:175svh}
.has-photo-assembly .assembly-sticky{--ap-top:280px;--ap-bottom:50px;height:100vh;height:100svh;min-height:620px;padding:105px 5vw 45px;overflow:hidden}
.has-photo-assembly .assembly-heading{position:relative;z-index:2;width:65%;max-width:820px}
.has-photo-assembly .assembly-heading .eyebrow{margin-bottom:17px}
.has-photo-assembly .assembly-heading .display{font-size:clamp(48px,5.6vw,88px);line-height:.94}
#assembly-photo-canvas{display:block;position:absolute;left:3%;top:var(--ap-top,280px);bottom:var(--ap-bottom,50px);width:61%;height:calc(100% - var(--ap-top,280px) - var(--ap-bottom,50px));pointer-events:none;z-index:1;opacity:0;transition:opacity .3s ease}
.has-photo-ingredients #assembly-photo-canvas{opacity:1}
.has-photo-assembly #assembly-canvas{display:none!important}
.has-photo-assembly .ingredients{left:auto;right:5%;top:max(31%,225px);bottom:auto;width:29%;z-index:3}
.has-photo-assembly .ingredients li{padding:16px 0}
.has-photo-assembly .ingredients li.active{transform:translateX(-9px)}
.has-photo-assembly .ingredients b{font-size:clamp(13px,1.3vw,18px)}
.has-photo-assembly .ingredients small{font-size:clamp(11px,1vw,13px);line-height:1.4}
.has-photo-assembly .assembly-hint{bottom:26px;z-index:2}
.has-photo-assembly:not(.has-photo-ingredients) .assembly-fallback{display:block!important;left:14%;top:var(--ap-top,280px);width:38%;max-height:calc(100% - var(--ap-top,280px) - 55px);object-fit:contain}
.has-photo-assembly.has-photo-ingredients .assembly-fallback{display:none!important}
@media(min-width:701px) and (max-height:720px){
 .has-photo-assembly .assembly-sticky{padding-top:85px;min-height:600px}
 .has-photo-assembly .assembly-heading .display{font-size:clamp(44px,5vw,68px)}
 .has-photo-assembly .assembly-heading .eyebrow{font-size:10px;margin-bottom:12px}
 .has-photo-assembly .ingredients{top:190px}.has-photo-assembly .ingredients li{padding:12px 0}
}
@media(max-width:1000px) and (min-width:701px){
 #assembly-photo-canvas{left:2%;width:58%}
 .has-photo-assembly .ingredients{right:4%;width:34%}
 .has-photo-assembly .assembly-heading{width:66%}
}
@media(max-width:700px){
 .assembly-section.has-photo-assembly{height:155vh;height:155svh}
 .has-photo-assembly .assembly-sticky{--ap-top:235px;--ap-bottom:119px;min-height:620px;padding:100px 6vw 24px}
 .has-photo-assembly .assembly-heading{width:100%;max-width:none}
 .has-photo-assembly .assembly-heading .eyebrow{font-size:10px;margin-bottom:15px}
 .has-photo-assembly .assembly-heading .display{font-size:clamp(42px,11.3vw,56px);line-height:.94}
 #assembly-photo-canvas{left:4%;width:92%;top:var(--ap-top,235px);height:calc(100% - var(--ap-top,235px) - var(--ap-bottom,119px))}
 .has-photo-assembly .ingredients{top:auto;bottom:52px;left:6%;right:6%;width:auto;min-height:53px}
 .has-photo-assembly .ingredients li{display:none;padding:5px 0;opacity:1;border:0}
 .has-photo-assembly .ingredients li.active{display:flex;transform:none}
 .has-photo-assembly .ingredients li>span{font-size:12px}
 .has-photo-assembly .ingredients b{font-size:18px}
 .has-photo-assembly .ingredients small{font-size:12px;margin-top:6px}
 .has-photo-assembly .assembly-hint{left:6%;bottom:22px;font-size:8px}
 .has-photo-assembly:not(.has-photo-ingredients) .assembly-fallback{left:16%;width:68%;max-height:calc(100% - var(--ap-top,235px) - 119px)}
}
@media(prefers-reduced-motion:reduce){
 .assembly-section.has-photo-assembly{height:auto}
 .has-photo-assembly .assembly-sticky{position:relative;height:760px;min-height:760px}
 #assembly-photo-canvas{transition:none}
 .has-photo-assembly .assembly-hint{display:none}
}