.latest-release {
  background: #e8eee5;
}

.latest-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 110px;
  align-items: center;
}

.latest-copy h2 {
  font-family: var(--serif);
  font-size: clamp(62px, 7vw, 102px);
  font-weight: 400;
  letter-spacing: -0.055em;
  line-height: 0.91;
  margin: 0;
}

.latest-copy h2 i {
  color: var(--sage-deep);
  font-weight: 400;
}

.latest-copy .subtitle {
  color: var(--sage-deep);
  font-family: var(--serif);
  font-size: 26px;
  line-height: 1.25;
  margin: 28px 0;
  max-width: 620px;
}

.latest-copy > p:not(.subtitle) {
  font-size: 18px;
  max-width: 650px;
}

.release-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 34px 0;
}

.release-facts span {
  border: 1px solid var(--line);
  border-radius: 99px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 8px 13px;
  text-transform: uppercase;
}

.latest-cover {
  background: #f1e7d8;
  box-shadow: var(--shadow);
  display: block;
  justify-self: end;
  max-width: 430px;
  padding: 42px;
  transition: transform 0.25s;
}

.latest-cover:hover {
  transform: translateY(-5px);
}

.latest-cover img {
  box-shadow: 0 22px 38px rgba(24, 37, 44, 0.25);
  width: 100%;
}

@media (max-width: 920px) {
  .latest-grid { grid-template-columns: 1fr; gap: 55px; }
  .latest-cover { justify-self: start; }
}

@media (max-width: 620px) {
  .latest-cover { max-width: 330px; padding: 28px; }
  .latest-copy h2 { font-size: 58px; }
}

.cookbook-visual {
  background: #dbe2d7;
}

.cookbook-grid {
  align-items: center;
  display: grid;
  gap: 110px;
  grid-template-columns: 1fr 1fr;
}

.cookbook-grid h2 {
  font-size: clamp(52px, 6.1vw, 96px);
  letter-spacing: -.065em;
  line-height: .88;
  margin: 22px 0 0;
}

.cookbook-grid h2 i {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 400;
}

.cookbook-grid > div:last-child > p {
  font-size: 22px;
  line-height: 1.55;
  margin: 0;
  max-width: 520px;
}

.cookbook-facts {
  border-top: 1px solid rgba(23, 41, 47, .24);
  display: grid;
  gap: 28px;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 38px;
  padding-top: 25px;
}

.cookbook-facts span {
  display: block;
  font-size: 45px;
  letter-spacing: -.055em;
  line-height: .9;
}

.cookbook-facts p {
  font-size: 14px;
  line-height: 1.35;
  margin: 0;
}

@media (max-width: 920px) {
  .cookbook-grid { gap: 48px; grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .cookbook-grid h2 { font-size: 56px; }
  .cookbook-grid > div:last-child > p { font-size: 18px; }
}