/* Manjits theme – only what theme.json can't express. ~6 KB. */

:root {
	--q-header-h: 76px;
	--q-sticky-top: var(--q-header-h);
	--q-radius: 14px;
}
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--q-header-h) + 12px); }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
:where(h1, h2, h3) { font-variation-settings: "SOFT" 50, "WONK" 0; text-wrap: balance; }
:where(p) { text-wrap: pretty; }
em { font-style: italic; }
h1 em, h2 em { color: var(--wp--preset--color--brass); font-weight: 450; }
/* On light sections the bright gold is too faint (1.6:1); a deeper gold reads at 4.9:1. */
:is(.has-cream-background-color, .has-base-background-color, .has-white-background-color) :is(h1, h2):not(.has-text-color) em { color: #8a5d00; }
::selection { background: var(--wp--preset--color--accent); color: #fff; }
:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 3px; }
img { height: auto; }

/* Header */
.q-site-header { position: sticky; top: 0; z-index: 50; }
.admin-bar .q-site-header { top: var(--wp-admin--admin-bar--height, 32px); }
.admin-bar { --q-sticky-top: calc(var(--q-header-h) + var(--wp-admin--admin-bar--height, 32px)); }
.q-header { min-height: var(--q-header-h); display: flex; flex-direction: column; justify-content: center; box-shadow: 0 1px 0 rgb(255 255 255 / 6%), 0 10px 30px rgb(0 0 0 / 18%); }
.q-header > .wp-block-group { width: 100%; }
.q-logo { display: block; flex: none; line-height: 0; }
.q-logo img { width: 92px; height: auto; transition: transform .2s; filter: drop-shadow(0 2px 6px rgb(0 0 0 / 35%)); }
.q-logo:hover img { transform: scale(1.04); }
/* Account icon in the header */
.q-acct-link { display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 50%; color: var(--wp--preset--color--on-dark); border: 1.5px solid rgb(246 240 230 / 22%); transition: border-color .2s, background .2s, transform .2s; }
.q-acct-link:hover, .q-acct-link:focus-visible { border-color: var(--wp--preset--color--brass-light); background: rgb(255 255 255 / 6%); transform: translateY(-1px); color: #fff; }
.q-acct-link svg circle { transition: transform .25s; transform-origin: 12px 8px; }
.q-acct-link:hover svg circle { transform: scale(1.1); }
@media (max-width: 380px) { .q-acct-link { width: 38px; height: 38px; } }
.q-nav a { text-decoration: none; padding: .4em 0; position: relative; }
.q-nav .wp-block-navigation-item__content::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--wp--preset--color--brass); transform: scaleX(0); transform-origin: left; transition: transform .2s; }
.q-nav .wp-block-navigation-item__content:hover::after, .q-nav .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
/* ---- Phone menu: colourful burger + animated full-screen menu ---- */
/* Phone-only extras (Order online / Call) never show in the desktop bar. */
.q-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .q-nav__extra { display: none !important; }

/* Burger: gradient ring, three bars (brass, terracotta, cream) that even out on hover/tap. */
.q-nav .wp-block-navigation__responsive-container-open {
	position: relative; display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border-radius: 14px; cursor: pointer;
	color: var(--wp--preset--color--on-dark);
	border: 1.5px solid transparent;
	background: linear-gradient(160deg, var(--wp--preset--color--contrast), var(--wp--preset--color--espresso)) padding-box, linear-gradient(135deg, var(--wp--preset--color--brass-light), var(--wp--preset--color--accent-light) 55%, var(--wp--preset--color--accent-dark)) border-box;
	box-shadow: 0 6px 18px -8px rgb(224 96 47 / 70%);
	transition: transform .2s ease, box-shadow .25s ease;
}
.q-nav .wp-block-navigation__responsive-container-open svg { display: none; }
@media (min-width: 1200px) { .q-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: none; } }
/* Tablets and small laptops: the seven links don't fit beside the logo, account and Order button below about
   1,150px (at 1024 the Order button was cut off) – use the menu button up to 1200px. */
@media (min-width: 600px) and (max-width: 1199.98px) {
	.q-nav .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none !important; }
	.q-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: grid; }
	.q-nav .is-menu-open .wp-block-navigation__responsive-container-content { max-width: 560px; margin: 0 auto; }
}
.q-nav .wp-block-navigation__responsive-container-open::before {
	content: ""; width: 22px; height: 16px;
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--wp--preset--color--brass-light) 86%, white), #e0a93c) right top / 22px 2.5px no-repeat,
		linear-gradient(90deg, #ff9d6c, var(--wp--preset--color--accent-light)) right center / 15px 2.5px no-repeat,
		linear-gradient(90deg, color-mix(in srgb, var(--wp--preset--color--brass) 17%, white), color-mix(in srgb, var(--wp--preset--color--brass) 34%, white)) right bottom / 9px 2.5px no-repeat;
	transition: background-size .35s cubic-bezier(.3,1.4,.5,1);
	animation: q-burger-wave 3.6s ease-in-out .8s infinite; /* Keeps waving gently: a wave, then a rest. */
}
/* The ring breathes a warm glow, so the menu button is easy to find on a phone. */
.q-nav .wp-block-navigation__responsive-container-open { animation: q-burger-glow 3.6s ease-in-out .8s infinite; }
.q-nav .wp-block-navigation__responsive-container-open:hover,
.q-nav .wp-block-navigation__responsive-container-open:focus-visible { box-shadow: 0 8px 22px -6px rgb(224 96 47 / 85%); }
.q-nav .wp-block-navigation__responsive-container-open:hover::before,
.q-nav .wp-block-navigation__responsive-container-open:focus-visible::before { background-size: 22px 2.5px, 22px 2.5px, 22px 2.5px; }
.q-nav .wp-block-navigation__responsive-container-open:active { transform: scale(.92); }
.q-nav .wp-block-navigation__responsive-container-open:focus-visible { outline: 2px solid var(--wp--preset--color--brass-light); outline-offset: 3px; }
@keyframes q-burger-wave {
	0%, 60%, 100% { background-size: 22px 2.5px, 15px 2.5px, 9px 2.5px; }
	15% { background-size: 12px 2.5px, 22px 2.5px, 16px 2.5px; }
	30% { background-size: 18px 2.5px, 10px 2.5px, 22px 2.5px; }
	45% { background-size: 22px 2.5px, 20px 2.5px, 12px 2.5px; }
}
@keyframes q-burger-glow {
	0%, 60%, 100% { box-shadow: 0 6px 18px -8px rgb(224 96 47 / 70%); }
	30% { box-shadow: 0 6px 22px -4px rgb(224 96 47 / 95%), 0 0 0 4px rgb(224 169 60 / 18%); }
}
/* Hover / tap still evens the bars out. */
.q-nav .wp-block-navigation__responsive-container-open:hover::before,
.q-nav .wp-block-navigation__responsive-container-open:focus-visible::before { animation-play-state: paused; }

/* Open menu: warm glow backdrop, numbered links that slide in one after another. */
.q-nav .wp-block-navigation__responsive-container.is-menu-open {
	padding: 22px 24px calc(24px + env(safe-area-inset-bottom));
	background:
		radial-gradient(120% 60% at 100% 0%, rgb(181 86 47 / 48%) 0%, transparent 60%),
		radial-gradient(90% 50% at 0% 100%, rgb(201 164 92 / 30%) 0%, transparent 60%),
		var(--wp--preset--color--espresso) !important;
	animation: q-menu-in .35s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes q-menu-in { from { opacity: 0; clip-path: circle(0% at calc(100% - 48px) 32px); } to { opacity: 1; clip-path: circle(150% at calc(100% - 48px) 32px); } }
.q-nav .is-menu-open .wp-block-navigation__responsive-container-content { position: relative; align-items: stretch !important; padding-top: 58px !important; }
.q-nav .is-menu-open .wp-block-navigation__responsive-container-content::before {
	content: "Manjit’s · Corrimal"; position: absolute; top: 8px; left: 0; font-size: .7rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--wp--preset--color--brass);
}
.q-nav .is-menu-open .wp-block-navigation__container {
	counter-reset: qnav; align-items: stretch !important; width: 100%; gap: 0 !important;
	font-family: var(--wp--preset--font-family--display); font-size: clamp(1.6rem, 7vw, 2.1rem); font-weight: 500;
}
.q-nav .is-menu-open .wp-block-navigation-item { width: 100%; opacity: 0; animation: q-menu-item .5s cubic-bezier(.2,.8,.2,1) forwards; }
.q-nav .is-menu-open .wp-block-navigation-item:nth-child(1) { animation-delay: .08s; }
.q-nav .is-menu-open .wp-block-navigation-item:nth-child(2) { animation-delay: .13s; }
.q-nav .is-menu-open .wp-block-navigation-item:nth-child(3) { animation-delay: .18s; }
.q-nav .is-menu-open .wp-block-navigation-item:nth-child(4) { animation-delay: .23s; }
.q-nav .is-menu-open .wp-block-navigation-item:nth-child(5) { animation-delay: .28s; }
.q-nav .is-menu-open .wp-block-navigation-item:nth-child(6) { animation-delay: .33s; }
.q-nav .is-menu-open .wp-block-navigation-item:nth-child(7) { animation-delay: .42s; }
.q-nav .is-menu-open .wp-block-navigation-item:nth-child(8) { animation-delay: .48s; }
@keyframes q-menu-item { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }
.q-nav .is-menu-open .wp-block-navigation-item:not(.q-nav__extra) { border-bottom: 1px solid rgb(246 240 230 / 9%); }
.q-nav .is-menu-open .wp-block-navigation-item:not(.q-nav__extra) .wp-block-navigation-item__content {
	counter-increment: qnav; display: flex; align-items: baseline; gap: 14px; width: 100%; padding: 14px 2px; color: var(--wp--preset--color--on-dark);
	transition: color .2s, padding-left .25s ease;
}
.q-nav .is-menu-open .wp-block-navigation-item:not(.q-nav__extra) .wp-block-navigation-item__content::before {
	content: counter(qnav, decimal-leading-zero); flex: none; font-family: var(--wp--preset--font-family--body); font-size: .72rem; font-weight: 700; letter-spacing: .1em; color: var(--wp--preset--color--brass);
}
.q-nav .is-menu-open .wp-block-navigation-item:not(.q-nav__extra) .wp-block-navigation-item__content::after {
	content: "→"; position: static; height: auto; margin-left: auto; background: none; transform: translateX(-8px); opacity: 0; font-family: var(--wp--preset--font-family--body); font-size: 1.1rem; color: #ff9d6c; transition: opacity .2s, transform .25s ease;
}
.q-nav .is-menu-open .wp-block-navigation-item__content:focus { outline: none; }
.q-nav .is-menu-open .wp-block-navigation-item__content:focus-visible { outline: 2px solid rgb(243 201 105 / 70%); outline-offset: 2px; border-radius: 10px; }
.q-nav .is-menu-open .wp-block-navigation-item:not(.q-nav__extra) .wp-block-navigation-item__content:hover,
.q-nav .is-menu-open .wp-block-navigation-item:not(.q-nav__extra) .wp-block-navigation-item__content:focus-visible { color: #fff; padding-left: 8px; }
.q-nav .is-menu-open .wp-block-navigation-item:not(.q-nav__extra) .wp-block-navigation-item__content:hover::after,
.q-nav .is-menu-open .wp-block-navigation-item:not(.q-nav__extra) .wp-block-navigation-item__content:focus-visible::after { opacity: 1; transform: none; }
.q-nav .is-menu-open .current-menu-item > .wp-block-navigation-item__content,
.q-nav .is-menu-open [aria-current="page"] { background: linear-gradient(90deg, color-mix(in srgb, var(--wp--preset--color--brass-light) 86%, white), #ff9d6c); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.q-nav .is-menu-open .current-menu-item > .wp-block-navigation-item__content::before { -webkit-text-fill-color: var(--wp--preset--color--brass); }

/* Order online + Call buttons at the bottom of the menu. */
.q-nav .is-menu-open .q-nav__cta { margin-top: 26px; }
.q-nav .is-menu-open .q-nav__call { margin-top: 10px; }
.q-nav .is-menu-open .q-nav__extra .wp-block-navigation-item__content {
	display: flex; justify-content: center; align-items: center; gap: 8px; width: 100%; box-sizing: border-box; padding: 15px 20px; border-radius: 999px;
	font-family: var(--wp--preset--font-family--body); font-size: 1rem; font-weight: 700; letter-spacing: .01em;
}
.q-nav .is-menu-open .q-nav__cta .wp-block-navigation-item__content { background: linear-gradient(135deg, var(--wp--preset--color--accent-light), var(--wp--preset--color--accent) 55%, var(--wp--preset--color--accent-dark)); color: #fff; box-shadow: 0 12px 26px -12px rgb(224 96 47 / 90%); }
.q-nav .is-menu-open .q-nav__cta .wp-block-navigation-item__content::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 7h12l-1.2 11.2a2 2 0 0 1-2 1.8H9.2a2 2 0 0 1-2-1.8z' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M9 7V6a3 3 0 0 1 6 0v1' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 7h12l-1.2 11.2a2 2 0 0 1-2 1.8H9.2a2 2 0 0 1-2-1.8z' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M9 7V6a3 3 0 0 1 6 0v1' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center / contain no-repeat; }
.q-nav .is-menu-open .q-nav__call .wp-block-navigation-item__content { border: 1.5px solid rgb(246 240 230 / 22%); color: var(--wp--preset--color--on-dark); background: rgb(255 255 255 / 4%); }
.q-nav .is-menu-open .q-nav__call .wp-block-navigation-item__content::before { content: ""; width: 16px; height: 16px; background: var(--wp--preset--color--brass-light); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat; }
.q-nav .is-menu-open .q-nav__extra .wp-block-navigation-item__content::after { display: none; }
.q-nav .is-menu-open .q-nav__extra .wp-block-navigation-item__content:active { transform: scale(.98); }

/* Close: terracotta disc, the X turns as you press it. */
.q-nav .is-menu-open .wp-block-navigation__responsive-container-close {
	top: 20px !important; right: 20px !important; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
	background: linear-gradient(135deg, var(--wp--preset--color--accent-light), var(--wp--preset--color--accent-dark)); color: #fff; box-shadow: 0 10px 22px -10px rgb(224 96 47 / 90%);
	transition: transform .35s cubic-bezier(.3,1.4,.5,1);
}
.q-nav .is-menu-open .wp-block-navigation__responsive-container-close svg { fill: currentColor; }
.q-nav .is-menu-open .wp-block-navigation__responsive-container-close:hover,
.q-nav .is-menu-open .wp-block-navigation__responsive-container-close:focus-visible { transform: rotate(90deg); }
.q-nav .is-menu-open .wp-block-navigation__responsive-container-close:focus-visible { outline: 2px solid var(--wp--preset--color--brass-light); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
	.q-nav .wp-block-navigation__responsive-container-open,
	.q-nav .wp-block-navigation__responsive-container-open::before,
	.q-nav .wp-block-navigation__responsive-container.is-menu-open,
	.q-nav .is-menu-open .wp-block-navigation-item { animation: none; opacity: 1; }
	.q-nav .wp-block-navigation__responsive-container-open::before,
	.q-nav .is-menu-open .wp-block-navigation__responsive-container-close { transition: none; }
}
@media (max-width: 599px) {
	:root { --q-header-h: 64px; }
	.q-logo img { width: 74px; }
	.q-header__cta .wp-block-button__link { padding: .7em 1.1em; }
}
/* Small phones (iPhone SE and narrower): the header row must fit in 320px. */
@media (max-width: 359px) {
	.q-logo img { width: 62px; }
	.q-header__right { gap: 6px !important; }
	.q-header__cta .wp-block-button__link { padding: .65em .85em; font-size: .85rem; }
}

/* Eyebrow paragraph style */
.is-style-manjits-eyebrow { margin-bottom: 0 !important; font-size: var(--wp--preset--font-size--x-small); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--wp--preset--color--accent-dark); }
.q-dark .is-style-manjits-eyebrow, .has-espresso-background-color .is-style-manjits-eyebrow { color: var(--wp--preset--color--brass); }

/* Hero */
.q-hero .wp-block-cover__image-background { animation: q-zoom 18s ease-out both; }
/* Directional scrim: dark behind the copy (bottom-left), photo stays vivid on the right. */
.q-hero .wp-block-cover__background {
	opacity: 1 !important;
	background:
		linear-gradient(0deg, color-mix(in srgb, var(--wp--preset--color--espresso) 88%, transparent) 0%, color-mix(in srgb, var(--wp--preset--color--espresso) 35%, transparent) 45%, color-mix(in srgb, var(--wp--preset--color--espresso) 15%, transparent) 100%),
		linear-gradient(90deg, color-mix(in srgb, var(--wp--preset--color--espresso) 75%, transparent) 0%, color-mix(in srgb, var(--wp--preset--color--espresso) 30%, transparent) 55%, color-mix(in srgb, var(--wp--preset--color--espresso) 0%, transparent) 80%) !important;
}
.q-hero p.has-large-font-size { max-width: 34ch; }
.q-hero :where(h1, p) { text-shadow: 0 2px 24px rgb(0 0 0 / 35%); }
@keyframes q-zoom { from { transform: scale(1.08); } }
.q-hero h1 { margin-block: .15em .25em; }
.q-hero .wp-block-cover__inner-container { width: 100%; }

/* Quick action cards overlapping the hero */
.q-quick .wp-block-columns { margin-top: calc(-1 * var(--wp--preset--spacing--60)); position: relative; z-index: 2; }
.q-quick__card { background: var(--wp--preset--color--surface); border-radius: var(--q-radius); padding: clamp(18px, 2.5vw, 28px); box-shadow: var(--wp--preset--shadow--soft); border: 1px solid var(--wp--preset--color--line); transition: transform .2s, box-shadow .2s; position: relative; }
.q-quick__card:hover { transform: translateY(-4px); box-shadow: var(--wp--preset--shadow--lift); }
.q-quick__card :is(h2, h3) { margin-top: .4rem; }
.q-quick__card :is(h2, h3) a { color: inherit; text-decoration: none; }
.q-quick__card :is(h2, h3) a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.q-quick__icon { margin: 0; font-size: 1.75rem; line-height: 1; }
/* A picture instead of the emoji (Website design → Home page card icons). */
.q-quick__icon--img { --q-icon: 80px; }
.q-quick__img { display: block; width: var(--q-icon); height: var(--q-icon); object-fit: contain; filter: drop-shadow(0 8px 10px color-mix(in srgb, var(--wp--preset--color--espresso, #1c1714) 22%, transparent)); transition: transform .3s cubic-bezier(.2, .8, .3, 1.3); }
.q-quick__card:hover .q-quick__img { transform: translateY(-3px) rotate(-3deg) scale(1.06); }
@media (max-width: 600px) { .q-quick__icon--img { --q-icon: min(var(--q-icon), 64px); } }
@media (prefers-reduced-motion: reduce) { .q-quick__img { transition: none; } .q-quick__card:hover .q-quick__img { transform: none; } }
@media (max-width: 781px) { .q-quick .wp-block-columns { margin-top: calc(-1 * var(--wp--preset--spacing--50)); } }

/* Media + text split */
.q-split .wp-block-media-text__media img { border-radius: 22px; aspect-ratio: 4 / 5; object-fit: cover; box-shadow: var(--wp--preset--shadow--lift); }
.q-split .wp-block-media-text__content { padding: clamp(1.5rem, 4vw, 4rem); }
.q-split .wp-block-media-text__content > * + * { margin-top: 1rem; }
@media (max-width: 600px) { .q-split .wp-block-media-text__content { padding: 1.5rem 0 0; } }
.q-dark .wp-block-quote { border-color: var(--wp--preset--color--brass); }
.wp-block-quote cite { display: block; margin-top: .5em; font-family: var(--wp--preset--font-family--body); font-size: var(--wp--preset--font-size--small); font-style: normal; font-weight: 600; color: var(--wp--preset--color--muted); }

/* Feature columns */
.q-feature .wp-block-image { margin-bottom: 1rem; overflow: hidden; border-radius: var(--q-radius); }
.q-feature .wp-block-image img { transition: transform .5s ease; }
.q-feature:hover .wp-block-image img { transform: scale(1.04); }
.q-feature h2, .q-feature h3 { margin-top: .5rem; }

/* Cards */
.is-style-manjits-card { background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--line); border-radius: var(--q-radius); padding: clamp(18px, 3vw, 28px); box-shadow: var(--wp--preset--shadow--soft); }
.is-style-manjits-card + .is-style-manjits-card { margin-top: 1.25rem; }
.is-style-manjits-card h2:first-child { margin-top: 0; }

/* Arch image */
.is-style-manjits-arch img { border-radius: 999px 999px 22px 22px !important; box-shadow: var(--wp--preset--shadow--lift); }

/* Accent band */
.q-band h2 { margin: 0; }
.q-band p { margin: 0; opacity: .92; }

/* Page hero (page.html) */
.q-page-hero .wp-block-post-title { margin-bottom: .25em; }
.q-lede { max-width: 62ch; margin-left: 0 !important; color: var(--wp--preset--color--muted); font-size: clamp(1.0625rem, 1.6vw, 1.25rem) !important; }
body { overflow-x: clip; }
.q-lede p { margin: 0; }

/* Gallery */
.wp-block-gallery.is-style-manjits-masonry { display: block !important; columns: 3 260px; column-gap: 14px; }
.wp-block-gallery.is-style-manjits-masonry .wp-block-image { width: 100% !important; margin: 0 0 14px !important; break-inside: avoid; }
.wp-block-gallery.is-style-manjits-masonry img { height: auto !important; border-radius: 12px; }

/* Footer */
.q-footer { font-size: var(--wp--preset--font-size--small); }
.q-footer__h { font-family: var(--wp--preset--font-family--body) !important; font-size: var(--wp--preset--font-size--x-small) !important; font-weight: 700 !important; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 1rem; }
.q-logo--footer img { width: 170px; margin-bottom: 1rem; }
.q-footer__links { list-style: none; padding: 0; display: grid; gap: .45rem; }
.q-footer a { text-decoration: none; }
.q-footer a:hover { text-decoration: underline; color: var(--wp--preset--color--brass); }
.q-footer .q-hours__row { border-color: rgb(246 240 230 / 12%); }
/* --q-accent only exists where a form's stylesheet loads – elsewhere (Home…) the "Today" pill lost its colour. */
.q-hours__row.is-today dt::after { background: var(--q-accent, var(--wp--preset--color--accent)); }
/* Tablets and small laptops: two columns side by side (brand · Visit, Opening hours · Explore) instead of four
   squeezed ones or one stretched one. */
@media (min-width: 600px) and (max-width: 1099.98px) {
	.q-footer .wp-block-columns { flex-wrap: wrap !important; column-gap: var(--wp--preset--spacing--60) !important; row-gap: var(--wp--preset--spacing--60) !important; }
	.q-footer .wp-block-columns > .wp-block-column { flex: 0 0 calc(50% - var(--wp--preset--spacing--60) / 2) !important; }
}
/* Phones: one column – each part gets room and a faint rule above it; Explore in two columns, without the legal
   links (they're on the bottom line). */
@media (max-width: 599.98px) {
	.q-footer .wp-block-columns { row-gap: 0 !important; }
	.q-footer .wp-block-columns > .wp-block-column + .wp-block-column { margin-top: 26px; padding-top: 26px; border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--on-dark) 10%, transparent); }
	.q-footer .q-logo--footer img { width: 140px; }
	.q-footer__links { grid-template-columns: 1fr 1fr; column-gap: 16px; }
	.q-footer .q-footer__links li + li { margin-top: 0; }
	.q-footer__links .q-footer__sep, .q-footer__links .q-footer__sep ~ li { display: none; }
	.q-footer .wp-block-social-links { margin-top: 18px; }
	/* ©, ABN and payments one per line, without the dots between them. */
	.q-footer__bottom .q-footer__bit { display: block; }
	.q-footer__bottom .q-footer__dot { display: none; }
}
/* The bottom line's pieces (©, ABN, payments) wrap between each other, never inside. */
.q-footer__bit { white-space: nowrap; }
.q-footer .q-contact__row svg { color: var(--wp--preset--color--brass); }

/* Motion safety */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Liquid-glass buttons (theme) – matches the ordering UI in manjits-core/forms.css */
.wp-element-button, .wp-block-button__link {
	position: relative; overflow: hidden; isolation: isolate;
	background: linear-gradient(180deg, color-mix(in srgb, var(--wp--preset--color--accent) 96%, white) 0%, var(--wp--preset--color--accent) 52%, color-mix(in srgb, var(--wp--preset--color--accent-dark) 97%, black) 100%) !important;
	border: 1px solid rgb(255 255 255 / 28%) !important;
	text-shadow: 0 1px 1px rgb(80 30 10 / 35%);
	box-shadow: 0 0 0 1px rgb(120 50 20 / 45%), inset 0 1px 0 rgb(255 255 255 / 50%), inset 0 -12px 22px -12px rgb(60 20 5 / 60%), 0 12px 28px -12px rgb(181 86 47 / 70%);
	transition: transform .25s cubic-bezier(.34, 1.4, .5, 1), box-shadow .2s !important;
}
.wp-element-button::before, .wp-block-button__link::before {
	content: ""; position: absolute; inset: 1px 1px 52% 1px; z-index: -1; border-radius: inherit; pointer-events: none;
	background: linear-gradient(180deg, rgb(255 255 255 / 38%), rgb(255 255 255 / 0%));
}
.wp-element-button::after, .wp-block-button__link::after {
	content: ""; position: absolute; top: 0; bottom: 0; left: -70%; width: 45%; pointer-events: none;
	background: linear-gradient(100deg, transparent, rgb(255 255 255 / 55%), transparent);
	transform: skewX(-20deg); transition: left .7s ease;
}
.wp-element-button:hover, .wp-block-button__link:hover { transform: translateY(-2px); color: #fff !important; }
.wp-element-button:hover::after, .wp-block-button__link:hover::after { left: 130%; }
.wp-element-button:active, .wp-block-button__link:active { transform: translateY(1px) scale(.985); }

/* Outline → frosted glass (on light backgrounds) */
.wp-block-button.is-style-manjits-outline .wp-block-button__link {
	background: linear-gradient(180deg, rgb(255 255 255 / 92%), color-mix(in srgb, var(--wp--preset--color--brass-light) 22%, white)) !important;
	color: var(--wp--preset--color--accent-dark) !important; text-shadow: none;
	border: 1.5px solid color-mix(in srgb, var(--wp--preset--color--accent) 70%, transparent) !important;
	-webkit-backdrop-filter: blur(16px) saturate(1.8); backdrop-filter: blur(16px) saturate(1.8);
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--wp--preset--color--espresso) 12%, transparent), inset 0 1px 0 rgb(255 255 255 / 95%), inset 0 -10px 18px -14px color-mix(in srgb, var(--wp--preset--color--espresso) 28%, transparent), 0 8px 22px -12px color-mix(in srgb, var(--wp--preset--color--espresso) 35%, transparent);
}
.wp-block-button.is-style-manjits-outline .wp-block-button__link::before { background: linear-gradient(180deg, rgb(255 255 255 / 60%), rgb(255 255 255 / 0%)); }
.wp-block-button.is-style-manjits-outline .wp-block-button__link:hover { color: var(--wp--preset--color--accent) !important; border-color: var(--wp--preset--color--accent) !important; }

/* Light → smoked glass (on dark photos / sections) */
.wp-block-button.is-style-manjits-light .wp-block-button__link {
	background: linear-gradient(180deg, rgb(255 255 255 / 22%), rgb(255 255 255 / 8%)) !important;
	color: var(--wp--preset--color--on-dark) !important;
	border-color: rgb(255 255 255 / 40%) !important;
	-webkit-backdrop-filter: blur(14px) saturate(1.6); backdrop-filter: blur(14px) saturate(1.6);
	box-shadow: inset 0 1px 0 rgb(255 255 255 / 45%), inset 0 -10px 20px -14px rgb(0 0 0 / 40%), 0 10px 26px -12px rgb(0 0 0 / 55%);
}
.wp-block-button.is-style-manjits-light .wp-block-button__link:hover { color: #fff !important; background: linear-gradient(180deg, rgb(255 255 255 / 32%), rgb(255 255 255 / 12%)) !important; }

/* Animated arrow on content buttons (not the compact header CTA) */
main .wp-block-button__link::after { z-index: 1; }
main .wp-block-button__link { padding-right: 2.6em !important; }
main .wp-block-button__link > .q-arrow, main .wp-block-button__link { --arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); }
main .wp-block-button__link { background-image: var(--arrow), linear-gradient(180deg, color-mix(in srgb, var(--wp--preset--color--accent) 96%, white) 0%, var(--wp--preset--color--accent) 52%, color-mix(in srgb, var(--wp--preset--color--accent-dark) 97%, black) 100%) !important; background-repeat: no-repeat !important; background-size: 1.05em, auto !important; background-position: right 1.1em center, 0 0 !important; transition: transform .25s cubic-bezier(.34, 1.4, .5, 1), background-position .35s cubic-bezier(.34, 1.4, .5, 1), box-shadow .2s !important; }
main .wp-block-button__link:hover { background-position: right .8em center, 0 0 !important; }
main .is-style-manjits-outline .wp-block-button__link { --arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E1B1B' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); background-image: var(--arrow), linear-gradient(180deg, rgb(255 255 255 / 92%), color-mix(in srgb, var(--wp--preset--color--brass-light) 22%, white)) !important; }
main .is-style-manjits-light .wp-block-button__link { background-image: var(--arrow), linear-gradient(180deg, rgb(255 255 255 / 22%), rgb(255 255 255 / 8%)) !important; }

@media (prefers-reduced-motion: reduce) {
	.wp-element-button::after, .wp-block-button__link::after { display: none; }
	.wp-block-button__link { transition: none !important; }
}

/* =====================================================================
   Colour-animated icons (site-wide)
   Every line icon slowly cycles through the brand palette – terracotta,
   brass, sage – and reacts on hover. Icons on filled buttons shimmer
   between white and cream so contrast stays high.
   ===================================================================== */
@keyframes q-hue {
	0%, 100% { color: var(--wp--preset--color--accent); }
	33% { color: var(--wp--preset--color--brass); }
	66% { color: var(--wp--preset--color--sage); }
}
@keyframes q-hue-dark { /* for dark backgrounds (footer, dark cards) */
	0%, 100% { color: color-mix(in srgb, var(--wp--preset--color--brass-light) 81%, white); }
	33% { color: color-mix(in srgb, var(--wp--preset--color--accent-light) 60%, white); }
	66% { color: #b7c9a8; }
}
@keyframes q-hue-light { /* icons sitting on a coloured button */
	0%, 100% { color: #fff; }
	50% { color: color-mix(in srgb, var(--wp--preset--color--accent-light) 21%, white); }
}
@keyframes q-hue-bg {
	0%, 100% { background-color: var(--wp--preset--color--sage); }
	33% { background-color: var(--wp--preset--color--accent); }
	66% { background-color: var(--wp--preset--color--brass); }
}
.q-ico { animation: q-hue 7s ease-in-out infinite; }
.q-btn--primary .q-ico, .q-cartbar .q-ico, .q-add .q-ico, .q-chip:has(input:checked) .q-ico, .q-chip[aria-pressed=true] .q-ico,
.q-daychip:has(input:checked) .q-ico, .q-glass-dark .q-ico { animation-name: q-hue-light; }
.q-contact__row svg { animation: q-hue 7s ease-in-out infinite; transition: transform .35s cubic-bezier(.2,1.4,.4,1); }
.q-footer .q-contact__row svg { animation-name: q-hue-dark; }
.q-contact__row:hover svg { transform: scale(1.15) rotate(-6deg); }
.q-contact__row:nth-child(2) svg { animation-delay: -2.3s; }
.q-contact__row:nth-child(3) svg { animation-delay: -4.6s; }
.q-gc__perks svg { animation: q-hue-bg 7s ease-in-out infinite; }
.q-gc__perks li:nth-child(2) svg { animation-delay: -2.3s; }
.q-gc__perks li:nth-child(3) svg { animation-delay: -4.6s; }
.q-design__tick, .q-done__icon { animation: q-hue-bg 7s ease-in-out infinite; }
.wp-block-social-links .wp-social-link svg { animation: q-hue-dark 7s ease-in-out infinite; transition: transform .35s cubic-bezier(.2,1.4,.4,1); }
.wp-block-social-links .wp-social-link:hover svg { transform: scale(1.18); }
.wp-block-social-links .wp-social-link:nth-child(2) svg { animation-delay: -3s; }
.q-datepick .q-ico { animation: q-hue 7s ease-in-out infinite; }

/* ---------- Dietary icons ---------- */
.q-diet { --dc: var(--wp--preset--color--sage); --dc2: #3f6b4e; display: inline-flex; align-items: center; gap: 2px; margin-left: 3px; padding: .1em .45em .1em .3em; border-radius: 999px; background: color-mix(in srgb, var(--dc) 13%, transparent); color: var(--dc); font-size: .72rem; font-weight: 800; letter-spacing: .03em; line-height: 1.5; vertical-align: 2px; white-space: nowrap; animation: q-diet-hue 5s ease-in-out infinite; }
.q-diet .q-dico { width: 1.4em; height: 1.4em; flex: none; }
.q-diet--gf { --dc: #8a5a0c; --dc2: #93600c; } /* Both shades ≥ 4.5:1 on the badge (small bold text). */
.q-diet--v  { --dc: #3d6b2a; --dc2: #44722f; }
.q-diet--vg { --dc: #22683f; --dc2: #2a7448; }
.q-diet--df { --dc: #2c5d8a; --dc2: #36689a; }
.q-diet--n  { --dc: #7a3f0c; --dc2: #8a4b12; }
@keyframes q-diet-hue { 0%, 100% { color: var(--dc); } 50% { color: var(--dc2); } }
.q-dico__sway { transform-box: fill-box; transform-origin: 50% 100%; animation: q-dico-sway 3.2s ease-in-out infinite; }
.q-dico__sway--r { animation-delay: -1.6s; }
.q-dico__slash { stroke-dasharray: 23; stroke-dashoffset: 23; animation: q-dico-slash 4s ease-in-out infinite; }
.q-dico__drip { transform-box: fill-box; transform-origin: 50% 0; animation: q-dico-drip 2.6s ease-in-out infinite; }
.q-dico__vein { stroke-dasharray: 16; animation: q-dico-vein 3.2s ease-in-out infinite; }
@keyframes q-dico-sway { 0%, 100% { transform: rotate(-5deg); } 50% { transform: rotate(5deg); } }
@keyframes q-dico-slash { 0%, 15% { stroke-dashoffset: 23; } 40%, 85% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -23; } }
@keyframes q-dico-drip { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(.9) translateY(1px); } }
@keyframes q-dico-vein { 0%, 100% { stroke-dashoffset: 0; } 50% { stroke-dashoffset: 8; } }
.q-chip--diet { display: inline-flex; align-items: center; gap: 6px; }
.q-chip--diet .q-dico { width: 18px; height: 18px; color: var(--dc); animation: q-diet-hue 5s ease-in-out infinite; }
.q-chip--diet[aria-pressed=true] .q-dico { color: #fff; animation: none; }
.q-dietkey { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 26px 0 0; padding: 14px 16px; border-radius: 14px; background: color-mix(in srgb, var(--wp--preset--color--cream, #f6f0e6) 70%, transparent); font-size: .82rem; }
.q-dietkey .q-diet { margin-left: 0; }
.q-dietkey .q-muted { flex-basis: 100%; }

@media (prefers-reduced-motion: reduce) {
	.q-ico, .q-contact__row svg, .q-gc__perks svg, .q-design__tick, .q-done__icon, .wp-social-link svg, .q-diet, .q-dico *, .q-chip--diet .q-dico { animation: none !important; }
}
.q-footer__links .q-footer__sep { margin-top: .9em; padding-top: .9em; border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 93%, white); }
.q-footer__credit { letter-spacing: .02em; text-align: center; }
.q-footer__credit a { color: var(--wp--preset--color--brass) !important; font-weight: 600; }
.q-footer__credit a:hover { color: var(--wp--preset--color--on-dark) !important; }
/* The bottom line: © on the left, the credit in the gap, the legal links on the right; where the three don't
   fit side by side, the credit takes its own line below, centred (phones: all three centred). Sized by the
   line's own width, not the window's. */
.q-footer .q-footer__bottom.is-layout-flex { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px 24px; container: q-footer-bottom / inline-size; }
.q-footer__bottom > p { margin: 0; grid-column: 1 / -1; text-align: center; }
.q-footer__bottom > .q-footer__legal { grid-row: 2; }
.q-footer__bottom > .q-footer__credit { grid-row: 3; }
@container q-footer-bottom (min-width: 900px) {
	.q-footer__bottom > p:first-child { grid-column: 1 / 3; grid-row: 1; text-align: left; }
	.q-footer__bottom > .q-footer__legal { grid-column: 3; grid-row: 1; text-align: right; }
	.q-footer__bottom > .q-footer__credit { grid-column: 1 / -1; grid-row: 2; }
}
@container q-footer-bottom (min-width: 1300px) {
	.q-footer__bottom > p:first-child { grid-column: 1; }
	.q-footer__bottom > .q-footer__credit { grid-column: 2; grid-row: 1; }
}

/* ===== Social links (WordPress's social-links block CSS – the parts the site uses) ===== */
.wp-block-social-links { box-sizing: border-box; list-style: none; margin-left: 0; padding-left: 0; padding-right: 0; text-indent: 0; font-size: 24px; }
.wp-block-social-links .wp-block-social-link.wp-social-link { display: inline-block; margin: 0; padding: 0; border-radius: 9999px; }
.wp-block-social-link a { display: flex; align-items: center; line-height: 0; text-decoration: none; }
.wp-block-social-links .wp-social-link svg { width: 1em; height: 1em; fill: currentColor; }
.wp-block-social-links.is-style-logos-only .wp-social-link svg { width: 1.25em; height: 1.25em; }
/* In the footer, under Visit: quiet round buttons in the footer's own colours – a fine ring and the mark in brass,
   like the contact icons above them; on hover each fills with its network's colour. currentColor-based, so they
   suit any footer colour the season's scheme picks. */
.q-footer .wp-block-social-links { gap: 10px; margin: 22px 0 0; }
.q-footer .wp-block-social-links .wp-social-link { margin: 0; }
.q-footer .wp-block-social-links .wp-social-link a {
	display: flex; align-items: center; justify-content: center; /* .q-footer li a would make it inline-block */
	width: 40px; height: 40px; min-height: 0; padding: 0; border-radius: 50%;
	color: var(--wp--preset--color--brass) !important;
	background: color-mix(in srgb, currentColor 8%, transparent);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 40%, transparent);
	transition: transform .3s cubic-bezier(.2,1.4,.4,1), background .25s, box-shadow .25s, color .25s;
}
.q-footer .wp-block-social-links .wp-social-link a:hover,
.q-footer .wp-block-social-links .wp-social-link a:focus-visible { color: #fff !important; box-shadow: 0 8px 18px -6px rgb(0 0 0 / 45%); transform: translateY(-2px); text-decoration: none; }
.q-footer .wp-social-link-instagram a:hover, .q-footer .wp-social-link-instagram a:focus-visible { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.q-footer .wp-social-link-facebook a:hover, .q-footer .wp-social-link-facebook a:focus-visible { background: #1877f2; }
.q-footer .wp-block-social-links .wp-social-link svg { width: 18px; height: 18px; animation: none; }
.q-footer .wp-block-social-links .wp-social-link:hover svg { transform: none; }

/* ===== Food type marks (veg / non-veg / seafood) ===== */
.q-mark { flex: none; width: 1.05em; height: 1.05em; vertical-align: -.14em; filter: drop-shadow(0 1px 1px rgb(0 0 0 / 12%)); }
.q-mark .q-mark__in { transform-box: fill-box; transform-origin: center; }
.q-mark--veg .q-mark__in { animation: q-mark-pulse 2.6s ease-in-out infinite; }
.q-mark--nonveg .q-mark__in { animation: q-mark-breathe 3s ease-in-out infinite; }
.q-mark--seafood .q-mark__in { animation: q-mark-swim 2.8s ease-in-out infinite; }
.q-mark--seafood .q-mark__bub { animation: q-mark-bubble 2.8s ease-in infinite; }
/* The same, for marks drawn once in the order page's sprite (<use href="#q-s-mark-…">). */
.q-sprite .q-mark__in { transform-box: fill-box; transform-origin: center; }
#q-s-mark-veg .q-mark__in { animation: q-mark-pulse 2.6s ease-in-out infinite; }
#q-s-mark-nonveg .q-mark__in { animation: q-mark-breathe 3s ease-in-out infinite; }
#q-s-mark-seafood .q-mark__in { animation: q-mark-swim 2.8s ease-in-out infinite; }
#q-s-mark-seafood .q-mark__bub { animation: q-mark-bubble 2.8s ease-in infinite; }
#q-s-chilli .q-chilli__shine { animation: q-chilli-shine 2.4s ease-in-out infinite; }
@keyframes q-mark-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(.82); } }
@keyframes q-mark-breathe { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-.6px) scale(1.08); } }
@keyframes q-mark-swim { 0%, 100% { transform: translateX(-1px) rotate(-4deg); } 50% { transform: translateX(1px) rotate(4deg); } }
@keyframes q-mark-bubble { 0% { transform: translateY(3px); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateY(-2px); opacity: 0; } }
.q-marks { display: inline-flex; gap: 1px; vertical-align: -.14em; }
.q-marks .q-mark { width: .95em; height: .95em; vertical-align: 0; }
.q-item__mark { display: inline-flex; margin-right: .35em; vertical-align: -.1em; }

/* ===== Chillies ===== */
.q-spice { display: inline-flex; align-items: center; gap: 0; margin-left: .2em; vertical-align: -.16em; white-space: nowrap; }
/* Sweet dishes: the sweet mark in place of chillies. */
.q-sweet { display: inline-flex; align-items: center; margin-left: .2em; vertical-align: -.16em; }
.q-sweet__ico { width: 1.05em; height: 1.05em; filter: drop-shadow(0 1px 1px rgb(143 31 82 / 25%)); }
.q-chilli { width: 1.05em; height: 1.05em; flex: none; margin-right: -.18em; transform-origin: 70% 20%; animation: q-chilli-sway 2.4s ease-in-out infinite; filter: drop-shadow(0 1px 1px rgb(120 0 0 / 25%)); }
.q-chilli:nth-child(2) { animation-delay: -.8s; }
.q-chilli:nth-child(3) { animation-delay: -1.6s; }
.q-chilli__shine { animation: q-chilli-shine 2.4s ease-in-out infinite; }
.q-spice--3 .q-chilli { animation: q-chilli-sway 1.6s ease-in-out infinite, q-chilli-heat 1.2s ease-in-out infinite alternate; }
@keyframes q-chilli-sway { 0%, 100% { transform: rotate(-7deg); } 50% { transform: rotate(7deg); } }
@keyframes q-chilli-shine { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
@keyframes q-chilli-heat { from { filter: drop-shadow(0 0 0 rgb(255 70 20 / 0%)); } to { filter: drop-shadow(0 0 3px rgb(255 70 20 / 70%)); } }
@media (prefers-reduced-motion: reduce) { .q-mark *, .q-chilli, .q-chilli *, .q-sprite * { animation: none !important; } }

/* ===================== 404: "This plate is empty" ===================== */
.q-404 { position: relative; overflow: hidden; isolation: isolate; padding: clamp(48px, 8vw, 104px) 20px clamp(56px, 9vw, 112px); text-align: center; background: radial-gradient(120% 80% at 50% 0%, color-mix(in srgb, var(--wp--preset--color--brass) 16%, var(--wp--preset--color--cream)) 0%, var(--wp--preset--color--cream) 55%, var(--wp--preset--color--base) 100%); }
.q-404__inner { position: relative; max-width: 960px; margin: 0 auto; }
.q-404__code { display: flex; align-items: center; justify-content: center; gap: clamp(4px, 1.5vw, 18px); margin: 0 auto 6px; }
.q-404__digit { font-family: var(--wp--preset--font-family--display); font-size: clamp(6.5rem, 21vw, 12.5rem); font-weight: 600; line-height: .9; color: var(--wp--preset--color--accent); text-shadow: 0 10px 30px color-mix(in srgb, var(--wp--preset--color--accent) 22%, transparent); animation: q404-rise .8s cubic-bezier(.2, .8, .2, 1) both; }
.q-404__digit:last-child { animation-delay: .12s; }
.q-404__pot { width: clamp(7.5rem, 24vw, 14rem); height: auto; overflow: visible; animation: q404-rise .8s .06s cubic-bezier(.2, .8, .2, 1) both; }
.q-404__handi { transform-origin: 100px 168px; animation: q404-sway 4.5s 1s ease-in-out infinite; }
.q-404__body { fill: var(--wp--preset--color--accent-dark); }
.q-404__rim { fill: var(--wp--preset--color--brass); }
.q-404__inside { fill: color-mix(in srgb, var(--wp--preset--color--espresso) 70%, black); }
.q-404__ear { stroke: var(--wp--preset--color--brass); stroke-width: 8; stroke-linecap: round; }
.q-404__band { stroke: color-mix(in srgb, var(--wp--preset--color--brass) 70%, white); stroke-width: 4; opacity: .7; }
.q-404__base { fill: color-mix(in srgb, var(--wp--preset--color--accent-dark) 70%, black); }
.q-404__shine { stroke: rgb(255 255 255 / 22%); stroke-width: 5; stroke-linecap: round; }
.q-404__shadow { fill: rgb(42 33 28 / 14%); transform-origin: 100px 176px; animation: q404-shadow 4.5s 1s ease-in-out infinite; }
.q-404__wisp { stroke: color-mix(in srgb, var(--wp--preset--color--muted) 55%, transparent); stroke-width: 5; stroke-dasharray: 90; stroke-dashoffset: 90; opacity: 0; animation: q404-steam 3.6s ease-in-out infinite; }
.q-404__wisp--2 { animation-delay: 1.2s; }
.q-404__wisp--3 { animation-delay: 2.4s; }
.q-404__eyebrow { margin: 0 0 6px; font-size: var(--wp--preset--font-size--x-small); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--wp--preset--color--accent-dark); animation: q404-fade .7s .25s both; }
.q-404__title { margin: 0 0 12px; font-family: var(--wp--preset--font-family--display); font-size: clamp(2.1rem, 5vw, 3.4rem); line-height: 1.08; color: var(--wp--preset--color--contrast); animation: q404-fade .7s .32s both; }
.q-404__lead { max-width: 34em; margin: 0 auto 26px; font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--muted); animation: q404-fade .7s .4s both; }
.q-404__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-bottom: clamp(36px, 6vw, 56px); animation: q404-fade .7s .48s both; }
.q-404__btn { display: inline-flex; align-items: center; min-height: 48px; padding: 0 26px; border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 18%, transparent); border-radius: 999px; background: rgb(255 255 255 / 70%); color: var(--wp--preset--color--contrast); font-weight: 600; text-decoration: none; transition: transform .18s, box-shadow .18s, background .18s; }
.q-404__btn:hover, .q-404__btn:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 22px rgb(42 33 28 / 14%); background: #fff; }
.q-404__btn--primary { border-color: transparent; background: linear-gradient(180deg, var(--wp--preset--color--accent), var(--wp--preset--color--accent-dark)); color: #fff; box-shadow: 0 8px 20px color-mix(in srgb, var(--wp--preset--color--accent) 35%, transparent); }
.q-404__btn--primary:hover, .q-404__btn--primary:focus-visible { background: linear-gradient(180deg, var(--wp--preset--color--accent), var(--wp--preset--color--accent-dark)); color: #fff; }
.q-404__links { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); margin: 0 0 28px; padding: 0; list-style: none; text-align: left; }
.q-404__links li { animation: q404-rise .6s calc(.55s + var(--i) * .08s) cubic-bezier(.2, .8, .2, 1) both; }
.q-404__links a { display: grid; align-content: start; gap: 4px; height: 100%; box-sizing: border-box; padding: 18px 18px 20px; border: 1px solid var(--wp--preset--color--line); border-radius: 18px; background: var(--wp--preset--color--surface); color: var(--wp--preset--color--contrast); text-decoration: none; transition: transform .2s, box-shadow .2s, border-color .2s; }
.q-404__links a:hover, .q-404__links a:focus-visible { transform: translateY(-4px); border-color: color-mix(in srgb, var(--wp--preset--color--accent) 45%, transparent); box-shadow: 0 16px 32px rgb(42 33 28 / 12%); }
.q-404__links strong { font-family: var(--wp--preset--font-family--display); font-size: 1.15rem; }
.q-404__links span { color: var(--wp--preset--color--muted); font-size: .92rem; line-height: 1.45; }
.q-404__ico { width: 40px; height: 40px; margin-bottom: 6px; padding: 9px; box-sizing: border-box; border-radius: 12px; background: color-mix(in srgb, var(--wp--preset--color--accent) 12%, white); fill: none; stroke: var(--wp--preset--color--accent-dark); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s; }
.q-404__links a:hover .q-404__ico { transform: rotate(-8deg) scale(1.08); }
.q-404__help { margin: 0; color: var(--wp--preset--color--muted); font-size: .95rem; }
.q-404__help a { color: var(--wp--preset--color--accent-dark); font-weight: 600; }
.q-404__spices { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.q-404__spice { position: absolute; width: 22px; stroke-width: 1.6; stroke-linejoin: round; animation: q404-float 14s ease-in-out infinite; }
.q-404__spice--pod { fill: color-mix(in srgb, var(--wp--preset--color--sage) 30%, transparent); stroke: color-mix(in srgb, var(--wp--preset--color--sage) 55%, transparent); }
.q-404__spice--star { fill: color-mix(in srgb, var(--wp--preset--color--accent-dark) 18%, transparent); stroke: color-mix(in srgb, var(--wp--preset--color--accent-dark) 35%, transparent); }
.q-404__spice--1 { left: 6%; top: 14%; }
.q-404__spice--2 { left: 18%; top: 62%; width: 16px; animation-delay: -3s; animation-duration: 17s; }
.q-404__spice--3 { left: 84%; top: 18%; width: 26px; animation-delay: -6s; }
.q-404__spice--4 { left: 92%; top: 58%; width: 14px; animation-delay: -9s; animation-duration: 19s; }
.q-404__spice--5 { left: 70%; top: 80%; animation-delay: -2s; animation-duration: 16s; }
.q-404__spice--6 { left: 32%; top: 8%; width: 13px; animation-delay: -11s; }
.q-404__spice--7 { left: 4%; top: 86%; width: 18px; animation-delay: -5s; animation-duration: 21s; }
@keyframes q404-rise { from { opacity: 0; transform: translateY(26px); } }
@keyframes q404-fade { from { opacity: 0; transform: translateY(10px); } }
@keyframes q404-sway { 0%, 100% { transform: rotate(0); } 30% { transform: rotate(-4deg); } 60% { transform: rotate(3deg); } }
@keyframes q404-shadow { 0%, 100% { transform: scaleX(1); } 30% { transform: scaleX(.94); } 60% { transform: scaleX(1.04); } }
@keyframes q404-steam { 0% { stroke-dashoffset: 90; opacity: 0; transform: translateY(6px); } 25% { opacity: .9; } 70% { opacity: .5; } 100% { stroke-dashoffset: -90; opacity: 0; transform: translateY(-14px); } }
@keyframes q404-float { 0%, 100% { transform: translate(0, 0) rotate(0); } 33% { transform: translate(14px, -22px) rotate(40deg); } 66% { transform: translate(-10px, 12px) rotate(-25deg); } }
@media (max-width: 600px) {
	.q-404__lead { font-size: 1.05rem; }
	.q-404__links { grid-template-columns: 1fr 1fr; gap: 10px; }
	.q-404__links a { padding: 14px; }
	.q-404__links span { display: none; }
	.q-404__spice--3, .q-404__spice--6 { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.q-404 *, .q-404 { animation: none !important; transition: none !important; }
	.q-404__wisp { stroke-dashoffset: 0; opacity: .6; }
}

/* Touch targets: footer menus, legal links, contact rows and breadcrumbs are at least 24 px tall
   (WCAG 2.2 target size) without changing the look – the padding sits inside the line gaps. */
.q-footer li a, .q-footer__legal a, .q-footer__credit a, .q-footer .q-contact__row a, .q-footer .q-contact__row span a, .q-ph__crumbs a {
	display: inline-block; min-height: 24px; padding-block: 3px; line-height: 18px; box-sizing: border-box;
}
.q-footer li + li { margin-top: 2px; }
