/* Photography leads; the original dessert arrangement closes the loop. */
.bakery-home .bakery-hero.shell[data-hero-loop] {
  position:relative;isolation:isolate;width:100%;max-width:none;margin-inline:0;
  padding-inline:max(48px,calc((100% - 1120px)/2));
}
.hero-loop-background {
  position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;
  background:#fcf9f4;
}
.hero-loop-scene {position:absolute;inset:0;opacity:0;}
.hero-loop-scene:first-child {opacity:1;}
[data-hero-loop] #bakery-hero-photo {opacity:0;}
.hero-loop-scene img {
  width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 55%;
  opacity:.9;
}
.hero-loop-scene:nth-child(2) img {object-position:50% 48%;}
.hero-loop-scene:nth-child(3) img {object-position:50% 50%;}
@media(min-width:701px){
  .hero-loop-scene img {
    position:absolute;right:0;width:72%;object-position:50% 42%;
    mask-image:linear-gradient(90deg,transparent 0%,#000 17%,#000 100%);
  }
  .hero-loop-scene:nth-child(2) img {object-position:50% 36%;}
}
.hero-loop-scene:nth-child(4) {background:#fcf9f4;}
.hero-loop-scene:nth-child(4) img {
  position:absolute;right:0;top:56%;height:auto;transform:translateY(-50%);
  object-fit:contain;mix-blend-mode:multiply;
  mask-image:linear-gradient(180deg,transparent,#000 5%,#000 94%,transparent);
}
@media(min-width:701px){
  .hero-loop-scene:nth-child(4) img {
    mask-image:linear-gradient(180deg,transparent,#000 5%,#000 94%,transparent),linear-gradient(90deg,transparent,#000 17%);
    mask-composite:intersect;
  }
}
.hero-loop-background::after {
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,#fcf9f4 0%,#fcf9f440 10%,transparent 26%,transparent 78%,#fcf9f4 100%),
    linear-gradient(90deg,#fcf9f4 0%,#fcf9f4fa 16%,#fcf9f4e6 24%,#fcf9f4b3 30%,#fcf9f46b 39%,#fcf9f414 57%,#fcf9f400 76%);
}
/* Keep the gradient boundary fixed during every scroll reveal. */
.bakery-home[data-scene] > .bakery-hero[data-hero-loop][data-reveal] {
  opacity:1;transform:none;scale:1;transition:none;
}
[data-hero-loop] .bakery-hero-copy,[data-hero-loop] .bakery-hero-copy > *,
[data-hero-loop] .bakery-hero-photo {position:relative;z-index:1;}
[data-hero-loop] #bakery-hero-photo {grid-column:2;grid-row:1;}
.hero-loop-gesture {
  position:relative;grid-column:2;grid-row:1;align-self:stretch;justify-self:center;
  width:100%;min-width:0;z-index:3;touch-action:pan-y pinch-zoom;cursor:grab;
  outline:none;
}
.hero-loop-gesture[data-dragging] {cursor:grabbing;}
.hero-loop-gesture:focus-visible {box-shadow:inset 0 -1px #a35c7a;}
.hero-loop-next {
  position:absolute;left:50%;right:auto;bottom:-36px;top:auto;transform:translateX(-50%);
  display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border:0;border-radius:0;background:none;box-shadow:none;
  padding:10px;color:#927684;transition:color 180ms ease;
}
.hero-loop-next svg {pointer-events:none;width:20px;height:13px;}
.hero-loop-next path {stroke-width:1.15;}
.hero-loop-next:hover,.hero-loop-next:focus-visible {color:#573447;}
[data-hero-loop]:not([data-hero-loop-ready="true"]) .hero-loop-next {visibility:hidden;}
html:not([data-bakery-opening]) [data-hero-loop][data-reveal] :is(.bakery-hero-copy > *,.hero-dessert-stage,.bakery-hero-photo > figcaption) {
  opacity:1;transform:none;
  transition:opacity 900ms cubic-bezier(.22,.61,.36,1),transform 900ms cubic-bezier(.22,.61,.36,1);
  transition-delay:var(--reveal-delay,0ms);
}
html:not([data-bakery-opening]) [data-hero-loop][data-reveal-visible="false"] :is(.bakery-hero-copy > *,.hero-dessert-stage,.bakery-hero-photo > figcaption) {
  opacity:0;transform:translate3d(0,var(--reveal-from-y,16px),0);
}
html:not([data-bakery-opening]) [data-hero-loop][data-reveal-instant] :is(.bakery-hero-copy > *,.hero-dessert-stage,.bakery-hero-photo > figcaption) {transition:none;}
@media(max-width:1000px){.bakery-home .bakery-hero.shell[data-hero-loop]{padding-inline:32px;}}
@media(max-width:700px){
  .bakery-home .bakery-hero.shell[data-hero-loop]{padding-inline:20px;}
  [data-hero-loop] #bakery-hero-photo,.hero-loop-gesture {grid-column:1;grid-row:3;}
  .hero-loop-gesture {max-width:400px;}
  .hero-loop-next {display:none;}
  .hero-loop-scene img{object-position:33% 50%;}
  .hero-loop-scene:nth-child(2) img{object-position:50% 45%;}
  .hero-loop-scene:nth-child(3) img{object-position:50% 48%;}
  .hero-loop-background::after{
    background:linear-gradient(180deg,#fcf9f4 0%,#fcf9f4fa 17%,#fcf9f4a6 29%,#fcf9f421 40%,#fcf9f40a 57%,#fcf9f4a6 70%,#fcf9f4f7 80%,#fcf9f4 100%);
  }
}
@media(prefers-reduced-motion:reduce){
  html:not([data-bakery-opening]) [data-hero-loop][data-reveal] :is(.bakery-hero-copy > *,.hero-dessert-stage,.bakery-hero-photo > figcaption){opacity:1;transform:none;transition:none;}
}
