/* A hanging-cloth frame, plus layout crops of the original Desaga artwork. */
:root{--rope-ink:#242823}
.rope-frame{isolation:isolate;overflow:visible;background:transparent}
.table-photo.rope-frame,.food-portrait.rope-frame,.zacusca-photo.rope-frame,.place-photo.rope-frame,.tied-art.rope-frame{position:relative}
.rope-window{display:block;width:100%;height:100%;overflow:hidden}
.rope-outline{position:absolute;inset:0;display:block;width:100%;height:100%;z-index:2;overflow:visible;pointer-events:none;fill:none;stroke:var(--rope-ink);stroke-linecap:round;stroke-linejoin:round}
.rope-knot{transform-box:fill-box;transform-origin:center;transition:rotate 280ms var(--ease)}
.tied-art{display:block}
.tied-art .framed-art-image{display:block;width:100%;height:auto;margin:0;object-fit:contain}
.tied-art .rope-window{height:auto}
.rope-mini{position:relative;width:82px;height:68px;flex:0 0 82px}
.rope-mini img{width:100%;height:100%;object-fit:cover}
.rope-provider{display:block;position:relative;width:100%;height:210px;margin:24px 0}
.rope-provider .preview-provider__image{width:100%;height:100%;margin:0}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  html[data-motion=on] .rope-frame:hover .rope-knot{rotate:-8deg}
}

/* Original illustration panels, with the source curves and colors intact. */
.opening,.food-chapter,.bakery,.places,.gathering{isolation:isolate}
.places{position:relative;overflow:hidden}
.logo-scene{display:block;pointer-events:none;user-select:none;transform-origin:50% 70%}
.food-story{flex:0 1 310px;margin:0 2vw 98px 0}
.food-story>p{font-size:18px;line-height:1.5;max-width:30ch}
.serving-art{width:min(100%,270px);height:auto;margin:0 0 34px auto;rotate:-4deg;overflow:visible}
.places-story{flex:0 0 300px;max-width:33ch;margin-bottom:8px}
.places-story>p{font-size:17px;line-height:1.6}
.botanical-art{position:absolute;width:clamp(170px,22vw,285px);height:auto;left:7%;top:57%;rotate:-8deg;z-index:0;border:5px solid var(--rope-ink);background:var(--rope-ink)}
@media(max-width:1000px) and (min-width:761px){
  .food-story{flex-basis:260px;margin-bottom:85px}
  .food-story>p{font-size:16px}
  .serving-art{width:225px;margin-bottom:26px}
  .places-story{flex-basis:250px}
}
@media(max-width:760px){
  .food-story{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1fr);align-items:center;gap:7%;max-width:none;margin:30px 0 32px}
  .food-story>p{font-size:15px;line-height:1.55;max-width:30ch}
  .serving-art{width:100%;margin:0;rotate:-5deg}
  .places-story{display:block;max-width:30ch;margin:28px 0 0 auto}
  .places-story>p{font-size:15px;line-height:1.6}
  .botanical-art{width:32vw;max-width:165px;left:3%;top:39%;border-width:3px}
}
@media(max-width:400px){
  .food-story{display:block;margin:24px 0 30px 14%}
  .serving-art{width:175px;margin:0 0 23px auto}
  .food-story>p{font-size:15px}
  .places-story>p{font-size:14px}
}
html[data-motion=off] .rope-knot{rotate:0deg}
@media(prefers-reduced-motion:reduce){.rope-knot{rotate:0deg;transition:none}}