/* Recipe detail editorial layout — focused reading, generous negative space. */

body.recipes-page:has(.recipe-detail-hero){
  --recipe-detail-max:1240px;
  --recipe-reading-max:1160px;
  --recipe-related-max:1080px;
}

/* Hero: a contained editorial spread rather than a full-width catalogue row. */
body.recipes-page .recipe-detail-hero{
  background:
    radial-gradient(circle at 15% 15%,rgba(8,124,117,.08),transparent 28%),
    linear-gradient(135deg,#f7f4ed 0%,#fffdf8 62%,#eef7f5 100%);
}
body.recipes-page .recipe-detail-hero__inner{
  max-width:var(--recipe-detail-max);
  grid-template-columns:minmax(340px,.82fr) minmax(0,1.08fr);
  gap:clamp(42px,5.5vw,76px);
  padding-top:clamp(38px,5vw,64px);
  padding-bottom:clamp(46px,6vw,76px);
}
body.recipes-page .recipe-detail-image{
  aspect-ratio:4/3;
  max-height:520px;
  border-radius:24px;
  box-shadow:0 24px 64px rgba(21,56,69,.13);
}
body.recipes-page .recipe-detail-copy{
  min-width:0;
  align-self:center;
}
body.recipes-page .recipe-detail-copy .breadcrumbs{
  margin-bottom:25px;
}
body.recipes-page .recipe-detail-copy h1{
  max-width:760px;
  font-size:clamp(2.7rem,4.6vw,4.35rem);
  line-height:1.015;
}
body.recipes-page .recipe-detail-copy .lede{
  max-width:690px;
  color:#53656d;
  font-size:clamp(1rem,1.35vw,1.12rem);
  line-height:1.68;
}
body.recipes-page .recipe-facts{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  overflow:hidden;
  margin-top:25px;
  border:1px solid #d8e1de;
  border-radius:13px;
  background:#d8e1de;
}
body.recipes-page .recipe-fact{
  min-width:0;
  padding:13px 14px;
  border:0;
  border-radius:0;
  background:rgba(255,255,255,.94);
}
body.recipes-page .recipe-fact span{font-size:.61rem}
body.recipes-page .recipe-fact strong{font-size:.83rem}
body.recipes-page .recipe-tag-list{margin-top:15px}
body.recipes-page .recipe-actions{
  margin-top:20px;
  padding-top:19px;
  border-top:1px solid #d8e1de;
}
body.recipes-page .recipe-author{
  margin-top:19px;
  padding-top:18px;
}

/* Main reading grid: narrower centre line and a calm information rail. */
body.recipes-page .recipe-detail-main{
  max-width:var(--recipe-reading-max);
  grid-template-columns:minmax(0,720px) minmax(270px,320px);
  justify-content:space-between;
  gap:clamp(52px,6vw,82px);
  padding-top:clamp(58px,7vw,86px);
  padding-bottom:clamp(78px,9vw,120px);
}
body.recipes-page .recipe-content{
  gap:58px;
  min-width:0;
}
body.recipes-page .recipe-section{
  padding-bottom:52px;
}
body.recipes-page .recipe-section h2{
  max-width:680px;
  font-size:clamp(2rem,3vw,2.8rem);
}
body.recipes-page .recipe-ingredients{
  max-width:680px;
}
body.recipes-page .recipe-ingredients li{
  grid-template-columns:24px minmax(0,1fr);
  gap:12px;
  padding:15px 2px;
  line-height:1.62;
}
body.recipes-page .recipe-steps{
  max-width:700px;
}
body.recipes-page .recipe-steps li{
  grid-template-columns:46px minmax(0,1fr);
  gap:18px;
  padding:23px 2px;
  line-height:1.72;
}
body.recipes-page .recipe-purpose{
  max-width:700px;
  padding:31px 32px!important;
  border-radius:18px;
  box-shadow:0 18px 48px rgba(21,56,69,.055);
}
body.recipes-page .recipe-purpose p:last-child{
  max-width:620px;
}

body.recipes-page .recipe-safety{
  top:105px;
  gap:12px;
  padding:12px;
  border:1px solid #dfe7e5;
  border-radius:19px;
  background:#f5f8f7;
  box-shadow:0 18px 50px rgba(21,56,69,.055);
}
body.recipes-page .recipe-safety-card{
  padding:20px;
  border-radius:12px;
  box-shadow:none;
}
body.recipes-page .recipe-safety-card h3{
  margin-top:0;
  margin-bottom:13px;
  font-size:1.16rem;
  line-height:1.22;
}
body.recipes-page .recipe-safety-list{
  gap:9px;
}
body.recipes-page .recipe-safety-list li{
  padding-left:19px;
  font-size:.79rem;
  line-height:1.55;
}
body.recipes-page .recipe-safety-list li::before{
  width:6px;
  height:6px;
  box-shadow:0 0 0 3px rgba(8,124,117,.09);
}
body.recipes-page .recipe-nutrition-grid>div{
  padding-block:9px;
}
body.recipes-page .recipe-publication-check{
  background:linear-gradient(145deg,#153845,#10313c);
}

/* Related recipes: compact discovery, intentionally secondary to the recipe. */
body.recipes-page .recipe-related{
  max-width:var(--recipe-related-max);
  padding-top:0;
  padding-bottom:clamp(78px,9vw,112px);
}
body.recipes-page .recipe-related__head{
  margin-bottom:18px;
  padding-top:30px;
}
body.recipes-page .recipe-related__head h2{
  font-size:clamp(1.8rem,2.8vw,2.55rem);
}
body.recipes-page .recipe-grid--related{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
body.recipes-page .recipe-grid--related .recipe-card{
  border-radius:13px;
  box-shadow:none;
}
body.recipes-page .recipe-grid--related .recipe-card:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 34px rgba(21,56,69,.08);
}
body.recipes-page .recipe-grid--related .recipe-card__media{
  aspect-ratio:16/9;
}
body.recipes-page .recipe-grid--related .recipe-card__body{
  padding:15px 16px 16px;
}
body.recipes-page .recipe-grid--related .recipe-card__meta{
  gap:5px 8px;
  font-size:.61rem;
}
body.recipes-page .recipe-grid--related .recipe-card-tags{
  margin-top:8px;
}
body.recipes-page .recipe-grid--related .recipe-card-tags span{
  padding:4px 7px;
  font-size:.57rem;
}
body.recipes-page .recipe-grid--related .recipe-card h3{
  margin:10px 0 7px;
  font-size:clamp(1.14rem,1.55vw,1.38rem);
  line-height:1.15;
}
body.recipes-page .recipe-grid--related .recipe-card p{
  -webkit-line-clamp:2;
  color:#65767d;
  font-size:.75rem;
  line-height:1.5;
}
body.recipes-page .recipe-grid--related .recipe-card__footer{
  margin-top:13px;
  padding-top:12px;
  border-top:1px solid #e2e9e7;
  font-size:.66rem;
}
body.recipes-page .recipe-grid--related .recipe-card__footer strong{
  font-size:.69rem;
}

@media(max-width:1100px){
  body.recipes-page .recipe-detail-hero__inner{
    grid-template-columns:minmax(300px,.78fr) minmax(0,1fr);
    gap:40px;
  }
  body.recipes-page .recipe-detail-main{
    grid-template-columns:minmax(0,1fr) minmax(260px,300px);
    gap:42px;
  }
}

@media(max-width:900px){
  body.recipes-page .recipe-detail-hero__inner{
    grid-template-columns:1fr;
    max-width:780px;
  }
  body.recipes-page .recipe-detail-image{
    max-height:none;
  }
  body.recipes-page .recipe-detail-main{
    max-width:780px;
    grid-template-columns:1fr;
  }
  body.recipes-page .recipe-safety{
    position:static;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body.recipes-page .recipe-grid--related{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:680px){
  body.recipes-page .recipe-detail-hero__inner{
    padding-top:30px;
    padding-bottom:42px;
  }
  body.recipes-page .recipe-detail-copy h1{
    font-size:clamp(2.35rem,11vw,3.25rem);
  }
  body.recipes-page .recipe-facts{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body.recipes-page .recipe-detail-main{
    padding-top:48px;
    padding-bottom:78px;
  }
  body.recipes-page .recipe-content{
    gap:45px;
  }
  body.recipes-page .recipe-section{
    padding-bottom:42px;
  }
  body.recipes-page .recipe-safety{
    grid-template-columns:1fr;
    padding:9px;
  }
  body.recipes-page .recipe-grid--related{
    grid-template-columns:1fr;
  }
  body.recipes-page .recipe-grid--related .recipe-card{
    display:grid;
    grid-template-columns:128px minmax(0,1fr);
  }
  body.recipes-page .recipe-grid--related .recipe-card__media{
    height:100%;
    min-height:154px;
    aspect-ratio:auto;
  }
  body.recipes-page .recipe-grid--related .recipe-card p{
    display:none;
  }
}

@media(max-width:440px){
  body.recipes-page .recipe-grid--related .recipe-card{
    grid-template-columns:104px minmax(0,1fr);
  }
  body.recipes-page .recipe-grid--related .recipe-card__body{
    padding:13px;
  }
  body.recipes-page .recipe-grid--related .recipe-card-tags{
    display:none;
  }
}