.resource-page .resource-nav { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.resource-page .resource-nav a { border: 1px solid var(--line); padding: 9px 16px; border-radius: 999px; }
.resource-page [aria-current="page"] { border-color: var(--accent) !important; color: var(--accent-2); }
.resource-page .resource-banner { display: flex; align-items: center; justify-content: space-between; gap: 24px; border: 1px solid rgba(212,175,55,.35); border-radius: 20px; padding: 24px; margin-bottom: 28px; background: rgba(212,175,55,.06); }
.resource-page .resource-banner p { margin: 0; }
.resource-page .resource-banner .btn { flex-shrink: 0; }
.resource-page .resource-filters { display: grid; grid-template-columns: 2fr 1fr 1fr auto; align-items: end; gap: 16px; margin-bottom: 22px; }
.resource-page .resource-filters-recipes { grid-template-columns: 2fr 1fr auto; }
.resource-page .resource-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.resource-page .resource-card { overflow: hidden; padding: 0 !important; display: flex; flex-direction: column; }
.resource-page .resource-card > img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; display: block; background: #f3f5f7; }
.resource-page .resource-card-body { display: flex; flex-direction: column; gap: 12px; padding: 24px; flex: 1; }
.resource-page .resource-card h2 { font-size: 1.3rem; line-height: 1.25; }
.resource-page .resource-card .eyebrow { margin-bottom: 0; font-size: .68rem; }
.resource-page .resource-card p { margin-bottom: 0; }
.resource-page .resource-card .btn { margin-top: auto; }
.resource-page .resource-tag { align-self: start; border: 1px solid var(--line); padding: 3px 9px; font-size: .75rem; border-radius: 7px; color: var(--accent-2); }
.resource-page .resource-pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.resource-page .resource-detail { max-width: 1040px; }
.resource-page .resource-detail > .card { margin-top: 20px; }
.resource-page .resource-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 28px; }
.resource-page .resource-detail-image { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; background: #f3f5f7; border-radius: 16px; }
.resource-page .resource-lock { padding-top: 24px; max-width: 560px; }
.resource-page .resource-lock .hint { margin-top: 16px; }
.resource-page .resource-macros { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; margin-top: 24px; }
.resource-page .resource-macros > div { border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.resource-page .resource-macros strong { display: block; color: var(--accent-2); font-size: 1.5rem; }
.resource-page .resource-macros span { color: var(--muted); font-size: .75rem; }
.resource-page .resource-portions { display: flex; align-items: end; gap: 16px; margin-top: 24px; }
.resource-page .resource-ingredients, .resource-page .resource-steps { padding-left: 22px; }
.resource-page .resource-ingredients li, .resource-page .resource-steps li { margin-bottom: 16px; }
.resource-page .recipe-card-heading { display: flex; justify-content: space-between; gap: 10px; padding: 22px 24px; background: linear-gradient(135deg,rgba(212,175,55,.18),rgba(212,175,55,.025)); border-bottom: 1px solid var(--line); }
@media (max-width: 980px) { .resource-page .resource-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .resource-page .resource-filters { grid-template-columns: 1fr 1fr; } }
@media (max-width: 768px) {
    .resource-page .container { padding-top: 0 !important; padding-bottom: 0 !important; }
    .resource-page .resource-grid, .resource-page .resource-detail-grid, .resource-page .resource-filters { grid-template-columns: 1fr; }
    .resource-page .resource-banner { display: grid; padding: 20px; gap: 16px; }
    .resource-page .resource-card-body { padding: 20px; }
    .resource-page .resource-card h2 { font-size: 21px !important; }
    .resource-page .resource-pagination .btn { width: auto !important; }
    .resource-page .resource-portions { display: grid; grid-template-columns: 1fr; }
    .resource-page .resource-macros { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* Recipe photography; kept separate from exercise guide illustrations. */
.resource-page .recipe-hero { position: relative; isolation: isolate; overflow: hidden; min-height: clamp(540px, 42vw, 640px); display: flex; align-items: center; background: #141414; padding: 64px 0; box-sizing: border-box; }
.resource-page .recipe-hero-picture { position: absolute; z-index: -2; inset: 0; }
.resource-page .recipe-hero-picture img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: right top; }
.resource-page .recipe-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg,rgba(12,12,12,.92) 0%,rgba(12,12,12,.82) 35%,rgba(12,12,12,.12) 68%); }
.resource-page .recipe-hero-copy h1 { max-width: 560px; font-size: clamp(2.1rem, 4.6vw, 4rem); }
.resource-page .recipe-hero-copy > p { max-width: 470px; color: #f1f1ed; }
.resource-page .recipe-hero .resource-nav a { background: rgba(12,12,12,.75); color: #fff; }
.resource-page .recipe-image-note { font-size: .78rem; color: var(--muted); margin-top: 16px; }
.resource-page .recipe-card > img { object-fit: cover; background: #282522; }
.resource-page .recipe-detail-photo { margin: 24px 0; }
.resource-page .recipe-detail-photo img { display: block; width: 100%; height: auto; border-radius: 16px; }
.resource-page .recipe-detail-photo figcaption { color: var(--muted); font-size: .78rem; margin-top: 9px; }
@media (max-width: 768px) {
  .resource-page .recipe-hero { min-height: 620px; align-items: flex-end; padding: 300px 0 36px; }
  .resource-page .recipe-hero-picture img { object-fit: cover; object-position: 65% top; }
  .resource-page .recipe-hero::before { background: linear-gradient(180deg,rgba(12,12,12,.08) 0%,rgba(12,12,12,.15) 34%,rgba(12,12,12,.82) 57%,rgba(12,12,12,.95) 100%); }
  .resource-page .recipe-hero-copy { padding-top: 0 !important; padding-bottom: 0 !important; }
  .resource-page .recipe-hero-copy h1 { font-size: 34px !important; }
  .resource-page .recipe-hero .resource-nav { gap: 8px; margin-top: 20px; }
  .resource-page .recipe-hero .resource-nav a { width: auto !important; padding: 9px 13px; }
}