.food-showcase.food-collage{min-height:100svh;overflow:hidden;padding:clamp(78px,8vw,128px) 7%;background-color:#f4f0e6;background-image:linear-gradient(rgba(244,240,230,.94),rgba(244,240,230,.94)),url('light-pine-texture.png');background-size:auto,760px 760px;color:#30332f}
.food-collage-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(9,clamp(72px,7.2vw,112px));gap:clamp(13px,1.35vw,23px);width:min(1320px,100%);min-height:840px;margin:0 auto}
.food-collage .food-card{position:relative;width:auto;height:auto;min-width:0;overflow:hidden;border:9px solid #fffdf7;background:#4a3528;color:#fff;box-shadow:0 18px 40px rgba(52,43,37,.16);transform:rotate(var(--tilt,0deg));transition:transform .35s ease,box-shadow .35s ease}
.food-collage .food-card::after{background:linear-gradient(0deg,rgba(43,31,24,.86),rgba(43,31,24,0) 62%)}
.food-collage .food-card img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .55s ease}
.food-collage .food-card:hover,.food-collage .food-card:focus-visible{z-index:4;outline:3px solid #718269;outline-offset:4px;transform:translateY(-7px) rotate(0deg);box-shadow:0 28px 55px rgba(52,43,37,.24)}
.food-collage .food-card:hover img,.food-collage .food-card:focus-visible img{transform:scale(1.04)}
.food-collage .food-card-copy{left:16px;right:16px;bottom:15px}
.food-collage .food-card-copy small{margin-bottom:5px;color:#e3eadf;font-size:8px}
.food-collage .food-card-copy strong{font-size:clamp(18px,1.65vw,27px)}
.food-collage-intro{grid-column:5/10;grid-row:4/7;z-index:2;align-self:center;padding:clamp(22px,3vw,45px);text-align:center}
.food-collage-intro h2{margin:0;color:#3f453d;font-size:clamp(47px,5.4vw,79px);line-height:.88}
.food-collage-intro h2 em{color:#718269}
.food-collage-intro p{max-width:470px;margin:25px auto 27px;color:#666b63;font-size:14px;line-height:1.75}
.food-collage .showcase-link{display:inline-flex;gap:28px;min-height:50px;padding:0 20px;border:1px solid #82907d;border-radius:999px;background:#5f7158;color:#fff}
.food-collage .showcase-link:hover,.food-collage .showcase-link:focus-visible{outline:3px solid #b7c5b1;outline-offset:4px;background:#4a3528;color:#fff}
.food-collage .showcase-link span{font-size:17px}
.collage-one{--tilt:-1.1deg;grid-column:1/4;grid-row:1/3}
.collage-two{--tilt:.8deg;grid-column:5/7;grid-row:1/4}
.collage-three{--tilt:-.7deg;grid-column:9/12;grid-row:1/3}
.collage-four{--tilt:.9deg;grid-column:2/5;grid-row:3/6}
.collage-five{--tilt:-.6deg;grid-column:10/13;grid-row:3/6}
.collage-six{--tilt:.7deg;grid-column:1/4;grid-row:6/9}
.collage-seven{--tilt:-.8deg;grid-column:5/8;grid-row:7/10}
.collage-eight{--tilt:.65deg;grid-column:9/12;grid-row:6/8}
.collage-nine{--tilt:-.45deg;grid-column:10/13;grid-row:8/10}
@media(max-width:980px){
  .food-showcase.food-collage{padding-inline:24px}
  .food-collage-grid{grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(12,84px);min-height:0}
  .food-collage-intro{grid-column:3/7;grid-row:4/7}
  .collage-one{grid-column:1/4;grid-row:1/3}.collage-two{grid-column:4/6;grid-row:1/4}.collage-three{grid-column:6/9;grid-row:1/3}.collage-four{grid-column:1/3;grid-row:3/6}.collage-five{grid-column:7/9;grid-row:3/6}.collage-six{grid-column:1/4;grid-row:7/10}.collage-seven{grid-column:4/7;grid-row:8/12}.collage-eight{grid-column:7/9;grid-row:7/10}.collage-nine{grid-column:1/4;grid-row:10/13}
}
@media(max-width:650px){
  .food-showcase.food-collage{min-height:0;padding:76px 18px 82px}
  .food-collage-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;gap:13px}
  .food-collage-intro{grid-column:1/-1;grid-row:auto;order:-1;padding:0 8px 34px;text-align:left}
  .food-collage-intro h2{font-size:clamp(47px,14vw,67px)}
  .food-collage-intro p{margin:21px 0 24px}
  .food-collage .showcase-link{width:100%;justify-content:space-between}
  .food-collage .food-card{grid-column:auto;grid-row:auto;min-height:220px;border-width:6px;transform:none}
  .food-collage .food-card:nth-of-type(3n+1){grid-column:1/-1;min-height:285px}
  .food-collage .food-card-copy strong{font-size:21px}
}
@media(prefers-reduced-motion:reduce){.food-collage .food-card,.food-collage .food-card img{transition:none}}
