/* v68: clearer French-toast hero and balanced recipe keepsake. */
.recipe-hero {
  background-image: linear-gradient(90deg,rgba(6,38,48,.9) 0%,rgba(8,51,61,.6) 43%,rgba(8,51,61,.12) 72%,rgba(8,51,61,.58) 100%),url("starfish-float-hero.webp");
}
.recipe-hero-inner {
  display: grid;
  grid-template-columns: minmax(470px, 1.15fr) minmax(330px, .65fr);
  grid-template-rows: auto 1fr;
  align-items: end;
  column-gap: clamp(50px, 8vw, 140px);
  width: 100%;
  max-width: none;
}
.recipe-hero-inner > .eyebrow,
.recipe-hero-inner > h1 { grid-column: 1; }
.recipe-hero-inner > .eyebrow { grid-row: 1; align-self: start; }
.recipe-hero-inner > h1 { grid-row: 2; }
.recipe-hero-intro {
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: end;
  justify-self: end;
  width: min(100%, 430px);
  margin: 0 0 8px;
  padding: 24px 26px;
  background: linear-gradient(90deg,rgba(7,39,48,.82),rgba(7,39,48,.58));
  border-left: 2px solid rgba(232,200,120,.75);
  text-shadow: 0 2px 13px rgba(0,0,0,.6);
}
.recipe-card-aside h2 {
  margin: 16px 0 20px;
  line-height: .9;
}
.recipe-card-aside h2 span:nth-child(2) {
  padding-left: clamp(30px,3vw,46px);
  white-space: nowrap;
}

@media (max-width: 980px) {
  .recipe-hero-inner { grid-template-columns: 1fr; grid-template-rows: auto; row-gap: 16px; }
  .recipe-hero-inner > .eyebrow,
  .recipe-hero-inner > h1,
  .recipe-hero-intro { grid-column: 1; grid-row: auto; }
  .recipe-hero-intro { justify-self: start; width: min(100%, 470px); }
}
@media (max-width: 520px) {
  .recipe-card-aside h2 span:nth-child(2) { padding-left: 22px; white-space: normal; }
}

@media print {
  .recipe-card-aside h2 {
    margin: 4pt 0 7pt !important;
    line-height: .88 !important;
  }
  .recipe-card-aside h2 span:first-child { font-size: 32pt !important; }
  .recipe-card-aside h2 span:nth-child(2) {
    padding-left: 22pt !important;
    font-size: 24pt !important;
    white-space: nowrap !important;
  }
  .recipe-print-keepsake {
    grid-template-columns: 55% 45% !important;
    gap: 10pt !important;
    min-height: 1.15in !important;
    margin-top: 7pt !important;
    justify-items: center !important;
  }
  .recipe-print-keepsake svg {
    width: 96% !important;
    max-height: 1.02in !important;
  }
  .recipe-print-keepsake figcaption {
    align-self: center !important;
    justify-self: stretch !important;
    gap: 4pt !important;
    padding: 0 4pt 0 0 !important;
    text-align: left !important;
  }
  .recipe-print-keepsake em { font-size: 10pt !important; line-height: 1.15 !important; }
  .recipe-print-keepsake strong {
    font-size: 12pt !important;
    line-height: 1.04 !important;
    white-space: normal !important;
  }
}
