/* recipes */

/* recipe layout */
.rcp:not(.rcp--hero){position:relative;margin:0 0 clamp(52px,7.5vw,110px)!important}
.rcp:not(.rcp--hero) .rcp-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);
  column-gap:clamp(40px,5vw,96px);
  align-items:start;
  position:relative;
}
.rcp:not(.rcp--hero) .rcp-etxt{
  grid-column:1;
  grid-row:1;
  position:relative;
  z-index:2;
  max-width:none!important;
  margin:0!important;
  padding-top:clamp(18px,2.8vw,46px);
}
.rcp:not(.rcp--hero) .rcp-im{
  grid-column:2;
  grid-row:1;
  position:relative!important;
  left:auto!important;
  top:auto!important;
  margin:clamp(22px,3.6vw,58px) calc(var(--gut)*-1) 0 0!important;
  z-index:1;
  width:auto;
}
.rcp:not(.rcp--hero) .rcp-im img{width:100%;height:auto;display:block}
.rcp-ghost{
  position:absolute;
  top:clamp(-16px,-1vw,-34px);
  left:-.05em;
  z-index:0;
  pointer-events:none;
  font-family:var(--serif);
  font-style:italic;
  font-size:clamp(150px,20vw,330px);
  line-height:.8;
  letter-spacing:-.04em;
  color:var(--olive);
  opacity:.09;
  white-space:nowrap;
}
.rcp:not(.rcp--hero) .rcp-nm{
  font-size:clamp(48px,6.6vw,104px)!important;
  line-height:.94;
  letter-spacing:-.025em;
  margin:14px 0 0;
  max-width:none;
  position:relative;
  z-index:2;
}
.rcp:not(.rcp--hero) .rcp-sub{margin-top:clamp(22px,3vw,36px);max-width:36ch}
.rcp:not(.rcp--hero) .rcp-intro{max-width:40ch}
.rcp:not(.rcp--hero) .rcp-note{max-width:44ch}
/* even rows mirrored */
.rcp:nth-of-type(even):not(.rcp--hero) .rcp-etxt{grid-column:2}
.rcp:nth-of-type(even):not(.rcp--hero) .rcp-im{
  grid-column:1;
  margin:clamp(22px,3.6vw,58px) 0 0 calc(var(--gut)*-1)!important;
}
.rcp:nth-of-type(even):not(.rcp--hero) .rcp-ghost{left:auto;right:-.05em}

@media (max-width:900px){
  .rcp:not(.rcp--hero){margin-bottom:clamp(48px,12vw,80px)!important}
  .rcp:not(.rcp--hero) .rcp-head{display:block!important}
  .rcp-ghost{position:static;display:block;font-size:clamp(110px,28vw,180px);opacity:.11;margin:0 0 -.36em}
  .rcp:nth-of-type(even):not(.rcp--hero) .rcp-ghost{text-align:left}
  .rcp:not(.rcp--hero) .rcp-im{margin:0 calc(var(--gut)*-1) 0 0!important}
  .rcp:nth-of-type(even):not(.rcp--hero) .rcp-im{margin:0 0 0 calc(var(--gut)*-1)!important}
  .rcp:not(.rcp--hero) .rcp-etxt, .rcp:nth-of-type(even):not(.rcp--hero) .rcp-etxt{text-align:left;padding-top:22px}
  .rcp:not(.rcp--hero) .rcp-nm{font-size:clamp(42px,12vw,78px)!important}
  .rcp:not(.rcp--hero) .rcp-sub, .rcp:not(.rcp--hero) .rcp-intro, .rcp:not(.rcp--hero) .rcp-note{
    max-width:none;
    margin-left:0;
  }
  .rcp:nth-of-type(even):not(.rcp--hero) .rcp-sub, .rcp:nth-of-type(even):not(.rcp--hero) .rcp-intro, .rcp:nth-of-type(even):not(.rcp--hero) .rcp-note{
    margin-left:0;
  }
  .rcp:nth-of-type(even):not(.rcp--hero) .rcp-full>summary{flex-direction:row}
}

@media (max-width:760px){
  main{margin-left:0;padding-top:52px}
}

/* hide section eyebrows */
.eyerow{display:none!important}

@media (min-width:1600px){
  main{margin-left:calc((100vw - 1560px) / 2 + var(--rail));margin-right:calc((100vw - 1560px) / 2)}
}

main{
  margin-left:0!important;
  margin-right:0!important;
  max-width:1560px!important;
  margin-inline:auto!important;
  padding-top:0!important;
}

@media print{
  .intro, .curve, .viewer{display:none!important}
  main{margin-left:0!important}
  html.js .rvf, html.js .rv{opacity:1!important;transform:none!important}
  .rvl .word, .rvl .char, .mlc b, .ml b{transform:none!important;opacity:1!important}
  section{break-inside:avoid;padding:18pt 0}
  .footer, .foot{background:none!important;color:#18160F!important}
}

/* explicit line breaks on desktop */
.footer .cinvite{max-width:none}

@media (max-width:900px){
  .footer .cinvite{max-width:38ch}
}

/* --- Recipes page --- */
#recipes .rcp{margin:0 0 clamp(72px,11vw,150px)}
#recipes .rcp:last-child{margin-bottom:0}
.rcp-head{display:grid;grid-template-columns:1fr;gap:clamp(24px,4vw,36px);align-items:start}

@media (min-width:900px){
  .rcp-head{grid-template-columns:repeat(12,1fr);column-gap:clamp(40px,4.6vw,84px);align-items:start}
  .rcp-im{grid-column:1 / span 7;grid-row:1}
  .rcp-etxt{grid-column:8 / span 5;grid-row:1;margin-top:clamp(24px,5vw,96px)}
  .rcp:nth-of-type(even) .rcp-im{grid-column:6 / span 7}
  .rcp:nth-of-type(even) .rcp-etxt{grid-column:1 / span 5}
}

.rcp-im{position:relative;overflow:hidden;background:#e9e4d7}
.rcp-im img{width:100%;height:auto;display:block}
.rcp-etxt{align-self:start;max-width:52ch}
.rcp-nm{font-size:clamp(32px,4.6vw,56px);line-height:1.02;letter-spacing:-.02em;color:var(--ink);margin:8px 0 0}
.rcp-sub{
  font-family:var(--serif);
  font-style:italic;
  font-size:clamp(17px,2vw,23px);
  line-height:1.32;
  color:var(--olive);
  margin:16px 0 0;
  max-width:36ch;
}
.rcp-intro{margin:clamp(18px,2.2vw,26px) 0 0;max-width:46ch}
.rcp-note{margin:clamp(22px,2.6vw,30px) 0 0;padding-top:clamp(18px,2vw,22px);border-top:1px solid var(--line)}
.rcp-note p{
  font-family:var(--serif);
  font-size:clamp(15px,1.5vw,17px);
  line-height:1.5;
  color:#3b372e;
  margin:8px 0 0;
  max-width:48ch;
}
.rcp-full{margin:clamp(22px,2.6vw,30px) 0 0;border-top:1px solid var(--line)}
.rcp-full>summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 0 0;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--bronze);
}
.rcp-full>summary::-webkit-details-marker{display:none}
.rcp-full>summary i{
  width:9px;
  height:9px;
  border-right:1px solid var(--bronze);
  border-bottom:1px solid var(--bronze);
  transform:rotate(45deg);
  transition:transform .35s cubic-bezier(.16,1,.3,1);
  margin-right:4px;
}
.rcp-full[open]>summary i{transform:rotate(-135deg)}
.rcp-full>summary:hover{color:var(--ink)}
.rcp-fullin{padding:clamp(22px,3vw,34px) 0 4px;display:grid;grid-template-columns:1fr;gap:clamp(28px,4vw,52px)}

@media (min-width:760px){
  .rcp-fullin{grid-template-columns:.82fr 1.18fr;gap:clamp(36px,5vw,72px)}
}

.rcp-fullin h3{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--soft);
  font-weight:400;
  margin:0 0 18px;
  padding-bottom:12px;
  border-bottom:1px solid var(--line);
}
.rcp-serves{
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--bronze);
  margin:0 0 16px;
}
.rcp-ing h4{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink);
  font-weight:400;
  margin:20px 0 8px;
}
.rcp-ing ul{list-style:none;margin:0 0 4px;padding:0}
.rcp-ing li{
  font-family:var(--sans);
  font-size:13.5px;
  line-height:1.45;
  color:#4a453a;
  padding:6px 0;
  border-bottom:1px solid var(--line2);
}
.rcp-method h4{
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--bronze);
  font-weight:400;
  margin:22px 0 8px;
}
.rcp-method h4:first-of-type{margin-top:0}
.rcp-method p{font-family:var(--sans);font-size:14.5px;line-height:1.62;color:#33302a;margin:0 0 9px;max-width:64ch}
/* recipes opener */
.rcp-im img{will-change:transform}
.rcp-full>summary:focus-visible{outline:2px solid var(--bronze);outline-offset:4px;border-radius:2px}
a:focus-visible, button:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
.rcp--hero{margin-bottom:clamp(96px,14vw,190px)}
.rcp--hero .rcp-head{display:block}
.rcp--hero .rcp-im{width:100vw;margin-left:calc(50% - 50vw);height:min(90vh,900px);background:#e9e4d7}
.rcp--hero .rcp-im img{position:relative;top:-3%;width:100%;height:106%;object-fit:cover;object-position:center}
.rcp--hero .rcp-etxt{max-width:none;margin:clamp(34px,4.5vw,66px) 0 0}
.rcp--hero .rcp-nm{font-size:clamp(42px,6.4vw,88px);margin-top:6px}
.rcp--hero .rcp-htitle .rcp-sub{max-width:34ch}
.rcp--hero .rcp-hread .rcp-intro{margin-top:0}

@media (min-width:900px){
  .rcp--hero .rcp-etxt{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
    column-gap:clamp(48px,6vw,120px);
    align-items:start;
  }
  .rcp--hero .rcp-htitle{align-self:start;position:relative;padding-bottom:clamp(20px,2.4vw,30px)}
  .rcp--hero .rcp-htitle::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:clamp(40px,5vw,72px);
    height:1px;
    background:var(--bronze);
  }
}

@media (max-width:760px){
  .rcp--hero .rcp-im{width:100%;margin-left:0;height:auto}
  .rcp--hero .rcp-im img{position:static;top:auto;height:auto}
}

@media (prefers-reduced-motion:no-preference){
  a.gs{view-transition-name:gsmark}
}

.serv{position:relative;height:calc(100vh + 640vh);background:var(--paper);padding:0!important;margin:0}
.serv.serv--static{height:auto}
.servvp{position:sticky;top:0;height:100vh;height:100lvh;display:grid;grid-template-columns:43fr 57fr;overflow:hidden}
.serv--static .servvp{position:static;height:100vh}
.servtxt{
  position:relative;
  padding:clamp(20px,3vw,44px) clamp(20px,3vw,52px);
  padding-left:calc(var(--rail,66px) + clamp(16px,2.4vw,44px));
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.servey{position:absolute;top:clamp(76px,10vh,110px);left:calc(var(--rail,66px) + clamp(16px,2.4vw,44px));margin:0}
.servghost{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.servghost .scn{
  position:absolute;
  right:clamp(6px,1.2vw,20px);
  bottom:-0.12em;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(160px,26vh,320px);
  line-height:.8;
  color:var(--line);
  opacity:0;
  transform:translateY(14%);
  transition:opacity .6s ease,transform .9s cubic-bezier(.16,1,.3,1);
}
.servghost .scn.live{opacity:1;transform:none}
.servnames{position:relative;z-index:1;min-height:38vh;display:grid;align-items:center}
.snm{grid-area:1/1;opacity:0;pointer-events:none}
.snm.live{opacity:1}
.snm-t{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(34px,3.9vw,68px);
  line-height:1.02;
  letter-spacing:-.02em;
  color:var(--ink);
  margin:0;
  text-wrap:balance;
}
.snm-t em{font-style:italic;color:var(--olive)}
.snm-s{
  font-family:var(--mono);
  font-size:clamp(9.5px,.85vw,11.5px);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--soft);
  line-height:1.7;
  margin:clamp(14px,2vh,22px) 0 0;
  max-width:34ch;
}
.snm .lm{display:block;overflow:hidden;padding:.03em 0 .06em}
.snm .lm>span{display:block;transform:translateY(112%);transition:transform .8s cubic-bezier(.16,1,.3,1)}
.snm.live .lm>span{transform:none}
.snm.live .lm:nth-child(2)>span{transition-delay:.07s}
.snm.live .lm:nth-child(3)>span{transition-delay:.14s}
.snm.live .snm-s{transition-delay:.22s}
.snm .snm-s{opacity:0;transform:translateY(12px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.snm.live .snm-s{opacity:1;transform:none}
.servmeta{
  position:absolute;
  bottom:clamp(22px,4vh,44px);
  left:calc(var(--rail,66px) + clamp(16px,2.4vw,44px));
  display:flex;
  align-items:baseline;
  gap:10px;
  font-family:var(--mono);
  letter-spacing:.14em;
  color:var(--soft);
}
.servmeta .servn{font-size:clamp(13px,1.3vw,17px);color:var(--ink)}
.servmeta .servof{font-size:10.5px}
.servmedia{position:relative;overflow:hidden}
.servmedia .sph{position:absolute;inset:0}
.servmedia .sph img{width:100%;height:100%;object-fit:cover;display:block}
html.js .servmedia .sph{clip-path:inset(0 0 100% 0)}
html.js .servmedia .sph[data-i="0"]{clip-path:inset(0)}
.serv--static .servmedia .sph{display:none}
.serv--static .servmedia .sph[data-i="0"]{display:block;clip-path:none}

@media (max-width:899px){
  .servtxt, .servey, .servmeta{padding-left:clamp(20px,5vw,32px);left:auto}
  .servvp{grid-template-columns:1fr;grid-template-rows:52fr 48fr}
  .servmedia{order:-1}
  .servnames{min-height:0}
  .servghost .scn{font-size:clamp(120px,18vh,200px)}
  .serv{height:calc(100vh + 480vh)}
}

@media (prefers-reduced-motion:reduce){
  .snm .lm>span, .snm .snm-s, .servghost .scn{transition:none}
}

/* full recipe */
.rcp-ing h4{
  font-family:var(--serif);
  font-style:italic;
  font-size:clamp(16px,1.5vw,20px);
  text-transform:none;
  letter-spacing:0;
  color:var(--olive);
  margin:26px 0 10px;
  font-weight:400;
}
.rcp-ing h4:first-of-type{margin-top:0}
.rcp-method .stp{
  display:grid;
  grid-template-columns:clamp(44px,4.5vw,74px) 1fr;
  column-gap:clamp(14px,1.8vw,28px);
  padding:clamp(18px,2.4vw,30px) 0;
  border-top:1px solid var(--line);
}
.rcp-method .stp:first-of-type{border-top:0;padding-top:4px}
.rcp-method .stpn{
  font-family:var(--serif);
  font-size:clamp(30px,3.6vw,54px);
  line-height:.86;
  color:var(--line2);
  grid-row:1/span 2;
}
.rcp-method .stp h4{
  font-family:var(--serif);
  font-style:italic;
  font-size:clamp(17px,1.7vw,23px);
  letter-spacing:0;
  text-transform:none;
  color:var(--ink);
  margin:0 0 10px;
  font-weight:400;
}
.rcp-method .stp .stpb{grid-column:2}
.rcp-method .stp h4{grid-column:2}
.rcp-full[open]>summary{color:var(--ink)}

@media (prefers-reduced-motion:no-preference){
  .rcp-full[open] .rcp-fullin>*{animation:rcpup .7s cubic-bezier(.16,1,.3,1) both}
  .rcp-full[open] .rcp-fullin>*:nth-child(2){animation-delay:.12s}
  .rcp-full[open] .rcp-method .stp{animation:rcpup .7s cubic-bezier(.16,1,.3,1) both}
  .rcp-full[open] .rcp-method .stp:nth-of-type(2){animation-delay:.1s}
  .rcp-full[open] .rcp-method .stp:nth-of-type(3){animation-delay:.18s}
  .rcp-full[open] .rcp-method .stp:nth-of-type(4){animation-delay:.26s}
  .rcp-full[open] .rcp-method .stp:nth-of-type(5){animation-delay:.33s}
  .rcp-full[open] .rcp-method .stp:nth-of-type(6){animation-delay:.39s}
  .rcp-full[open] .rcp-method .stp:nth-of-type(7){animation-delay:.44s}
  .rcp-full[open] .rcp-method .stp:nth-of-type(8){animation-delay:.48s}
  @keyframes rcpup{
    from{opacity:0;transform:translateY(16px)}
    to{opacity:1;transform:none}
  }
}

@media (max-width:760px){
  .rcp-method .stp{grid-template-columns:clamp(34px,9vw,44px) 1fr}
}

.snm-go{
  display:inline-flex;
  align-items:baseline;
  gap:8px;
  margin-top:clamp(16px,2.4vh,26px);
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--bronze);
  text-decoration:none;
  opacity:0;
  transform:translateY(10px);
  transition:opacity .5s ease,transform .6s cubic-bezier(.16,1,.3,1),color .3s;
}
.snm.live .snm-go{opacity:1;transform:none;transition-delay:.3s}
.snm-go:hover{color:var(--ink)}
.snm-go i{font-style:normal;transition:transform .4s cubic-bezier(.16,1,.3,1)}
.snm-go:hover i{transform:translateY(3px)}

@media (prefers-reduced-motion:reduce){
  .snm-go{transition:none}
}

/* recipe reader */
.rdr{
  position:fixed;
  inset:0;
  z-index:300;
  background:var(--paper);
  transform:translateY(103%);
  transition:transform .7s cubic-bezier(.16,1,.3,1);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.rdr.open{transform:none}
.rdr-in{max-width:1240px;margin:0 auto;padding:0 clamp(22px,4vw,64px) clamp(70px,9vh,120px)}
.rdr-hd{
  position:sticky;
  top:0;
  z-index:2;
  background:var(--paper);
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:20px;
  padding:clamp(18px,3vh,30px) 0 14px;
  border-bottom:1px solid var(--line2);
}
.rdr-kick{
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--soft);
  display:flex;
  gap:14px;
  align-items:baseline;
  min-width:0;
}
.rdr-kick b{color:var(--bronze);font-weight:400}
.rdr-kick span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rdr-x{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--soft);
  background:none;
  border:0;
  cursor:pointer;
  padding:6px 0 6px 20px;
  flex:0 0 auto;
}
.rdr-x:hover{color:var(--ink)}
.rdr-title{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(34px,4.6vw,64px);
  line-height:1.02;
  letter-spacing:-.02em;
  color:var(--ink);
  margin:clamp(26px,4vh,44px) 0 clamp(40px,6vh,68px);
  max-width:20ch;
  text-wrap:balance;
}
.rdr-title em{font-style:italic;color:var(--olive)}
.rdr .rcp-fullin{display:grid;grid-template-columns:minmax(260px,.58fr) 1.42fr;gap:clamp(40px,6vw,110px);padding:0}
.rdr .rcp-ing{
  position:sticky;
  top:calc(clamp(18px,3vh,30px) + 46px);
  align-self:start;
  max-height:calc(100vh - 140px);
  overflow:auto;
  padding-right:6px;
}
.rdr .rcp-method p{font-size:16px;line-height:1.72;max-width:58ch;color:#2e2b24}
.rdr .rcp-ing li{font-size:14px;line-height:1.5}
.rdr .rcp-ing h4{font-size:clamp(17px,1.6vw,21px)}
.rdr .rcp-method .stp h4{font-size:clamp(19px,1.9vw,26px)}
.rdr .rcp-method .stpn{font-size:clamp(36px,4vw,60px)}

@media (prefers-reduced-motion:no-preference){
  .rdr.open .rdr-title{animation:rcpup .7s cubic-bezier(.16,1,.3,1) .15s both}
  .rdr.open .rcp-ing{animation:rcpup .7s cubic-bezier(.16,1,.3,1) .25s both}
  .rdr.open .rcp-method{animation:rcpup .7s cubic-bezier(.16,1,.3,1) .33s both}
}

@media (max-width:899px){
  .rdr .rcp-fullin{grid-template-columns:1fr;gap:clamp(28px,5vh,44px)}
  .rdr .rcp-ing{position:static;max-height:none;overflow:visible}
}

@media (prefers-reduced-motion:reduce){
  .rdr{transition:none}
}

html.rdr-lock, html.rdr-lock body{overflow:hidden}
.rcp-full>summary i{transform:rotate(-45deg)}
.rcp-full>summary:hover i{transform:rotate(-45deg) translate(2px,-2px)}

/* showcase to list */
#recipes{border-top:0}

/* reader header, mobile */
@media (max-width:760px){
  #rdrNm, #rdrSrv{display:none}
  .rdr-kick{gap:10px}
}