/* Homepage category photography, lifted above an inset studio backdrop. */
body[data-page="home"] .category-grid{gap:48px 28px;padding-top:20px}
.category-pop{--food-tone:#e9e5d8;position:relative;overflow:visible;background:transparent;isolation:isolate}
.category-pop[data-food="chocolate"]{--food-tone:#eaded4}
.category-pop[data-food="biscuits"]{--food-tone:#ede3ce}
.category-pop[data-food="drinks"]{--food-tone:#e9e9d7}
.category-pop[data-food="coffee"]{--food-tone:#e2e4d9}
.category-pop[data-food="sauces"]{--food-tone:#eaded7}
.category-pop .category-image{height:310px;overflow:visible;background:transparent;perspective:900px}
.category-pop .category-image:before{content:"";position:absolute;inset:34px 0 0;background:radial-gradient(ellipse at 50% 36%,#ffffff95,transparent 73%),var(--food-tone);border-radius:3px;transition:transform .65s cubic-bezier(.2,.75,.25,1),box-shadow .65s}
.category-pop .category-image img{position:relative;z-index:2;width:94%;height:100%;object-fit:contain;transform-origin:50% 75%;transform:translateY(-3px) rotate(-2deg);filter:drop-shadow(0 9px 7px #3b302214);transition:transform .7s cubic-bezier(.16,1,.3,1),filter .7s;will-change:auto}
.category-pop .food-shadow{position:absolute;z-index:1;bottom:20px;left:24%;width:52%;height:18px;border-radius:50%;background:#51433132;filter:blur(12px);transition:transform .7s,opacity .7s}
.category-pop .category-label{padding:23px 0 0;border:0;position:relative;z-index:3}
.category-pop .category-label .arrow{transition:transform .4s}
.category-pop:focus-visible{outline:2px solid var(--gold);outline-offset:9px}
@media(min-width:721px) and (hover:hover) and (pointer:fine){
 .category-pop:hover{z-index:5}
 .category-pop:hover .category-image img{transform:translateY(-34px) translateZ(64px) rotate(-6deg) scale(1.12);filter:drop-shadow(0 30px 17px #3b30222a)}
 .category-pop:hover .category-image:before{transform:scale(.975);box-shadow:0 15px 30px #183c3109}
 .category-pop:hover .food-shadow{transform:scale(.75);opacity:.45}
 .category-pop:hover .category-label .arrow{transform:translate(3px,-3px)}
}
.category-pop:focus-visible .category-image img{transform:translateY(-34px) translateZ(64px) rotate(-6deg) scale(1.12);filter:drop-shadow(0 30px 17px #3b30222a)}
@media(max-width:1050px){.category-pop .category-image{height:260px}}
@media(max-width:720px){
 body[data-page="home"] .category-grid{gap:28px 16px;padding-top:8px}
 .category-pop .category-image{height:170px}
 .category-pop .category-image:before{inset:23px 0 0}
 .category-pop .category-image img{width:107%;max-width:107%;height:105%;transform:translateY(-6px) rotate(-3deg)}
 .category-pop .category-label{padding:15px 0 0;gap:5px}
 .category-pop .category-label h3{font-size:14px}
 .category-pop .category-label .arrow{width:17px;flex-shrink:0}
 .category-pop .food-shadow{bottom:12px;height:10px;filter:blur(8px)}
}
@media(prefers-reduced-motion:reduce){
 .category-pop .category-image img,.category-pop:hover .category-image img,.category-pop:focus-visible .category-image img{transform:none;transition:none}
 .category-pop .category-image:before,.category-pop .food-shadow,.category-pop .category-label .arrow{transition:none;transform:none!important}
}

body[data-page='home'] .category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.category-pop{min-width:0}
@media(max-width:720px){body[data-page='home'] .category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media(max-width:720px){.category-pop:focus-visible .category-image img{transform:translateY(-6px) rotate(-3deg);filter:drop-shadow(0 9px 7px #3b302214)}}
@media(max-width:720px) and (prefers-reduced-motion:reduce){.category-pop:focus-visible .category-image img{transform:none}}

/* Touch screens: lift the products as their cards enter the viewing area. */
@media(max-width:720px),(hover:none),(pointer:coarse){
 .category-pop.in-focus{z-index:4}
 .category-pop.in-focus .category-image img{transform:translateY(-18px) rotate(-6deg) scale(1.07);filter:drop-shadow(0 21px 11px #3b302230)}
 .category-pop.in-focus .category-image:before{transform:scale(.975);box-shadow:0 12px 22px #183c310b}
 .category-pop.in-focus .food-shadow{transform:scale(.72);opacity:.4}
 .category-pop.in-focus .category-label .arrow{transform:translate(2px,-2px)}
}
@media(prefers-reduced-motion:reduce){
 .category-pop.in-focus .category-image img{transform:none;transition:none;filter:drop-shadow(0 9px 7px #3b302214)}
 .category-pop.in-focus .category-image:before,.category-pop.in-focus .food-shadow,.category-pop.in-focus .category-label .arrow{transform:none;transition:none}
}
