/* A readable two-part editorial layout is the baseline; motion enhances it. */
.craft-story{position:relative;z-index:4;display:grid;grid-template-columns:1fr 1fr;gap:58px 7vw;padding:68px 6vw 96px;background:var(--wine);color:var(--gold)}
.craft-rule{grid-column:1/-1;grid-row:1;display:flex;align-items:center;justify-content:space-between;gap:24px;padding-bottom:23px;border-bottom:1px solid var(--line)}
.craft-layout,.craft-visual,.craft-stage,.craft-reading{display:contents}
.craft-title{grid-column:1/-1;grid-row:2;margin:0;font-family:Gloock,serif;font-weight:400;font-style:normal;letter-spacing:-.045em;line-height:.92}
.craft-title>span{display:block}
.craft-title>span:first-child{margin-bottom:15px;font-size:clamp(30px,4.5vw,70px);line-height:1.08;letter-spacing:-.025em}
.craft-title>span:last-child{font-size:clamp(110px,16vw,224px)}
.craft-bakery,.craft-dish{position:relative;margin:0;min-width:0;align-self:center}
.craft-bakery{grid-column:1;grid-row:3}
.craft-bakery-window{overflow:hidden;aspect-ratio:3/2;background:var(--ink)}
.craft-bakery img{width:100%;height:100%;object-fit:cover;object-position:100% 100%;transform-origin:75% 65%}
.craft-dish{grid-column:2;grid-row:4;width:min(100%,430px);justify-self:end}
.craft-dish>img{width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;object-position:center 57%}
.craft-bakery figcaption,.craft-dish figcaption{padding-top:12px;font-size:10px;line-height:1.4;letter-spacing:.055em;color:var(--gold)}
.craft-beat{align-self:center;max-width:390px;min-width:0}
.craft-beat--first{grid-column:2;grid-row:3}
.craft-beat--second{grid-column:1;grid-row:4}
.craft-number{display:block;margin-bottom:29px;color:var(--gold)}
.craft-beat h3{margin:0 0 24px;font-size:clamp(35px,3.3vw,52px);line-height:1.1;letter-spacing:-.035em;color:var(--oat)}
.craft-beat p{font-size:16px;line-height:1.75;color:var(--oat);max-width:340px}
.craft-beat .craft-aside{margin-top:30px;font-size:12px;line-height:1.7;color:var(--gold)}
.craft-beat .underlink{margin-top:30px}

/* Only a registered desktop scene can create the long reading column. */
@media(min-width:1000px) and (min-height:700px){
  .craft-story[data-craft-motion]{display:block;padding-bottom:82px}
  [data-craft-motion] .craft-rule{margin-bottom:52px}
  [data-craft-motion] .craft-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:6vw;align-items:start}
  [data-craft-motion] .craft-visual{position:sticky;top:110px;display:block;min-width:0}
  [data-craft-motion] .craft-title{margin-bottom:24px}
  [data-craft-motion] .craft-title>span:first-child{font-size:clamp(24px,2.6vw,39px);margin-bottom:13px}
  [data-craft-motion] .craft-title>span:last-child{font-size:clamp(112px,12vw,176px);line-height:.85}
  [data-craft-motion] .craft-stage{position:relative;display:block;height:min(48svh,430px)}
  [data-craft-motion] .craft-bakery{position:absolute;inset:0;transform-origin:0 0;align-self:auto}
  [data-craft-motion] .craft-bakery-window{height:100%;aspect-ratio:auto}
  [data-craft-motion] .craft-bakery figcaption{position:absolute;top:100%;left:0;width:100%}
  [data-craft-motion] .craft-dish{position:absolute;inset:0 0 0 auto;width:46%;align-self:auto;opacity:0}
  [data-craft-motion] .craft-dish>img{height:100%;aspect-ratio:auto}
  [data-craft-motion] .craft-dish figcaption{position:absolute;top:100%;right:0;text-align:right;white-space:nowrap}
  [data-craft-motion] .craft-reading{display:block}
  [data-craft-motion] .craft-beat{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;min-height:85svh}
  [data-craft-motion] .craft-beat--second{min-height:76svh;padding-bottom:5svh}
  [data-craft-motion] .craft-bakery img,[data-craft-motion] .craft-bakery,[data-craft-motion] .craft-dish{will-change:transform}
}
@media(max-width:999px){
  .craft-story{gap:44px 5vw;padding:54px 6vw 68px}
  .craft-rule>.eyebrow:last-child{display:none}
  .craft-beat h3{font-size:clamp(29px,4vw,42px)}
  .craft-beat p{font-size:15px}
  .craft-number{font-size:10px;margin-bottom:23px}
}
@media(max-width:700px){
  .craft-story{grid-template-columns:minmax(0,1fr);gap:33px;padding:45px 24px 57px}
  .craft-rule{padding-bottom:21px}
  .craft-rule .eyebrow{font-size:9px}
  .craft-title{grid-column:1;grid-row:2;margin:6px 0 10px}
  .craft-title>span:first-child{font-size:clamp(25px,7.5vw,40px);margin-bottom:14px}
  .craft-title>span:last-child{font-size:clamp(103px,29vw,184px)}
  .craft-beat--first{grid-column:1;grid-row:3}
  .craft-bakery{grid-column:1;grid-row:4}
  .craft-beat--second{grid-column:1;grid-row:5;margin-top:26px}
  .craft-dish{grid-column:1;grid-row:6;width:76%;max-width:240px;justify-self:end}
  .craft-beat h3{font-size:35px;margin-bottom:19px}
  .craft-beat p{font-size:15px;line-height:1.7}
  .craft-number{margin-bottom:21px;font-size:9px}
  .craft-beat .craft-aside{margin-top:21px}
  .craft-beat .underlink{margin-top:22px;font-size:14px}
  .craft-bakery figcaption,.craft-dish figcaption{font-size:9px}
}
