/* Frozen: feature card + two half-width cards */
@media (min-width: 961px) {
  .page-frozen .items > .item:not(.item--feature) { flex-basis: calc((100% - var(--gap)) / 2); }
}
.page-frozen .phero .lede { text-wrap: balance; }
.page-frozen .nb { white-space: nowrap; }

/* busy cooler photo: a strong left-weighted scrim keeps the crumbs, eyebrow and lede readable while the right side shows the cases */
@media (min-width: 721px) {
  .page-frozen .phero::after {
    background:
      linear-gradient(90deg, rgba(5, 22, 14, 0.86) 0%, rgba(5, 22, 14, 0.6) 42%, rgba(5, 22, 14, 0.08) 80%),
      linear-gradient(0deg, rgba(5, 22, 14, 0.7) 0%, rgba(5, 22, 14, 0) 55%);
  }
}

/* the Tillamook shot sits on a warm cream backdrop (#faf6eb): lift it to pure white so no beige shows */
.page-frozen #ice-cream .item__media { background: #fff; }
.page-frozen #ice-cream .item__media img { filter: brightness(1.07) contrast(1.04); }

/* captions share one baseline at the bottom of the two half-width cards */
.page-frozen .item:not(.item--feature) .item__body { display: flex; flex-direction: column; gap: 8px; }
.page-frozen .item:not(.item--feature) .item__body > p:nth-last-child(2) { margin-bottom: 6px; }
.page-frozen .item:not(.item--feature) .item__cap { margin-top: auto; }

/* 44px tap targets on the section chips */
.page-frozen .subnav a { display: inline-flex; align-items: center; min-height: 44px; }

@media (max-width: 720px) {
  .page-frozen .phero__actions .btn { flex: 1 1 auto; }
  .page-frozen .phero::after { background: linear-gradient(0deg, rgba(5, 22, 14, 0.95) 0%, rgba(5, 22, 14, 0.84) 55%, rgba(5, 22, 14, 0.66) 100%); }
}

/* mobile: availability reads as a tidy list instead of two chips and an orphan */
@media (max-width: 720px) {
  .page-frozen .avail { flex-direction: column; flex-wrap: nowrap; gap: 8px; }
  .page-frozen .avail li { flex-direction: row; align-items: center; justify-content: space-between; gap: 12px; min-width: 0; padding: 14px 18px; }
}

/* 44px hit areas without changing the look: breadcrumb links and the "Back to home" link */
.page-frozen .crumbs a, .page-frozen .link-arrow { position: relative; }
.page-frozen .crumbs a::before, .page-frozen .link-arrow::before { content: ""; position: absolute; inset: -12px -6px; }
