/* ============================================================================
   MEV hover supplement
   ----------------------------------------------------------------------------
   Fills in the hover affordances that were missing across the finished pages.
   Found by hovering every distinct element on all 28 staging pages and diffing
   computed styles, so each selector below is a place a visitor gets no feedback.

   Two rules of the house style, taken from what already exists in the other
   stylesheets (.chip:hover, .btn-primary:hover, .mev-cs-card:hover):
     cards  -> 2px lift, soft shadow, border warms up
     links  -> colour or opacity shift

   Notes on the implementation:
   - The lift uses `translate`, not `transform`. The scroll-reveal system animates
     `transform`, so reusing it would fight the entrance animation. `translate` is
     a separate property with its own transition.
   - Every transition re-declares the reveal's own opacity/transform timing, because
     a bare `transition:` here would otherwise replace it and kill the entrance fade.
   - Wrapped in `@media (hover:hover)` so touch devices do not latch a stuck state.
   - Decorative blobs, marquee bands and full width section wrappers are deliberately
     left alone. They are not affordances and lifting them would look like a bug.
   ============================================================================ */

@media (hover: hover) and (pointer: fine) {

	/* shared timing, safe to apply to reveal-animated and static elements alike */
	.mev-hovcard,
	.elementor-location-header .elementor-button,
	.elementor-post__card, .elementor-post.elementor-grid-item,
	.mev-lv .mev-if-panel, .mev-lv .mev-if-ribbon,
	.mev-lv details.group, .mev-lv .bg-gradient-cream,
	.mev-loc .storec, .mev-loc .mev-store, .mev-kw .storec, .mev-kw .mev-store,
	.mev-contact .mev-card, .mev-contact .mev-parking, .mev-contact .mev-store,
	.mev-car .bcard, .mev-car .step, .mev-car .apply-cta,
	.mev-dlv .dlv-faq > *,
	.mev-about .group.rounded-2xl, .mev-cnd .group.rounded-2xl,
	.mev-vr .rounded-2xl {
		transition:
			opacity .9s cubic-bezier(.16, 1, .3, 1),
			transform .9s cubic-bezier(.16, 1, .3, 1),
			translate .3s ease,
			box-shadow .3s ease,
			border-color .3s ease,
			background-color .3s ease;
	}

	/* ---------- 1. site wide chrome ---------- */

	/* the header CTA had no hover at all on any of the 28 pages */
	.elementor-location-header .elementor-button:hover {
		translate: 0 -2px;
		box-shadow: 0 9px 22px -12px rgba(12, 40, 18, .55);
	}

	/* bare links in the top bar and footer: phone, email, order links, socials */
	.elementor-location-header a:not(.elementor-button),
	.elementor-location-footer a {
		transition: opacity .25s ease, color .25s ease;
	}
	.elementor-location-header a:not(.elementor-button):hover,
	.elementor-location-footer a:hover { opacity: .74; }

	/* current page nav item: was the one nav state with no response */
	.elementor-location-header a.elementor-item-active:hover {
		text-decoration: underline;
		text-underline-offset: .3em;
		text-decoration-thickness: 1px;
	}

	/* ---------- 2. blog and post cards (homepage + blog) ---------- */
	.elementor-post__card:hover,
	.elementor-post.elementor-grid-item:hover {
		translate: 0 -3px;
		box-shadow: 0 16px 34px -22px rgba(12, 40, 18, .5);
	}
	.elementor-post__card .elementor-post__thumbnail img,
	.elementor-post.elementor-grid-item img { transition: transform .5s cubic-bezier(.16, 1, .3, 1); }
	.elementor-post__card:hover .elementor-post__thumbnail img,
	.elementor-post.elementor-grid-item:hover img { transform: scale(1.045); }
	.elementor-post__read-more { transition: opacity .25s ease, letter-spacing .25s ease; }
	.elementor-post__read-more:hover { opacity: .72; letter-spacing: .02em; }

	/* ---------- 3. service pages built on the showcase set ---------- */
	/* bakery, restaurant, grocery, meat shop, floral                  */

	/* the top fold overlay card, the one Dishant flagged: whole box now responds */
	.mev-lv .bg-white.max-w-xl {
		transition: translate .35s ease, box-shadow .35s ease;
	}
	.mev-lv .bg-white.max-w-xl:hover {
		translate: 0 -3px;
		box-shadow: 0 22px 48px -26px rgba(12, 40, 18, .55);
	}

	/* intro feature panel and the stats ribbon beside it */
	.mev-lv .mev-if-panel:hover,
	.mev-lv .mev-if-ribbon:hover {
		translate: 0 -2px;
		box-shadow: 0 14px 32px -22px rgba(12, 40, 18, .45);
	}

	/* FAQ rows are click targets, so they need to read as click targets */
	.mev-lv details.group summary,
	.mev-dlv .dlv-faq summary,
	.mev-dlv .dlv-faq button {
		transition: background-color .25s ease, color .25s ease;
	}
	.mev-lv details.group summary:hover,
	.mev-dlv .dlv-faq summary:hover,
	.mev-dlv .dlv-faq button:hover {
		background-color: color-mix(in srgb, currentColor 6%, transparent);
	}
	.mev-lv .bg-gradient-cream:hover { box-shadow: 0 16px 36px -24px rgba(12, 40, 18, .45); }

	/* the mosaic tiles: the large one already zoomed, the small ones did not.
	   The shadow covers the text tile in the grid, which has no image to zoom. */
	.mev-lv [class*="col-span-"][class*="row-span-"] { transition: box-shadow .35s ease; }
	.mev-lv [class*="col-span-"][class*="row-span-"] img { transition: transform .6s cubic-bezier(.16, 1, .3, 1); }
	.mev-lv [class*="col-span-"][class*="row-span-"]:hover { box-shadow: 0 14px 32px -20px rgba(12, 40, 18, .5); }
	.mev-lv [class*="col-span-"][class*="row-span-"]:hover img { transform: scale(1.05); }

	/* ---------- 4. location and keyword pages ---------- */
	.mev-loc .storec:hover, .mev-kw .storec:hover,
	.mev-loc .mev-store:hover, .mev-kw .mev-store:hover {
		translate: 0 -3px;
		border-color: color-mix(in srgb, currentColor 30%, transparent);
		box-shadow: 0 14px 32px -20px rgba(12, 40, 18, .45);
	}
	.mev-loc a.dir, .mev-kw a.dir, .mev-contact a.dir,
	.mev-loc a.mev-explore-btn, .mev-explore-btn {
		transition: opacity .25s ease, translate .25s ease;
	}
	.mev-loc a.dir:hover, .mev-kw a.dir:hover, .mev-contact a.dir:hover { opacity: .72; translate: 2px 0; }
	.mev-explore-btn:hover { translate: 0 -2px; opacity: .92; }

	/* ---------- 5. contact page (html only, had zero hovers) ---------- */
	.mev-contact .mev-card:hover,
	.mev-contact .mev-parking:hover,
	.mev-contact .mev-store:hover {
		translate: 0 -3px;
		border-color: color-mix(in srgb, currentColor 28%, transparent);
		box-shadow: 0 14px 32px -20px rgba(12, 40, 18, .4);
	}
	.mev-contact input, .mev-contact textarea, .mev-contact select {
		transition: border-color .25s ease, box-shadow .25s ease;
	}
	.mev-contact input:hover, .mev-contact textarea:hover, .mev-contact select:hover {
		border-color: color-mix(in srgb, currentColor 35%, transparent);
	}

	/* ---------- 6. careers ---------- */
	.mev-car .bcard:hover, .mev-car .step:hover, .mev-car .apply-cta:hover {
		translate: 0 -3px;
		border-color: color-mix(in srgb, currentColor 28%, transparent);
		box-shadow: 0 14px 32px -20px rgba(12, 40, 18, .4);
	}

	/* filter chips: the active one was the only chip with no hover */
	.mev-gal .chip, .mev-car .chip, .mev-cat .chip {
		transition: opacity .25s ease, translate .25s ease;
	}
	.mev-gal .chip:hover, .mev-car .chip:hover, .mev-cat .chip:hover { translate: 0 -2px; opacity: .9; }

	/* ---------- 7. about, catering, reviews cards ---------- */
	.mev-about .group.rounded-2xl:hover,
	.mev-cnd .group.rounded-2xl:hover,
	.mev-vr .rounded-2xl:hover {
		translate: 0 -3px;
		box-shadow: 0 16px 36px -24px rgba(12, 40, 18, .45);
	}

	/* ---------- 8. delivery stat cards ---------- */
	.mev-dlv .rounded-2xl.border {
		transition: translate .3s ease, box-shadow .3s ease, border-color .3s ease;
	}
	.mev-dlv .rounded-2xl.border:hover {
		translate: 0 -2px;
		border-color: color-mix(in srgb, currentColor 32%, transparent);
	}

	/* ---------- 9. second pass: the stragglers the first sweep missed ---------- */

	/* catering: inline story link and the two CTA buttons.
	   The featured station photo is deliberately left alone: the stations switcher writes an
	   inline transform on that image, and an inline style beats any stylesheet, so a hover rule
	   there would be dead CSS. It is also not a click target, the station list beside it is. */
	.mev-cnd a.story-link { transition: opacity .25s ease; }
	.mev-cnd a.story-link:hover { opacity: .7; }
	.mev-cnd a.group.inline-flex, .mev-cnd button.group.inline-flex {
		transition: translate .25s ease, box-shadow .25s ease, opacity .25s ease;
	}
	.mev-cnd a.group.inline-flex:hover, .mev-cnd button.group.inline-flex:hover {
		translate: 0 -2px;
		box-shadow: 0 10px 24px -14px rgba(12, 40, 18, .5);
	}

	/* the older community page: the three "how we give back" cards */
	.mev-com .g {
		transition:
			opacity .9s cubic-bezier(.16, 1, .3, 1),
			transform .35s cubic-bezier(.16, 1, .3, 1),
			translate .3s ease, box-shadow .3s ease, border-color .3s ease;
	}
	.mev-com .g:hover {
		translate: 0 -3px;
		border-color: color-mix(in srgb, currentColor 28%, transparent);
		box-shadow: 0 14px 32px -20px rgba(12, 40, 18, .45);
	}

	/* reviews: testimonial cards and the closing partner CTA card */
	.mev-vr .rounded-3xl {
		transition: translate .3s ease, box-shadow .3s ease,
			color .3s cubic-bezier(.4, 0, .2, 1), background-color .3s cubic-bezier(.4, 0, .2, 1);
	}
	.mev-vr .rounded-3xl:hover {
		translate: 0 -3px;
		box-shadow: 0 18px 40px -24px rgba(12, 40, 18, .45);
	}
}

/* The post loop is rendered by the theme, so its cards sit outside the .mev-blog wrapper and
   never picked up the card hover used everywhere else. Match that lift here. */
.entry.loop-entry {
	transition: transform .35s cubic-bezier(.16, 1, .3, 1), box-shadow .35s ease;
}
.entry.loop-entry:hover {
	transform: translateY(-5px);
	box-shadow: 0 24px 44px -26px oklch(0.32 0.075 148 / .5);
}
.entry.loop-entry .post-thumbnail img,
.entry.loop-entry .entry-content-wrap img {
	transition: transform .7s cubic-bezier(.16, 1, .3, 1);
}
.entry.loop-entry:hover .post-thumbnail img,
.entry.loop-entry:hover .entry-content-wrap img {
	transform: scale(1.05);
}
