/* =========================================================================
   Mustafa Jewellers — Sanjeev-style layer (cards, bag drawer, sections)
   Loaded after main.css.
   ========================================================================= */

:root {
	--maroon: #561107;
	--maroon-dark: #3f0c04;
	--sand: #f7f3ef;
	--paper: #fffdfb;
	--display: "Cormorant Garamond", "Playfair Display", Georgia, serif;
}

body { background: var(--paper); }
.site-header { background: var(--sand); }
.mj-home .site-header { background: transparent; }

/* ---------------------------------------------------------------- headings & buttons */
.mj-band-title { font: 500 clamp(26px, 3vw, 36px)/1.15 var(--display); text-transform: uppercase; letter-spacing: .03em; color: var(--ink); margin: 0 0 14px; }
.mj-band-title--center { text-align: center; }
.mj-band-text { font: 400 18px/1.6 var(--display); color: #4a4540; max-width: 900px; margin: 0 0 28px; }
.mj-btn--maroon { background: var(--maroon); color: #fff; border-radius: 3px; }
.mj-btn--maroon:hover { background: var(--maroon-dark); color: #fff; }
.mj-btn--block { width: 100%; }
.mj-text-link { display: inline-block; font: 500 16px/1.2 var(--display); color: var(--ink); border-bottom: 1px solid currentColor; padding-bottom: 3px; }
.mj-text-link:hover { color: var(--maroon); }
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt, .wp-element-button, .wc-block-components-button:not(.is-link) { background: var(--maroon) !important; border-radius: 3px !important; }
.woocommerce a.button:hover, .woocommerce button.button:hover, .wp-element-button:hover, .wc-block-components-button:not(.is-link):hover { background: var(--maroon-dark) !important; }

/* ---------------------------------------------------------------- header search pill */
.mj-search-pill { display: flex; align-items: center; width: 210px; height: 40px; padding: 0 6px 0 18px; background: #fff; border-radius: 40px; margin-right: 6px; }
.mj-search-pill input { flex: 1; min-width: 0; border: 0; background: transparent; font: 400 15px var(--display); color: var(--ink); }
.mj-search-pill input:focus { outline: none; }
.mj-search-pill button { display: grid; place-items: center; width: 30px; height: 30px; border: 0; background: none; color: var(--muted); }
.mj-home .mj-search-pill { background: rgba(255, 255, 255, .85); }
.site-header__actions .mj-search-toggle { display: none; }
.site-nav__list { gap: clamp(14px, 1.6vw, 26px); }
.site-nav__list > li > a { font-size: 14.5px; white-space: nowrap; }
@media (min-width: 961px) and (max-width: 1240px) { .site-nav__optional { display: none !important; } .site-nav__list { gap: 16px; } .site-nav__list > li > a { font-size: 14px; } }
.site-nav__mobile-only { display: none !important; }
@media (max-width: 1180px) {
	.mj-search-pill { display: none; }
	.site-header__actions .mj-search-toggle { display: inline-grid; }
}

/* category drop-downs */
.mj-mega__inner--cat { grid-template-columns: 1fr 1.25fr; max-width: 620px; background: var(--sand); }
.mj-mega__inner--cat .mj-mega__col li a { font: 400 17px/1.3 var(--display); }
.mj-mega__inner--cat .mj-mega__feature { min-height: 250px; background: #fff; }
.mj-mega__inner--cat .mj-mega__feature img { object-fit: contain; padding: 16px; }

/* ---------------------------------------------------------------- product cards (Sanjeev) */
.mj-card { background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0; transform: none !important; overflow: visible; }
.mj-card:hover { box-shadow: none; }
.mj-card__media { background: #fff !important; border: 0 !important; border-radius: 6px 6px 0 0; aspect-ratio: 1 / .9; }
.mj-card__img { object-fit: contain !important; padding: 6%; }
.mj-card:hover .mj-card__img { transform: scale(1.03); }
.mj-card__body { background: #fff; border-radius: 0 0 6px 6px; padding: 16px 18px 18px !important; gap: 8px; flex: 1; }
.mj-card__title { font: 400 19px/1.25 var(--display) !important; color: var(--ink); }
.mj-shop .mj-card__title { font-size: 19px !important; }
.mj-card__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; }
.mj-card__price { font: 400 15px var(--display); color: #4a4540; }
.mj-card .mj-wish { position: static; width: 34px; height: 34px; background: transparent; color: var(--maroon); }
.mj-card .mj-wish:hover { transform: scale(1.1); }
.mj-card .mj-wish[aria-pressed="true"] .mj-icon { fill: var(--maroon); }
.mj-card__btn { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 14px !important; min-height: 46px; background: var(--maroon) !important; color: #fff !important; border: 0 !important; border-radius: 3px; font: 600 12px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.mj-card__btn:hover { background: var(--maroon-dark) !important; }
.mj-card__btn.loading { opacity: .7; }
.mj-card__btn.added::after { content: " ✓"; }
.mj-card a.added_to_cart { display: none !important; }
.mj-shop .mj-card__media { border: 0 !important; }
.mj-grid--4 { row-gap: 34px; }

/* ---------------------------------------------------------------- homepage bands */
.mj-products-band { background: var(--sand); }
.mj-products-band--alt { background: var(--paper); }
.mj-products-band--alt .mj-card__media, .mj-products-band--alt .mj-card__body { background: #fff; box-shadow: 0 1px 0 #efe9df; }

/* circles */
.mj-circles__grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 34px 46px; }
.mj-circle { display: flex; flex-direction: column; align-items: center; gap: 14px; width: 150px; }
.mj-circle__img { display: block; width: 140px; height: 140px; border-radius: 50%; padding: 5px; border: 1.5px solid var(--maroon); background: #fff; transition: transform .3s; }
.mj-circle__img img { width: 100%; height: 100%; border-radius: 50%; object-fit: contain; padding: 12%; background: #fff; }
.mj-circle:hover .mj-circle__img { transform: translateY(-4px); }
.mj-circle__name { font: 600 14px/1.2 var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--ink); text-align: center; }

/* where it all began */
.mj-story { background: var(--sand); }
.mj-story__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(30px, 6vw, 90px); align-items: center; }
.mj-story__media { position: relative; padding-bottom: 50px; }
.mj-story__img { width: 82%; aspect-ratio: 4 / 3; object-fit: cover; }
.mj-story__circle { position: absolute; right: 4%; bottom: 0; width: 46%; aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 6px solid var(--sand); }
.mj-story__circle img { width: 100%; height: 100%; object-fit: cover; }
.mj-story__text p { font: 400 19px/1.65 var(--display); color: #4a4540; margin-bottom: 22px; }

/* video bands */
.mj-vband { padding: clamp(40px, 6vw, 80px) 0; background: var(--paper); }
.mj-vband--flip { background: var(--sand); }
.mj-vband__grid { display: grid; grid-template-columns: minmax(260px, 420px) 1fr; gap: clamp(30px, 6vw, 90px); align-items: center; }
.mj-vband--flip .mj-vband__media { order: 2; }
.mj-vband__media .mj-vid { aspect-ratio: 4 / 5; border-radius: 6px; }
.mj-vband__text p { font: 400 19px/1.65 var(--display); color: #4a4540; max-width: 520px; margin-bottom: 26px; }

/* reviews */
.mj-reviews { background: var(--sand); }
.mj-reviews__summary { display: flex; justify-content: center; margin: 0 0 28px; }
.mj-reviews__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.mj-review { margin: 0; background: #fff; border-radius: 6px; padding: 26px 26px 22px; }
.mj-review__stars { display: flex; gap: 2px; color: #d4a24c; margin-bottom: 12px; }
.mj-review blockquote { margin: 0 0 14px; font: italic 400 20px/1.5 var(--display); color: var(--ink); }
.mj-review figcaption { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }

/* accordions (product page + FAQ) */
.mj-acc { border-top: 1px solid var(--line); }
.mj-acc details { border-bottom: 1px solid var(--line); }
.mj-acc summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 2px; cursor: pointer; list-style: none; font: 500 15px/1.3 var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--ink); }
.mj-acc summary::-webkit-details-marker { display: none; }
.mj-acc summary::after { content: "+"; font: 300 22px/1 var(--sans); color: var(--muted); transition: transform .25s; }
.mj-acc details[open] summary::after { transform: rotate(45deg); }
.mj-acc__body { padding: 0 2px 18px; font: 400 17px/1.6 var(--display); color: #4a4540; }
.mj-acc__body p { margin: 0 0 10px; }
.mj-acc--faq summary { text-transform: none; letter-spacing: .01em; font-size: 19px; }

/* FAQ preview + page */
.mj-faq-home__grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: clamp(30px, 6vw, 90px); align-items: start; }
.mj-faq__grid { display: grid; grid-template-columns: 240px 1fr; gap: clamp(24px, 5vw, 70px); align-items: start; }
.mj-faq__topics { position: sticky; top: 24px; display: grid; gap: 4px; }
.mj-faq__topics a { padding: 10px 14px; border-left: 2px solid var(--line); font: 500 17px/1.3 var(--display); color: var(--muted); }
.mj-faq__topics a:hover, .mj-faq__topics a.is-active { border-color: var(--maroon); color: var(--ink); }
.mj-faq__group { margin-bottom: 36px; scroll-margin-top: 30px; }
.mj-faq__group h2 { font: 500 22px/1.2 var(--display); text-transform: uppercase; letter-spacing: .05em; margin: 0 0 6px; }
.mj-faq__more { margin-top: 20px; padding: 24px; background: var(--sand); border-radius: 6px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; }
.mj-faq__more p { margin: 0; font: 400 20px var(--display); }

/* service tiles */
.mj-tiles__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 3vw, 36px); }
.mj-tile { display: flex; flex-direction: column; gap: 10px; }
.mj-tile__img { display: block; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 4px; background: var(--card); }
.mj-tile__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s; }
.mj-tile:hover .mj-tile__img img { transform: scale(1.04); }
.mj-tile__title { font: 500 22px/1.2 var(--display); color: var(--ink); margin-top: 6px; }
.mj-tile .mj-text-link { align-self: flex-start; font-size: 14px; }

/* shop page title in Sanjeev serif */
.mj-shop-head__title { font-family: var(--display) !important; font-weight: 500 !important; letter-spacing: .03em; }
.mj-shop-head__desc { font: 400 18px/1.6 var(--display); }
.mj-filter select { font-family: var(--display); font-size: 14px; letter-spacing: .1em; }

/* ---------------------------------------------------------------- product page (Sanjeev) */
.woocommerce div.product .product_title { font: 400 clamp(30px, 3vw, 40px)/1.15 var(--display) !important; text-transform: uppercase; letter-spacing: .06em; }
.woocommerce div.product .woocommerce-product-details__short-description { font: 400 18px/1.6 var(--display); color: #4a4540; }
.mj-pp-price { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 18px; border-bottom: 1px solid var(--line); margin-bottom: 18px; }
.mj-pp-price .price { font: 500 26px/1.2 var(--display) !important; color: var(--ink) !important; margin: 0 !important; }
.mj-wish--inline { position: static; width: 40px; height: 40px; background: transparent; color: var(--ink); }
.mj-stock { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #1f7a3c; margin: 0 0 14px; }
.mj-stock span { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.mj-stock--low { color: #b7791f; }
.mj-stock--out { color: var(--sale); }
.woocommerce div.product form.cart { margin-bottom: 8px; }
.woocommerce div.product form.cart .single_add_to_cart_button { min-height: 52px; font-size: 13px !important; }
.mj-pp-note { text-align: center; font: italic 400 15px var(--display); color: var(--muted); margin: 0 0 12px; }
.mj-pp-collect { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 13px; background: var(--sand); font-size: 13.5px; color: var(--ink); margin-bottom: 12px; }
.mj-pp-delivery { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); margin: 0 0 22px; }
.mj-pp-delivery .mj-icon, .mj-pp-collect .mj-icon { color: var(--gold); }
.mj-pp-specs { list-style: none; padding: 0; margin: 12px 0 0; display: grid; gap: 6px; }
.mj-pp-specs li { display: flex; gap: 12px; font-size: 16px; }
.mj-pp-specs span { min-width: 80px; color: var(--muted); }
.woocommerce div.product .woocommerce-tabs ul.tabs { border: 0; justify-content: flex-start; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { font: 500 22px/1.2 var(--display) !important; letter-spacing: .04em; text-transform: uppercase; color: var(--ink) !important; border: 0 !important; }
.woocommerce div.product .related > h2 { font: 500 clamp(26px, 3vw, 36px)/1.15 var(--display); text-transform: uppercase; letter-spacing: .03em; text-align: left; }

/* ---------------------------------------------------------------- slide-out shopping bag */
.mj-bag-scrim { position: fixed; inset: 0; z-index: 990; background: rgba(12, 10, 8, .45); }
.mj-bag-scrim[hidden] { display: none; }
.mj-bag { position: fixed; top: 0; right: 0; bottom: 0; z-index: 1000; width: min(420px, 100vw); display: flex; flex-direction: column; background: var(--paper); box-shadow: -12px 0 40px rgba(0, 0, 0, .18); transform: translateX(105%); transition: transform .35s ease; }
.mj-bag.is-open { transform: none; }
.admin-bar .mj-bag { top: 32px; }
.mj-bag__head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid var(--line); }
.mj-bag__head h2 { font: 500 17px/1.2 var(--display); letter-spacing: .2em; text-transform: uppercase; margin: 0; }
.mj-bag__close { display: grid; place-items: center; width: 36px; height: 36px; border: 0; background: none; color: var(--ink); }
.mj-bag__notice { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 12px 22px; background: var(--sand); font: 400 14px/1.45 var(--display); color: #5b554e; }
.mj-bag__notice .mj-icon { margin-top: 2px; flex: none; }
.mj-bag__body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.mj-bag__inner { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.mj-bag__items { flex: 1; overflow-y: auto; list-style: none; margin: 0; padding: 18px 22px; display: grid; gap: 14px; align-content: start; }
.mj-bag__item { display: grid; grid-template-columns: 84px 1fr; gap: 14px; padding: 14px; background: #fff; border-radius: 4px; }
.mj-bag__thumb img { width: 84px; height: 84px; object-fit: contain; display: block; }
.mj-bag__info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.mj-bag__top { display: flex; justify-content: space-between; gap: 8px; }
.mj-bag__name { font: 500 15px/1.3 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--ink); }
.mj-bag__remove { flex: none; width: 28px; height: 28px; display: grid; place-items: center; border: 0; background: none; color: var(--muted); }
.mj-bag__remove:hover { color: var(--sale); }
.mj-bag__meta { font-size: 12px; color: var(--muted); }
.mj-bag__stock { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #9a6a10; }
.mj-bag__stock::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #d39b2a; }
.mj-bag__bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; }
.mj-bag__price { font: 500 16px var(--display); color: var(--ink); }
.mj-qty { display: inline-flex; align-items: center; height: 36px; border: 1px solid var(--line); border-radius: 40px; background: #fff; }
.mj-qty button { width: 34px; height: 34px; border: 0; background: none; font-size: 18px; color: var(--ink); }
.mj-qty button:disabled { opacity: .35; cursor: default; }
.mj-qty span { min-width: 24px; text-align: center; font-size: 13px; }
.mj-bag__note { margin: 0 22px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.mj-bag__note summary { display: flex; justify-content: space-between; align-items: center; padding: 14px 0; cursor: pointer; list-style: none; font: 500 14px var(--display); letter-spacing: .18em; text-transform: uppercase; }
.mj-bag__note summary::-webkit-details-marker { display: none; }
.mj-bag__note summary span { font-size: 20px; }
.mj-bag__note[open] summary span { transform: rotate(45deg); }
.mj-bag__note textarea { width: 100%; margin-bottom: 14px; border: 1px solid var(--line); border-radius: 3px; padding: 10px 12px; font: 400 15px var(--display); resize: vertical; background: #fff; }
.mj-bag__foot { padding: 18px 22px 20px; border-top: 1px solid var(--line); background: var(--paper); }
.mj-bag__total { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 14px; }
.mj-bag__total span { font: 500 14px var(--display); letter-spacing: .18em; text-transform: uppercase; }
.mj-bag__total strong { font: 500 20px var(--display); }
.mj-bag__view { display: block; text-align: center; margin-top: 10px; font: 400 15px var(--display); text-decoration: underline; color: var(--ink); }
.mj-bag__secure { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 12px 0 0; font-size: 11.5px; color: var(--muted); }
.mj-bag__empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 40px 22px; text-align: center; color: var(--muted); }
.mj-bag__empty p { font: 400 19px var(--display); margin: 0; }

/* ---------------------------------------------------------------- footer (Sanjeev) */
.site-footer { background: var(--sand); }
.mj-promises { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; background: #fff; border-radius: 6px; padding: 34px 20px; margin-bottom: 46px; text-align: center; }
.mj-promise { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 0 24px; }
.mj-promise + .mj-promise { border-left: 1px solid var(--line); }
.mj-promise .mj-icon { color: var(--maroon); }
.mj-promise h2 { font: 500 22px/1.2 var(--display); margin: 4px 0 0; color: var(--ink); }
.mj-promise p { font: 400 16px/1.5 var(--display); color: var(--muted); margin: 0 0 4px; max-width: 280px; }
.mj-promise .mj-text-link { font-size: 14px; }
.site-footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1.5fr; }
.site-footer h2 { font-family: var(--display); font-size: 14px; font-weight: 600; letter-spacing: .16em; }
.site-footer__links a { font: 400 16px var(--display); letter-spacing: .04em; text-transform: uppercase; font-size: 13.5px; }
.mj-newsletter input { border-right: 1px solid var(--line); border-radius: 3px; }
.mj-newsletter button { width: auto; padding: 0 18px; margin-left: 8px; background: var(--maroon); border-color: var(--maroon); color: #fff; border-radius: 3px; font: 600 11.5px var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.mj-newsletter button:hover { background: var(--maroon-dark); }

/* ---------------------------------------------------------------- responsive */
@media (max-width: 960px) {
	.site-nav__mobile-only { display: block !important; }
	.mj-story__grid, .mj-vband__grid, .mj-faq-home__grid, .mj-faq__grid { grid-template-columns: 1fr; }
	.mj-vband--flip .mj-vband__media { order: 0; }
	.mj-vband__media { max-width: 420px; }
	.mj-reviews__grid { grid-template-columns: 1fr; }
	.mj-faq__topics { position: static; grid-auto-flow: column; overflow-x: auto; }
	.mj-faq__topics a { white-space: nowrap; border-left: 0; border-bottom: 2px solid var(--line); }
	.site-footer__grid { grid-template-columns: 1fr 1fr; }
	.mj-promises { grid-template-columns: 1fr; gap: 26px; }
	.mj-promise + .mj-promise { border-left: 0; border-top: 1px solid var(--line); padding-top: 24px; }
}
@media (max-width: 640px) {
	.mj-circle { width: 110px; }
	.mj-circle__img { width: 104px; height: 104px; }
	.mj-tiles__grid { grid-template-columns: 1fr; }
	.mj-card__title { font-size: 16px !important; }
	.mj-card__btn { font-size: 10.5px; min-height: 40px; letter-spacing: .06em; }
	.mj-bag__item { grid-template-columns: 64px 1fr; }
	.mj-bag__thumb img { width: 64px; height: 64px; }
}

/* ---------------------------------------------------------------- full-width menu drop-downs */
.mj-mega { left: var(--gutter); right: var(--gutter); }
.mj-mega__inner--cat { max-width: none; width: 100%; grid-template-columns: 210px minmax(0, 1fr) 260px; gap: 34px; padding: 34px 38px; background: var(--sand); border-radius: 0 0 8px 8px; box-shadow: 0 24px 50px rgba(20, 20, 20, .14); }
.mj-mega__inner--cat .mj-mega__col { border-right: 1px solid var(--line); padding-right: 24px; }
.mj-mega__inner--cat .mj-mega__col ul { margin-bottom: 22px; }
.mj-mega__inner--cat .mj-mega__col li a { font-size: 19px; padding: 7px 0; }
.mj-mega__products { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.mj-mega__product { display: flex; flex-direction: column; gap: 6px; }
.mj-mega__product-img { display: block; aspect-ratio: 1; background: #fff; border-radius: 6px; overflow: hidden; }
.mj-mega__product-img img { width: 100%; height: 100%; object-fit: contain; padding: 8%; transition: transform .5s; }
.mj-mega__product:hover .mj-mega__product-img img { transform: scale(1.05); }
.mj-mega__product-name { font: 400 17px/1.25 var(--display); color: var(--ink); }
.mj-mega__product-price { font: 400 15px var(--display); color: var(--muted); }
.mj-mega__inner--cat .mj-mega__feature { min-height: 300px; border-radius: 6px; }
@media (max-width: 960px) {
	.mj-mega__inner--cat { grid-template-columns: 1fr; padding: 8px 0 14px; box-shadow: none; background: transparent; }
	.mj-mega__inner--cat .mj-mega__col { border: 0; padding: 0; }
	.mj-mega__products, .mj-mega__inner--cat .mj-mega__feature { display: none; }
}

/* ---------------------------------------------------------------- hero fills the whole screen on arrival */
.mj-hero { min-height: 100vh; min-height: 100svh; display: flex; }
.admin-bar .mj-hero { min-height: calc(100vh - 32px); min-height: calc(100svh - 32px); }
.mj-hero__inner { flex: 1; min-height: 0 !important; }
@media (max-width: 782px) {
	.admin-bar .mj-hero { min-height: calc(100vh - 46px); min-height: calc(100svh - 46px); }
}

/* ---------------------------------------------------------------- drop-down joined to the menu bar
   The panel hangs straight off the header, spans the full width, uses the same colour,
   and the header's bottom line disappears while it is open. */
@media (min-width: 961px) {
	.mj-mega { left: calc(50% - 50vw); right: calc(50% - 50vw); top: 100%; padding-top: 0; transform: none; transition: opacity .2s, visibility .2s; }
	.has-mega:hover > .mj-mega, .has-mega:focus-within > .mj-mega { transform: none; }
	.mj-mega__inner--cat { max-width: calc(var(--container) + var(--gutter) * 2); margin: 0 auto; background: transparent; box-shadow: none; border-radius: 0; padding: 30px var(--gutter) 40px; }
	.mj-mega::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--sand); box-shadow: 0 30px 40px -20px rgba(20, 20, 20, .18); }
	.site-header:has(.has-mega:hover), .site-header:has(.has-mega:focus-within) { box-shadow: none; background: var(--sand); }
	.mj-home .site-header:has(.has-mega:hover), .mj-home .site-header:has(.has-mega:focus-within) { background: var(--sand); }
	.mj-mega { z-index: 60; }
	.mj-mega::after { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; } /* hover bridge */
}

/* ---------------------------------------------------------------- category circles: all on one line */
.mj-circles__grid { display: flex; flex-wrap: nowrap; justify-content: space-between; gap: clamp(8px, 1.6vw, 24px); }
.mj-circle { flex: 1 1 0; min-width: 0; width: auto; max-width: 150px; gap: 12px; }
.mj-circle__img { width: 100%; height: auto; aspect-ratio: 1; max-width: 140px; }
.mj-circle__name { font-size: clamp(11px, 1.05vw, 14px); letter-spacing: .08em; }
@media (max-width: 760px) {
	.mj-circles__grid { justify-content: flex-start; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; }
	.mj-circle { flex: 0 0 96px; scroll-snap-align: start; }
}

/* ---------------------------------------------------------------- official logo in the header */
.mj-logo--header { width: auto; height: 60px; display: inline-flex; align-items: center; gap: 10px; color: var(--gold-ink); }
.mj-logo--header img { width: auto; height: 56px; max-height: none; }
.mj-logo__text { display: flex; flex-direction: column; align-items: center; line-height: 1; }
.mj-logo__name { font: 600 21px/1 var(--display); letter-spacing: .2em; text-transform: uppercase; color: #a8802f; }
.mj-logo__sub { font: 500 9.5px/1 var(--sans); letter-spacing: .5em; text-transform: uppercase; color: #a8802f; margin-top: 6px; padding-left: .5em; }
.mj-logo--footer { width: 190px; height: auto; display: block; }
.mj-logo--footer img { width: 190px; height: auto; max-height: none; }
@media (max-width: 1240px) { .mj-logo__text { display: none; } }
@media (max-width: 960px) { .mj-logo__text { display: flex; } .mj-logo--header img { height: 46px; } .mj-logo__name { font-size: 17px; } }

/* ---------------------------------------------------------------- readable header over dark hero photos */
.mj-home .site-header::before { content: ""; position: absolute; inset: 0 0 -30px; z-index: -1; pointer-events: none; background: linear-gradient(180deg, rgba(247, 243, 239, .92) 0%, rgba(247, 243, 239, .72) 60%, rgba(247, 243, 239, 0) 100%); }
.mj-home .site-header__actions .mj-icon-btn { background: rgba(255, 255, 255, .92); box-shadow: 0 2px 10px rgba(0, 0, 0, .12); }
.mj-home .site-header__actions .mj-icon-btn:hover { background: #fff; }
.mj-home .mj-search-pill { background: rgba(255, 255, 255, .95); box-shadow: 0 2px 10px rgba(0, 0, 0, .1); }
.site-header__actions { gap: 8px; }

/* ---------------------------------------------------------------- Modern Glamour banner: full width, joined to the section above */
.mj-feature-wrap { padding: 0 !important; margin: 0; }
.mj-feature-wrap > .mj-container { max-width: none; padding: 0; }
.mj-feature { border-radius: 0; min-height: clamp(360px, 34vw, 520px); grid-template-columns: 1fr 1fr 1fr; }
.mj-feature__content { padding: clamp(36px, 5vw, 70px) clamp(24px, 4vw, 60px); }
.mj-feature__title { font-size: clamp(30px, 3.4vw, 46px); }
@media (max-width: 1100px) { .mj-feature { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .mj-feature { grid-template-columns: 1fr; } }

/* Category circles: the picture fills the whole circle (thin maroon ring around it). */
.mj-circle__img { padding: 4px; }
.mj-circle__img img { object-fit: cover !important; padding: 0 !important; width: 100%; height: 100%; border-radius: 50%; }

/* ---------------------------------------------------------------- mobile menu: drawer above the dimmed page */
@media (max-width: 960px) {
	.site-header:has(.site-nav.is-open) { z-index: 200; }
	.site-nav { z-index: 210; background: var(--paper); box-shadow: 0 0 40px rgba(0, 0, 0, .25); }
	.site-nav__head .mj-logo__text { display: flex; }
	.site-nav__list > li > a { font: 500 20px/1.2 var(--display); letter-spacing: .02em; color: var(--ink); }
	.site-nav__list .mj-mega__inner--cat .mj-mega__col li a { font-size: 16px; padding: 6px 0 6px 12px; color: var(--muted); }
	.site-nav__list .mj-mega__inner--cat .mj-text-link { margin-left: 12px; font-size: 14px; }
	.mj-mega-toggle { top: 6px; }
	.site-nav__social { padding-top: 16px; }
}

/* ---------------------------------------------------------------- category circles fit the phone screen (4 per row) */
@media (max-width: 760px) {
	.mj-circles__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px 10px; overflow: visible; padding-bottom: 0; }
	.mj-circle { flex: none; width: 100%; max-width: none; gap: 8px; }
	.mj-circle__img { width: 100%; max-width: 78px; padding: 3px; }
	.mj-circle__name { font-size: 10px; letter-spacing: .06em; line-height: 1.25; }
	.mj-circles .mj-band-text { font-size: 16px; margin-bottom: 20px; }
}

/* ------------------------------------------------ Gold Bars & Coins page */
.mj-bullion__trust { list-style: none; margin: 0 0 40px; padding: 22px 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.mj-bullion__trust li { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: center; }
.mj-bullion__trust svg { grid-row: span 2; color: var(--maroon); }
.mj-bullion__trust b { font: 600 17px/1.2 var(--display); letter-spacing: .02em; color: var(--ink); }
.mj-bullion__trust span { font-size: 13px; color: var(--muted); }
.mj-bullion__shop { scroll-margin-top: calc(var(--header-h) + 20px); padding-bottom: 20px; }
.mj-bullion__tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.mj-bullion__tabs a { padding: 9px 22px; border: 1px solid var(--line); border-radius: 40px; font: 500 16px/1 var(--display); letter-spacing: .03em; color: var(--ink); background: #fff; transition: background .2s, color .2s, border-color .2s; }
.mj-bullion__tabs a:hover { border-color: var(--maroon); }
.mj-bullion__tabs a[aria-current] { background: var(--maroon); border-color: var(--maroon); color: #fff; }
.mj-bullion__note { display: flex; align-items: center; gap: 8px; margin: 30px 0 0; font-size: 13.5px; color: var(--muted); }
.mj-bullion__faq { background: var(--sand); }
@media (max-width: 960px) { .mj-bullion__trust { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .mj-bullion__trust b { font-size: 15px; } .mj-bullion__trust { gap: 16px 10px; } }

/* ------------------------------------------------ Mega menu: hover previews per filter link */
.mj-mega__products[hidden] { display: none !important; }
.mj-mega__products { animation: mj-preview-in .25s ease; }
@keyframes mj-preview-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.mj-mega__none { grid-column: 1 / -1; align-self: center; margin: 0; padding: 40px 10px; text-align: center; font: 400 18px/1.5 var(--display); color: var(--muted); }
.mj-mega__inner--cat .mj-mega__col li a.is-previewing { color: var(--maroon); }
.mj-mega__inner--cat .mj-mega__col li a.is-previewing::before { content: ""; display: inline-block; width: 14px; height: 1px; margin: 0 8px 5px 0; background: currentColor; vertical-align: middle; }
@media (max-width: 960px) {
	.mj-mega__preview { display: none; }
	.mj-mega__inner--cat .mj-mega__col li a.is-previewing { color: inherit; }
	.mj-mega__inner--cat .mj-mega__col li a.is-previewing::before { display: none; }
}
.mj-bullion__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-bottom: 14px; }
.mj-bullion__bar .mj-bullion__tabs { margin-bottom: 0; }
.mj-bullion__weight.mj-filters { margin: 0; padding: 0; border: 0; min-width: 200px; }
.mj-bullion__weight .mj-filter select { border: 1px solid var(--line); border-radius: 40px; padding: 11px 36px 11px 20px; background-color: #fff; background-position: right 16px center; }

/* ------------------------------------------------ Live price bar: gold & silver in £ € $, scrolling right to left
   Black with a fine gold rule; gold prices in gold, silver prices in silver. Text is 20% smaller than the menu. */
.mj-pricebar { --pb-gold: #d9b86c; --pb-silver: #d4d8dd; position: relative; z-index: 60; display: flex; align-items: center; height: 52px; background: linear-gradient(180deg, #0b0b0b 0%, #151310 100%); color: #a49c8c; font: 500 15px/1 var(--sans); letter-spacing: .04em; white-space: nowrap; overflow: hidden; }
.mj-pricebar::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(217, 184, 108, .75) 20%, rgba(217, 184, 108, .75) 80%, transparent); pointer-events: none; }
.mj-pricebar__live { position: relative; z-index: 2; flex: none; display: inline-flex; align-items: center; gap: 10px; height: 100%; padding: 0 22px 0 var(--gutter, 24px); background: #0b0b0b; color: #efe2c8; font-size: 13px; letter-spacing: .22em; text-transform: uppercase; cursor: default; box-shadow: 14px 0 18px -4px #0b0b0b; }
.mj-pricebar__live i { width: 9px; height: 9px; border-radius: 50%; background: #2fbf71; box-shadow: 0 0 0 0 rgba(47, 191, 113, .6); animation: mj-live 2s infinite; }
@keyframes mj-live { 70% { box-shadow: 0 0 0 7px rgba(47, 191, 113, 0); } 100% { box-shadow: 0 0 0 0 rgba(47, 191, 113, 0); } }
.mj-pricebar__viewport { flex: 1; min-width: 0; height: 100%; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, #000 92%, transparent); mask-image: linear-gradient(90deg, #000 92%, transparent); }
.mj-pricebar__track { display: flex; width: max-content; height: 100%; animation: mj-pricebar var(--pb-duration, 60s) linear infinite; will-change: transform; }
.mj-pricebar:hover .mj-pricebar__track { animation-play-state: paused; }
.mj-pricebar__loop { display: flex; align-items: center; flex: none; height: 100%; }
@keyframes mj-pricebar { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.mj-pricebar__item { display: inline-flex; align-items: baseline; gap: 5px; }
.mj-pricebar__name { margin-right: 8px; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: #8d8577; }
.mj-pricebar__item b { font-weight: 600; letter-spacing: .03em; font-variant-numeric: tabular-nums; }
.mj-pricebar__item small { font-size: 13px; color: #7d766a; letter-spacing: .04em; }
.mj-pricebar__item--gold b { color: var(--pb-gold); background: linear-gradient(180deg, #f3dc9e 0%, #d9b86c 55%, #b8924a 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.mj-pricebar__item--silver b { color: var(--pb-silver); background: linear-gradient(180deg, #ffffff 0%, #d4d8dd 55%, #a9aeb5 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.mj-pricebar__item--gold .mj-pricebar__name { color: #b8a273; }
.mj-pricebar__item--silver .mj-pricebar__name { color: #a7abb1; }
.mj-pricebar__dot { margin: 0 10px; font-style: normal; color: #5f594f; }
.mj-pricebar__sep { margin: 0 56px; font-size: 10px; color: rgba(217, 184, 108, .55); }
.mj-pricebar__note { color: #efe2c8; letter-spacing: .12em; text-transform: uppercase; font-size: 13.5px; }
@media (max-width: 960px) {
	.mj-pricebar { height: 44px; font-size: 14px; }
	.mj-pricebar__live { padding-right: 14px; font-size: 0; gap: 0; }
	.mj-pricebar__sep { margin: 0 36px; }
}
/* Visitors who ask for less motion: no scrolling, swipe sideways instead. */
@media (prefers-reduced-motion: reduce) {
	.mj-pricebar__track { animation: none; }
	.mj-pricebar__viewport { overflow-x: auto; scrollbar-width: none; }
	.mj-pricebar__loop[aria-hidden] { display: none; }
}

/* ------------------------------------------------ Desktop menu: one continuous hover area
   Items fill the header height and touch each other (spacing is padding, not gaps), so the
   pointer is always over an item while on the menu bar. main.js keeps the open panel in
   .is-active, swaps panels instantly between categories and closes after a short delay. */
@media (min-width: 961px) {
	.site-nav { align-self: stretch; }
	.site-nav__list { --nav-gap: clamp(14px, 1.6vw, 26px); gap: 0; height: 100%; align-items: stretch; }
	.site-nav__list > li { height: 100%; padding: 0 calc(var(--nav-gap) / 2); }
	.site-nav__list.mj-js .has-mega:not(.is-active):not(:focus-within) > .mj-mega { opacity: 0; visibility: hidden; }
	.site-nav__list.mj-js .has-mega.is-active > .mj-mega { opacity: 1; visibility: visible; transform: none; }
	.site-nav__list.is-switching .mj-mega { transition: none; }
	.site-nav__list .has-mega.is-active > a::after { transform: scaleX(1); }
	.site-header:has(.has-mega.is-active) { box-shadow: none; background: var(--sand); }
	.site-nav__list.mj-js .mj-mega::after { display: none; } /* items now reach the panel, so the old hover bridge would only cover neighbours */
}
@media (min-width: 961px) and (max-width: 1240px) { .site-nav__list { --nav-gap: 16px; } }

/* ------------------------------------------------ Weight options (gold bars & coins) */
.mj-weights { margin: 4px 0 20px; }
.mj-weights__label { margin: 0 0 10px; font: 500 12px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.mj-weights__label b { color: var(--ink); font-weight: 600; letter-spacing: .06em; }
.mj-weights__opts { display: flex; flex-wrap: wrap; gap: 8px; }
.mj-weight { min-width: 64px; padding: 11px 16px; border: 1px solid var(--line); border-radius: 4px; background: #fff; color: var(--ink); font: 500 15px/1 var(--display); letter-spacing: .02em; cursor: pointer; transition: border-color .2s, background .2s, color .2s; }
.mj-weight:hover { border-color: var(--maroon); }
.mj-weight[aria-checked="true"] { border-color: var(--maroon); background: var(--maroon); color: #fff; }
.mj-weight.is-sold-out { color: var(--muted); text-decoration: line-through; }
.mj-weight.is-sold-out[aria-checked="true"] { color: #fff; }
/* WooCommerce's own weight drop-down, price line and "Clear" link are replaced by the buttons above */
.mj-has-weights .variations_form table.variations,
.mj-has-weights .variations_form .reset_variations,
.mj-has-weights .woocommerce-variation-price,
.mj-has-weights .woocommerce-variation-availability { display: none !important; }
.variations_form.mj-no-price .single_variation_wrap { display: none !important; }
.mj-enquire--weight[hidden] { display: none; }
.mj-pp-vat { margin: -10px 0 14px; font-size: 12px; letter-spacing: .06em; color: var(--muted); }
.mj-vat-suffix { font-size: .72em; letter-spacing: .04em; color: var(--muted); font-weight: 400; margin-left: 3px; white-space: nowrap; }
.mj-bag__vat { margin: -6px 0 12px; font-size: 12px; color: var(--muted); }

/* ------------------------------------------------ My list (header badge) */
.mj-list-link { position: relative; }
.mj-list-count { position: absolute; top: 4px; right: 2px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: var(--maroon); color: #fff; font: 600 10px/17px var(--sans); text-align: center; }
.mj-list-count.is-empty { display: none; }

/* ------------------------------------------------ Scan an Item */
.mj-scan, .mj-mylist { max-width: 980px; padding-top: 30px; padding-bottom: 60px; }
.mj-scan__head { text-align: center; max-width: 640px; margin: 0 auto 26px; }
.mj-scan__head p { color: var(--muted); font: 400 18px/1.6 var(--display); margin: 0; }
.mj-scan__notfound { display: flex; gap: 10px; align-items: center; max-width: 640px; margin: 0 auto 22px; padding: 14px 18px; border-radius: 8px; background: #fbeaea; color: #8a1f1f; }
.mj-scan__notfound p { margin: 0; }
.mj-scan-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 30px; align-items: center; margin: 0 auto 34px; padding: 22px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 10px 30px rgba(0, 0, 0, .06); }
.mj-scan-card__img img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; background: #fff; border-radius: 8px; }
.mj-scan-card__code { margin: 0 0 6px; font: 600 11px/1.2 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--gold, #a3863f); }
.mj-scan-card__name { margin: 0 0 6px; font: 500 clamp(24px, 3vw, 32px)/1.15 var(--display); }
.mj-scan-card__specs { margin: 0 0 14px; color: var(--muted); }
.mj-scan-card__price { font: 500 30px/1.1 var(--display); color: var(--ink); }
.mj-scan-card__price .mj-vat-suffix { font-size: .5em; }
.mj-scan-card__vat { margin: 6px 0 12px; font-size: 12.5px; color: var(--muted); }
.mj-scan-card__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.mj-scan-save { display: inline-flex; align-items: center; gap: 8px; padding: 13px 20px; border: 0; border-radius: 4px; background: var(--maroon); color: #fff; font: 600 12px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.mj-scan-save svg { fill: none; }
.mj-scan-save[aria-pressed="true"] svg { fill: currentColor; }
.mj-scan-save__saved, .mj-scan-save[aria-pressed="true"] .mj-scan-save__add { display: none; }
.mj-scan-save[aria-pressed="true"] .mj-scan-save__saved { display: inline; }
.mj-scanner { max-width: 520px; margin: 0 auto; text-align: center; }
.mj-scanner__view { overflow: hidden; border-radius: 12px; background: #111; }
.mj-scanner:not(.is-on) .mj-scanner__view { display: none; }
.mj-scanner__view video { display: block; width: 100% !important; }
.mj-scanner__msg { min-height: 1.4em; margin: 12px 0; color: var(--muted); font-size: 14px; }
.mj-scanner__manual { margin-top: 10px; padding-top: 20px; border-top: 1px solid var(--line); text-align: left; }
.mj-scanner__manual label { display: block; margin-bottom: 8px; font: 500 12px/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.mj-scanner__manual div { display: flex; gap: 8px; }
.mj-scanner__manual input { flex: 1; min-width: 0; height: 48px; padding: 0 14px; border: 1px solid var(--line); border-radius: 4px; font: 500 16px var(--sans); text-transform: uppercase; background: #fff; }
.mj-scan__list { text-align: center; margin-top: 26px; }

/* ------------------------------------------------ My List */
.mj-mylist__summary { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 20px; margin: 0 0 20px; padding: 16px 18px; background: #fff; border: 1px solid var(--line); border-radius: 10px; }
.mj-mylist__total { margin: 0; }
.mj-mylist__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.mj-mylist__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.mj-mylist__item { position: relative; display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 14px; padding: 14px; background: #fff; border: 1px solid var(--line); border-radius: 10px; }
.mj-mylist__item.is-sold { opacity: .6; }
.mj-mylist__img img { display: block; width: 96px; height: 96px; object-fit: contain; border-radius: 6px; background: #faf7f2; }
.mj-mylist__body h2 { margin: 0 0 4px; font: 500 18px/1.25 var(--display); padding-right: 22px; }
.mj-mylist__body h2 a { color: inherit; }
.mj-mylist__specs { margin: 0 0 6px; font-size: 13px; color: var(--muted); }
.mj-mylist__price { font: 500 18px var(--display); }
.mj-mylist__item .mj-stock { margin: 4px 0 0; font-size: 12px; }
.mj-mylist__remove { position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; border: 0; border-radius: 50%; background: #f1ede6; color: #5c5449; font-size: 17px; line-height: 1; cursor: pointer; }
.mj-mylist__empty { text-align: center; padding: 40px 0; color: var(--muted); }
.mj-mylist__empty svg { color: var(--maroon); }
.mj-mylist__empty .mj-btn { margin: 6px 4px; }
@media (max-width: 760px) {
	.mj-scan-card { grid-template-columns: 1fr; gap: 18px; padding: 16px; }
	.mj-scan-card__actions .mj-btn, .mj-scan-save { flex: 1 1 100%; justify-content: center; }
	.mj-mylist__summary { flex-direction: column; align-items: stretch; }
}
@media print {
	.site-header, .site-footer, .mj-announce, .mj-pricebar, .mj-mylist__actions, .mj-mylist__remove { display: none !important; }
}
.mj-mylist [hidden], .mj-scan [hidden] { display: none !important; }
.mj-wish.mj-scan-save { position: static; width: auto; height: auto; border-radius: 4px; background: var(--maroon); color: #fff; box-shadow: none; transform: none; }
.mj-wish.mj-scan-save:hover { transform: none; background: #6e1a0d; }
.mj-wish.mj-scan-save[aria-pressed="true"] { color: #fff; background: #1f7a45; }
.mj-wish.mj-scan-save .mj-icon { fill: none; }
.mj-wish.mj-scan-save[aria-pressed="true"] .mj-icon { fill: currentColor; }

/* ------------------------------------------------ Currency switcher (£ € $) next to the bag */
.mj-cur { position: relative; }
.mj-cur__btn { font: 600 17px/1 var(--sans); color: var(--ink); }
.mj-cur__btn[aria-expanded="true"] { background: var(--ink); color: #f3e6c8; }
.mj-cur__menu { position: absolute; top: calc(100% + 10px); right: 0; z-index: 80; width: 250px; padding: 8px; border: 1px solid rgba(176, 138, 78, .35); border-radius: 14px; background: #fff; box-shadow: 0 18px 40px rgba(20, 16, 10, .16); }
.mj-cur__menu[hidden] { display: none; }
.mj-cur__opt { display: grid; grid-template-columns: 30px 42px 1fr; align-items: center; width: 100%; padding: 10px 12px; border: 0; border-radius: 9px; background: transparent; color: var(--ink); font: 500 14px/1.2 var(--sans); text-align: left; cursor: pointer; }
.mj-cur__opt:hover { background: #f6f0e6; }
.mj-cur__opt[aria-pressed="true"] { background: #111; color: #f3e6c8; }
.mj-cur__sym { font-size: 17px; font-weight: 600; color: var(--gold-ink); }
.mj-cur__opt[aria-pressed="true"] .mj-cur__sym { color: #d9b86c; }
.mj-cur__code { font-weight: 600; letter-spacing: .06em; font-size: 12.5px; }
.mj-cur__name { font-size: 12.5px; opacity: .7; }
.mj-cur__note { margin: 6px 6px 2px; padding-top: 8px; border-top: 1px solid var(--line); font-size: 11.5px; line-height: 1.45; color: #7a7266; }
.mj-cur-checkout-note { margin: 0 0 14px; padding: 10px 14px; border-left: 3px solid var(--gold); background: #faf6ee; font-size: 13px; }
@media (max-width: 960px) {
	.mj-cur__menu { width: min(250px, calc(100vw - 24px)); }
}

/* Price bar: only the chosen currency (pounds until one is chosen). */
.mj-pricebar__group { display: inline-flex; align-items: center; }
.mj-pricebar__group:not([data-cur="GBP"]) { display: none; }
html[data-mj-cur] .mj-pricebar__group[data-cur="GBP"] { display: none; }
html[data-mj-cur="EUR"] .mj-pricebar__group[data-cur="EUR"],
html[data-mj-cur="USD"] .mj-pricebar__group[data-cur="USD"] { display: inline-flex; }
/* Phones: room for the currency button next to the bag. */
@media (max-width: 480px) {
	.site-header__actions { gap: 2px; }
	.site-header__actions .mj-icon-btn { width: 38px; height: 38px; }
	.mj-cur__btn { font-size: 16px; }
}
@media (max-width: 480px) {
	.site-header__inner { gap: 4px; }
	.mj-burger { flex: none; }
	.site-header__inner > .mj-logo { flex: 0 1 auto; min-width: 0; width: auto; }
	.site-header__inner > .mj-logo img { width: 40px; height: auto; }
	.site-header__inner > .mj-logo .mj-logo__name { font-size: 14px; letter-spacing: .14em; }
	.site-header__inner > .mj-logo .mj-logo__sub { font-size: 7.5px; letter-spacing: .4em; margin-top: 4px; }
}

/* Shop filters: "Clear all" */
.mj-filters__clear { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border: 1px solid var(--line); border-radius: 40px; font: 500 12px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--maroon, #561107); background: #fff; transition: background .2s, color .2s, border-color .2s; }
.mj-filters__clear:hover { background: var(--maroon, #561107); border-color: var(--maroon, #561107); color: #fff; }
.mj-filters__clear svg { flex: none; }
/* Small laptops: room for the full menu plus the currency button. */
@media (min-width: 961px) and (max-width: 1120px) {
	.site-nav__list { --nav-gap: 11px; }
	.site-nav__list > li > a { font-size: 13.5px; }
	.site-header__inner { gap: 16px; }
	.site-header__actions { gap: 3px; }
}

/* Page numbers wrap instead of pushing the page wider than a phone. */
.woocommerce nav.woocommerce-pagination ul { flex-wrap: wrap; justify-content: center; max-width: 100%; }
@media (max-width: 600px) {
	.woocommerce nav.woocommerce-pagination ul { gap: 4px; }
	.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { min-width: 34px; height: 34px; font-size: 13px; }
}

/* Phones: filters fold away behind a "Filters" button; Sort by stays beside it. */
.mj-filters__toggle { display: none; }
.mj-filters__facets { display: contents; }
@media (max-width: 768px) {
	.mj-filters { align-items: center; }
	.mj-filters__toggle { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border: 1px solid var(--line); border-radius: 40px; background: #fff; color: var(--ink); font: 500 13px/1 var(--display); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
	.mj-filters.is-open .mj-filters__toggle { background: var(--ink); border-color: var(--ink); color: #fff; }
	.mj-filters__badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--maroon, #561107); color: #fff; font: 600 11px/1 var(--sans); letter-spacing: 0; }
	.mj-filters__facets { display: none; order: 10; flex: 0 0 100%; flex-direction: column; align-items: stretch; gap: 0; padding-top: 6px; }
	.mj-filters.is-open .mj-filters__facets { display: flex; }
	.mj-filters__facets .mj-filter { display: block; border-bottom: 1px solid var(--line); }
	.mj-filters__facets .mj-filter select { width: 100%; padding: 14px 24px 14px 2px; }
	.mj-filters__facets .mj-filters__clear { align-self: flex-start; margin-top: 12px; }
	.mj-filters .mj-filters__spacer { display: block; flex: 1; }
}

/* ------------------------------------------------ Price table in the menu bar (preview B)
   Wide screens: the table sits in the menu bar. Medium: a "Gold £96.66/g" button opens it.
   Small laptops and phones: a slim black strip above the header with the same button. */
.mj-rates { --r-gold: #d9b86c; --r-silver: #d4d8dd; position: relative; flex: none; font-family: var(--sans); }
.mj-rates [data-cur] { display: none; }
html:not([data-mj-cur]) .mj-rates [data-cur="GBP"], html[data-mj-cur="EUR"] .mj-rates [data-cur="EUR"], html[data-mj-cur="USD"] .mj-rates [data-cur="USD"] { display: inline; }
.mj-rates__live { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #2fbf71; box-shadow: 0 0 0 0 rgba(47, 191, 113, .6); animation: mj-live 2s infinite; }
.mj-rates__summary { display: inline-flex; align-items: center; gap: 14px; padding: 9px 16px; border: 1px solid rgba(217, 184, 108, .45); border-radius: 40px; background: #0d0c0a; color: #efe2c8; cursor: pointer; white-space: nowrap; }
.mj-rates__summary svg { color: var(--r-gold); transition: transform .2s; }
.mj-rates.is-open .mj-rates__summary svg { transform: rotate(180deg); }
.mj-rates__sum-item { display: inline-flex; align-items: baseline; gap: 5px; font-size: 13px; }
.mj-rates__sum-item small { font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: #9a9182; }
.mj-rates__sum-item small:last-child { letter-spacing: .04em; text-transform: none; }
.mj-rates__sum-item b { font-weight: 600; font-variant-numeric: tabular-nums; }
.mj-rates__sum-item--gold b { color: var(--r-gold); }
.mj-rates__sum-item--silver b { color: var(--r-silver); }
.mj-rates__panel { position: absolute; top: calc(100% + 10px); right: 0; z-index: 70; display: none; padding: 10px 14px 8px; border: 1px solid rgba(217, 184, 108, .45); border-radius: 12px; background: linear-gradient(180deg, #0d0c0a 0%, #17140f 100%); box-shadow: 0 18px 40px rgba(0, 0, 0, .28); }
.mj-rates.is-open .mj-rates__panel { display: block; }
.mj-rates__table { border-collapse: collapse; font-size: 13px; color: #efe2c8; white-space: nowrap; }
.mj-rates__table th, .mj-rates__table td { padding: 5px 12px; text-align: right; border: 0; background: none; }
.mj-rates__table thead th { padding-top: 0; font: 500 10px/1.2 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: #9a9182; border-bottom: 1px solid rgba(217, 184, 108, .35); }
.mj-rates__table thead th:first-child { text-align: left; padding-left: 0; }
.mj-rates__table tbody th { padding-left: 0; text-align: left; font: 500 11px/1.2 var(--sans); letter-spacing: .18em; text-transform: uppercase; }
.mj-rates__table td { font-weight: 600; font-variant-numeric: tabular-nums; }
.mj-rates__row--gold th, .mj-rates__row--gold td { color: var(--r-gold); }
.mj-rates__row--silver th, .mj-rates__row--silver td { color: var(--r-silver); }
.mj-rates__table tbody tr + tr th, .mj-rates__table tbody tr + tr td { border-top: 1px solid rgba(255, 255, 255, .07); }
.mj-rates__stamp { margin: 4px 0 0; font-size: 10px; letter-spacing: .04em; color: #8a8273; text-align: right; }

/* Phone / small-laptop strip above the header */
.mj-rates--strip { display: flex; justify-content: center; align-items: center; height: 44px; background: linear-gradient(180deg, #0b0b0b 0%, #151310 100%); z-index: 60; }
.mj-rates--strip::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(217, 184, 108, .75) 20%, rgba(217, 184, 108, .75) 80%, transparent); }
.mj-rates--strip .mj-rates__summary { border: 0; background: none; padding: 8px 6px; }
.mj-rates--strip .mj-rates__panel { left: 50%; right: auto; top: 100%; transform: translateX(-50%); width: max-content; max-width: calc(100vw - 16px); }
.mj-rates--header { display: none; }
.mj-rates__table { line-height: 1.25; }

@media (max-width: 420px) {
	.mj-rates__table { font-size: 12px; }
	.mj-rates__table th, .mj-rates__table td { padding: 5px 8px; }
	.mj-rates__summary { gap: 10px; }
}

/* Price table, light version: menu-bar colours. */
.mj-rates { --r-gold: #9a7438; --r-silver: #6f747b; }
.mj-rates__summary { border-color: var(--line); background: var(--sand); color: var(--ink); }
.mj-rates__summary svg { color: var(--r-gold); }
.mj-rates__sum-item small { color: var(--muted); }
.mj-rates__panel { border-color: var(--line); background: var(--sand); box-shadow: 0 14px 34px rgba(20, 16, 10, .12); }
.mj-rates__table { color: var(--ink); }
.mj-rates__table thead th { color: var(--muted); border-bottom-color: var(--line); }
.mj-rates__table tbody tr + tr th, .mj-rates__table tbody tr + tr td { border-top-color: var(--line); }
.mj-rates__stamp { color: var(--muted); }
/* Phones: the strip takes the menu-bar colour too. */
.mj-rates--strip { background: var(--sand); box-shadow: inset 0 -1px 0 var(--line); }
.mj-rates--strip::after { display: none; }

/* Bag: delivery message (£20 / free over £500 / collect over £2,500) */
.mj-bag__delivery { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 12px; padding: 10px 12px; border-radius: 8px; background: #faf6ee; font-size: 12.5px; line-height: 1.45; color: var(--ink); }
.mj-bag__delivery svg { flex: none; margin-top: 2px; color: var(--gold-ink); }

/* Online orders paused (Super Admin → Store controls) */
.mj-paused { position: relative; z-index: 61; padding: 10px var(--gutter, 16px); background: var(--maroon, #561107); color: #fff; font: 500 13px/1.4 var(--sans); text-align: center; letter-spacing: .02em; }

/* ---------------------------------------------------------------- homepage: price table in the top band (computer) */
@media (min-width: 961px) {
	.mj-rates--strip { height: 52px; }
	.mj-rates--strip .mj-rates__summary { display: none; }
	.mj-rates--strip .mj-rates__panel { position: static; display: flex; align-items: center; gap: 22px; width: auto; max-width: none; transform: none; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
	.mj-rates--strip .mj-rates__table { font-size: 12.5px; line-height: 1.1; }
	.mj-rates--strip .mj-rates__table th, .mj-rates--strip .mj-rates__table td { padding: 0 16px; }
	.mj-rates--strip .mj-rates__table thead th { padding-bottom: 2px; font-size: 9px; }
	.mj-rates--strip .mj-rates__table tbody th { font-size: 10px; }
	.mj-rates--strip .mj-rates__table tbody td, .mj-rates--strip .mj-rates__table tbody th { padding-top: 1px; padding-bottom: 1px; }
	.mj-rates--strip .mj-rates__stamp { margin: 0; padding-left: 22px; border-left: 1px solid var(--line); font-size: 10.5px; line-height: 1.3; text-align: left; }
}

/* the new scanner (store plugin scan-engine.js) draws its own picture and controls */
.mj-scanner__view.mjscan { background: none; overflow: visible; border-radius: 0; }

/* Card photos: only one is ever visible. On hover the second photo replaces the first (it no longer sits on top of it),
   and on sold-out cards the second photo stays hidden until hover. */
.mj-card__img--alt { opacity: 0 !important; }
@media (hover: hover) and (pointer: fine) { /* the photo swap only with a real mouse (a finger tap counts as hover and used to blank the card) */
	.mj-card:hover .mj-card__img--alt { opacity: 1 !important; }
	.mj-card:hover .mj-card__media:has(.mj-card__img--alt) .mj-card__img:not(.mj-card__img--alt) { opacity: 0; }
	.mj-card.is-sold-out:hover .mj-card__img--alt { opacity: .75 !important; }
}
@media (hover: none), (pointer: coarse) {
	.mj-card__img--alt { display: none; }
	.mj-card:hover .mj-card__img, .mj-card:hover { transform: none; }
}

/* Bullion: guide price (weekends / bank holidays) and the order-request form */
.mj-guide { display: inline-block; margin-right: 6px; padding: 2px 8px; border-radius: 20px; background: #f6efe0; color: #7a5a1e; font: 600 11px/1.5 var(--sans); letter-spacing: .08em; text-transform: uppercase; vertical-align: middle; }
.mj-request { margin: 18px 0; padding: 18px; border: 1px solid #e6ddcf; border-radius: 12px; background: #fffdf9; }
.mj-request h3 { margin: 0 0 6px; font: 500 20px/1.2 var(--display); }
.mj-request p { margin: 0 0 12px; font-size: 14px; color: #5c5449; }
.mj-request__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
.mj-request__grid label span { display: block; margin-bottom: 4px; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: #7a7266; }
.mj-request__grid input, .mj-request__grid select { width: 100%; height: 44px; padding: 0 10px; border: 1px solid #e6ddcf; border-radius: 8px; background: #fff; font-size: 16px; }
.mj-request__wide { grid-column: 1 / -1; }
.mj-request__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.mj-request__msg { margin: 10px 0 0 !important; }
.mj-request__done h3 { color: #1e8a4c; }
.mj-request__guide { font-weight: 600; color: #1d1a16 !important; }
.mj-hold-note { padding: 12px 14px; border-left: 3px solid #c9a45c; background: #fffaf1; }
@media (max-width: 600px) { .mj-request__grid { grid-template-columns: 1fr; } }

/* Bars & coins: the photo is shown whole on the product page, sized to fit the screen */

/* Bars & coins: one photo box (the whole photo, a sensible size) + the photos of the chosen weight */
.mj-bgal { max-width: 460px; }
.mj-bgal__main { display: flex; align-items: center; justify-content: center; aspect-ratio: 5 / 7; max-height: 72vh; width: 100%; background: #fff; border-radius: var(--radius); overflow: hidden; cursor: zoom-in; }
.mj-bgal__main img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; }
.mj-bgal__thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 10px; }
.mj-bgal__thumbs:empty { display: none; }
.mj-bgal__thumbs button { aspect-ratio: 1; padding: 0; border: 1px solid #e6ddcf; border-radius: var(--radius-sm, 6px); background: #fff; overflow: hidden; cursor: pointer; opacity: .65; transition: opacity .2s, border-color .2s; }
.mj-bgal__thumbs button.is-on, .mj-bgal__thumbs button:hover { opacity: 1; border-color: #1d1a16; }
.mj-bgal__thumbs img { width: 100%; height: 100%; object-fit: contain; display: block; }
.mj-bgal__zoom { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(20, 17, 13, .92); cursor: zoom-out; }
.mj-bgal__zoom img { max-width: 100%; max-height: 100%; object-fit: contain; }
.mj-bgal__zoom button { position: absolute; top: 14px; right: 18px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255,255,255,.15); color: #fff; font-size: 26px; line-height: 1; cursor: pointer; }
@media (max-width: 960px) { .mj-bgal { max-width: 420px; margin: 0 auto; } }
.woocommerce div.product div.mj-bgal { position: static; width: 100%; } /* scrolls with the page (sticky slid over "You may also like") */
@media (max-width: 960px) { .woocommerce div.product div.mj-bgal { position: static; } }

/* Menu drop-downs: a fine border so white product photos stand out from the menu background */
.mj-mega__product-img { border: 1px solid #e3d9c8; border-radius: 8px; background: #fff; box-sizing: border-box; }
.mj-mega__product:hover .mj-mega__product-img { border-color: #c9a45c; }
.mj-mega__feature { border: 1px solid #e3d9c8; border-radius: 8px; box-sizing: border-box; }
.mj-bullion__weight { display: flex; flex-wrap: wrap; gap: 10px; }

/* Product page: "You May Also Like" = one item, under the main photo (opening the sections on the right moves nothing) */
@media (min-width: 961px) {
	.woocommerce div.product > .images, .woocommerce div.product > .mj-bgal { grid-column: 1; grid-row: 1; }
	.woocommerce div.product > .summary { grid-column: 2; grid-row: 1 / span 2; }
	.woocommerce div.product > .related { grid-column: 1; grid-row: 2; margin-top: 8px; }
}
.woocommerce div.product .related > h2 { font-size: 20px; letter-spacing: .08em; margin: 0 0 14px; text-align: left; }
.woocommerce div.product .related ul.products { display: grid; grid-template-columns: minmax(0, 260px) !important; gap: 0; }
.woocommerce div.product .related ul.products li.product { width: auto !important; margin: 0 !important; }

/* Menu drop-downs: "Shop all …" sits at the bottom of the links column */
.mj-mega__inner--cat .mj-mega__col { display: flex; flex-direction: column; }
.mj-mega__inner--cat .mj-mega__col ul { flex: 1 1 auto; }
.mj-mega__inner--cat .mj-mega__col > .mj-text-link { margin-top: auto; align-self: flex-start; }

/* Phone header: the icons fit beside the logo (heart is in the ☰ menu as "My List") */
@media (max-width: 480px) {
	.site-header__actions { gap: 3px; }
	.site-header__actions .mj-list-link { display: none !important; }
	.site-header__actions .mj-icon-btn, .site-header__actions .mj-cur > button { width: 34px; height: 34px; }
}
@media (max-width: 370px) {
	.site-header__inner { gap: 6px; }
	.site-header__inner > .mj-logo { gap: 6px; }
	.site-header__inner > .mj-logo img { height: 40px; }
	.site-header__inner > .mj-logo .mj-logo__name { font-size: 15px; letter-spacing: .07em; }
	.site-header__inner > .mj-logo .mj-logo__sub { letter-spacing: .28em; }
	.site-header__actions { gap: 1px; }
	.site-header__actions .mj-icon-btn, .site-header__actions .mj-cur > button { width: 32px; height: 32px; }
}

/* ---------------------------------------------------------------- Zakat: button in the top band + the calculator page */
.mj-topband { position: relative; z-index: 60; }
.mj-zakat-btn { position: absolute; top: 50%; right: max(var(--gutter), calc((100% - var(--container)) / 2 + var(--gutter) / 2)); transform: translateY(-50%); z-index: 70; display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 14px; border-radius: 16px; background: linear-gradient(180deg, #c9a45c, #a8843f); color: #fff !important; font: 600 12px/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; text-decoration: none; box-shadow: 0 2px 8px rgba(120, 90, 30, .25); white-space: nowrap; transition: filter .2s; }
.mj-zakat-btn:hover { filter: brightness(1.06); color: #fff; }
.mj-zakat-btn__icon { font-size: 14px; line-height: 1; }
.mj-zakat-btn__short { display: none; }
.mj-topband--bar .mj-zakat-btn { box-shadow: 0 0 0 6px #121010; }
@media (max-width: 960px) {
	.mj-zakat-btn { right: 8px; height: 28px; padding: 0 10px; font-size: 11px; }
	.mj-zakat-btn__long { display: none; }
	.mj-zakat-btn__short { display: inline; }
}

.mj-zakat { --zk-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23b08a4e' stroke-opacity='.22' stroke-width='1'%3E%3Cpath d='M32 4l8 20 20 8-20 8-8 20-8-20-20-8 20-8z'/%3E%3Crect x='20' y='20' width='24' height='24' transform='rotate(45 32 32)'/%3E%3Crect x='20' y='20' width='24' height='24'/%3E%3C/g%3E%3C/svg%3E"); }
.mj-zakat__hero { position: relative; padding: clamp(36px, 6vw, 70px) 0 clamp(30px, 5vw, 50px); text-align: center; background: var(--zk-pattern), linear-gradient(180deg, #fbf8f2, var(--sand, #f6f1e9)); background-size: 64px 64px, auto; border-bottom: 1px solid var(--line); }
.mj-zakat__ayah { margin: 0 0 6px; font: 400 clamp(26px, 4vw, 40px)/1.6 "Amiri", "Scheherazade New", "Traditional Arabic", serif; color: var(--gold-ink); }
.mj-zakat__ayah-en { margin: 0 0 18px; font: italic 400 15px/1.5 var(--display); color: #7a7064; }
.mj-zakat__title { margin: 0 0 12px; font: 500 clamp(32px, 5vw, 52px)/1.1 var(--display); text-transform: uppercase; letter-spacing: .04em; color: var(--ink); }
.mj-zakat__lead { max-width: 620px; margin: 0 auto 14px; font-size: 17px; line-height: 1.6; color: #4a4540; }
.mj-zakat__free { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 8px 16px; border-radius: 20px; background: #fff; border: 1px solid #e6d7b8; color: var(--gold-ink); font: 600 13px/1.3 var(--sans); }
.mj-zakat__main { padding-top: clamp(28px, 4vw, 44px); padding-bottom: 10px; }
.mj-zakat__warn { padding: 12px 16px; border-radius: 8px; background: #fdf3f1; color: #9a2f22; }
.mj-zakat__grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(18px, 3vw, 34px); align-items: start; }
.mj-zakat__card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: clamp(18px, 3vw, 28px); box-shadow: 0 10px 30px rgba(40, 30, 10, .05); }
.mj-zakat__form h2 { display: flex; align-items: center; gap: 10px; margin: 22px 0 6px; font: 500 20px/1.2 var(--display); color: var(--ink); }
.mj-zakat__form h2:first-child { margin-top: 0; }
.mj-zakat__form h2 span { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--gold-ink); color: #fff; font: 600 13px/1 Arial, sans-serif; }
.mj-zakat__hint { margin: 0 0 12px; font-size: 14px; color: #7a7064; }
.mj-zakat__rows { display: grid; gap: 8px; }
.mj-zakat__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid #efe7d9; border-radius: 10px; background: #fdfbf7; cursor: text; }
.mj-zakat__row:focus-within { border-color: var(--gold); background: #fff; }
.mj-zakat__k { display: grid; gap: 2px; }
.mj-zakat__k b { font: 600 15px/1.2 var(--sans); color: var(--ink); }
.mj-zakat__k small { font-size: 12px; color: #8a8278; }
.mj-zakat__in { display: inline-flex; align-items: center; gap: 6px; }
.mj-zakat__in input { width: 120px; height: 42px; padding: 0 10px; border: 1px solid #ddd2bf; border-radius: 8px; background: #fff; font: 500 17px/1 Arial, sans-serif; text-align: right; }
.mj-zakat__in i { font-style: normal; color: #8a8278; }
.mj-zakat__nisab { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mj-zakat__nisab label { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid #efe7d9; border-radius: 10px; cursor: pointer; }
.mj-zakat__nisab label:has(input:checked) { border-color: var(--gold-ink); background: #fbf5e8; }
.mj-zakat__nisab span { display: grid; gap: 3px; }
.mj-zakat__nisab small { font-size: 12px; color: #8a8278; }
.mj-zakat__reset { margin-top: 16px; padding: 0; border: 0; background: none; color: #8a8278; text-decoration: underline; cursor: pointer; font-size: 13px; }
.mj-zakat__result { position: sticky; top: 20px; text-align: center; background: var(--zk-pattern), #fffdf8; background-size: 64px 64px, auto; }
.mj-zakat__eyebrow { margin: 0; font: 600 12px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-ink); }
.mj-zakat__due { margin: 10px 0 2px; font: 600 clamp(38px, 5vw, 52px)/1.1 Arial, sans-serif; color: #b9ae9c; transition: color .2s; }
.mj-zakat__grid.is-due .mj-zakat__due { color: var(--ink); }
.mj-zakat__due-g { min-height: 1.2em; margin: 0 0 8px; font-size: 14px; color: var(--gold-ink); }
.mj-zakat__status { margin: 0 0 16px; padding: 10px 12px; border-radius: 8px; background: #f6f1e7; font-size: 14px; line-height: 1.45; color: #4a4540; }
.mj-zakat__grid.is-due .mj-zakat__status { background: #e9f5ee; color: #17663f; }
.mj-zakat__sum { margin: 0 0 12px; text-align: left; }
.mj-zakat__sum div { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid #f0e9dd; font-size: 14px; }
.mj-zakat__sum dt { color: #6b6257; }
.mj-zakat__sum dd { margin: 0; font: 600 14px/1.3 Arial, sans-serif; color: var(--ink); }
.mj-zakat__sum .is-total dt, .mj-zakat__sum .is-total dd { font-weight: 700; color: var(--ink); }
.mj-zakat__stamp { margin: 0 0 12px; font-size: 12px; color: #8a8278; }
.mj-zakat__note { max-width: 860px; margin: 18px auto 0; font-size: 13px; line-height: 1.55; color: #7a7064; text-align: center; }
.mj-zakat__guide { margin-top: clamp(30px, 5vw, 50px); padding: clamp(34px, 5vw, 56px) 0; background: var(--zk-pattern), var(--sand, #f6f1e9); background-size: 64px 64px, auto; }
.mj-zakat__guide .mj-band-title { text-align: center; }
.mj-zakat__cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 20px; }
.mj-zakat__cards article { padding: 22px 18px; border-radius: 12px; background: #fff; border: 1px solid var(--line); text-align: center; }
.mj-zakat__num { display: block; margin-bottom: 8px; font: 600 26px/1 Arial, sans-serif; color: var(--gold-ink); }
.mj-zakat__cards h3 { margin: 0 0 6px; font: 500 18px/1.2 var(--display); text-transform: uppercase; letter-spacing: .04em; }
.mj-zakat__cards p { margin: 0; font-size: 14px; line-height: 1.55; color: #5c5449; }
.mj-zakat__faq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(20px, 4vw, 50px); align-items: start; }
.mj-zakat__ctas { display: flex; flex-wrap: wrap; gap: 10px; }
@media (max-width: 900px) {
	.mj-zakat__grid, .mj-zakat__faq { grid-template-columns: 1fr; }
	.mj-zakat__result { position: static; }
	.mj-zakat__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
	.mj-zakat__nisab { grid-template-columns: 1fr; }
	.mj-zakat__in input { width: 96px; }
	.mj-zakat__cards { grid-template-columns: 1fr; }
}
@media print {
	.site-header, .mj-topband, .site-footer, .mj-zakat__guide, .mj-zakat__faq, .mj-zakat__print, .mj-zakat__reset { display: none !important; }
	.mj-zakat__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 960px) {
	.mj-topband--table:has(.mj-zakat-btn) .mj-rates--strip { justify-content: flex-start; padding: 0 84px 0 6px; }
	.mj-topband--bar:has(.mj-zakat-btn) .mj-pricebar__viewport { margin-right: 76px; }
}

/* Zakat: result box as tall as the form (computer), email box at its bottom */
@media (min-width: 901px) {
	.mj-zakat__grid { align-items: stretch; }
	.mj-zakat__result { position: static; display: flex; flex-direction: column; }
	.mj-zakat__print { align-self: center; }
	.mj-zakat__email { margin-top: auto; }
}
.mj-zakat__email { margin-top: 22px; padding: 18px; border-radius: 12px; background: #fff; border: 1px solid #e6d7b8; text-align: left; }
.mj-zakat__email-title { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font: 600 15px/1.3 var(--sans); color: var(--ink); }
.mj-zakat__email-title svg { color: var(--gold-ink); }
.mj-zakat__email-hint { margin: 0 0 12px; font-size: 12.5px; line-height: 1.45; color: #7a7064; }
.mj-zakat__email-row { display: flex; gap: 8px; }
.mj-zakat__email-row input[type=email] { flex: 1 1 auto; min-width: 0; height: 44px; padding: 0 12px; border: 1px solid #ddd2bf; border-radius: 8px; font-size: 15px; background: #fff; }
.mj-zakat__email-row .mj-btn { flex: none; height: 44px; padding: 0 20px; }
.mj-zakat__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.mj-zakat__email-msg { min-height: 1.2em; margin: 8px 0 0; font-size: 13px; }
.mj-zakat__email-msg.is-ok { color: #17663f; }
.mj-zakat__email-msg.is-err { color: #9a2f22; }
@media print { .mj-zakat__email { display: none !important; } }

.mj-zakat__give { margin: 0 0 14px; padding: 12px 14px; border-radius: 10px; background: #fbf5e8; border: 1px solid #ecdcb8; }
.mj-zakat__give[hidden] { display: none; }
.mj-zakat__give label { font-size: 13px; color: #6b6257; margin-right: 6px; }
.mj-zakat__give select { height: 34px; padding: 0 8px; border: 1px solid #d9c79f; border-radius: 6px; background: #fff; font: 600 14px/1 Arial, sans-serif; }
.mj-zakat__give-out { margin: 8px 0 0; font-size: 13px; color: #6b6257; }
.mj-zakat__give-out b { font: 700 22px/1.2 Arial, sans-serif; color: var(--gold-ink); }

/* Phones: no blue box / circle when tapping (keyboard users still get the gold focus ring) */
html { -webkit-tap-highlight-color: transparent; }
a, button, summary, label, input, select, textarea, [role="button"] { -webkit-tap-highlight-color: transparent; }
:focus:not(:focus-visible) { outline: none; }

/* Filters: the product list fades while the new one loads (no page reload) */
#mj-bullion, .mj-container.mj-shop { transition: opacity .2s; }
#mj-bullion.is-loading, .mj-container.mj-shop.is-loading { opacity: .45; pointer-events: none; }

/* Thank-you page: orders over the limit are paid and collected in the showroom */
.mj-collect-note { margin: 0 0 24px; padding: 16px 18px; border-radius: 10px; background: #fff7e6; border: 1px solid #ecd29a; border-left: 4px solid #b8862f; }
.mj-collect-note strong { display: block; margin-bottom: 4px; font-size: 16px; color: #1d1a16; }
.mj-collect-note p { margin: 4px 0 0; color: #4a4540; }

/* Checkout order summary: − / + quantity and Remove */
.mj-qty { display: flex; align-items: center; gap: 6px; margin-top: 8px; }
.mj-qty__btn { width: 30px; height: 30px; padding: 0; border: 1px solid #d9cfbf; border-radius: 50%; background: #fff; color: #1d1a16; font: 500 17px/1 Arial, sans-serif; cursor: pointer; display: inline-grid; place-items: center; }
.mj-qty__btn:hover:not(:disabled) { border-color: #1d1a16; }
.mj-qty__btn:disabled { opacity: .35; cursor: default; }
.mj-qty__n { min-width: 22px; text-align: center; font: 600 14px/1 Arial, sans-serif; }
.mj-qty__rm { margin-left: 8px; padding: 0; border: 0; background: none; color: #8a8278; font-size: 12px; text-decoration: underline; cursor: pointer; }
.mj-qty__rm:hover { color: #9a2f22; }
.mj-qty.is-fixed .mj-qty__btn, .mj-qty.is-fixed .mj-qty__n { display: none; }
.mj-qty.is-fixed .mj-qty__rm { margin-left: 0; }
.mj-qty.is-busy { opacity: .5; }

/* Checkout: Stripe identity check (delivery orders over £1,000) */
.mj-idv { margin: 0 0 18px; padding: 16px 18px; border-radius: 10px; background: #fffaf0; border: 1px solid #ecd29a; border-left: 4px solid #b8862f; font-size: 14px; line-height: 1.5; color: #4a4540; }
.mj-idv p { margin: 0 0 10px; }
.mj-idv__title { font-weight: 700; color: #1d1a16; font-size: 15px; }
.mj-idv__agree { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 12px; font-weight: 600; color: #1d1a16; cursor: pointer; }
.mj-idv__agree input { margin-top: 3px; width: 18px; height: 18px; accent-color: #561107; }
.mj-idv__go { height: 44px; padding: 0 22px; border: 0; border-radius: 4px; background: #561107; color: #fff; font: 600 13px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.mj-idv__go:disabled { opacity: .45; cursor: not-allowed; }
.mj-idv__hint { margin: 10px 0 0 !important; font-size: 12.5px; color: #7a7064; }
.mj-idv__ok { margin: 0 !important; color: #17663f; font-weight: 600; }
.mj-idv__msg { margin: 10px 0 0 !important; font-weight: 600; }
.mj-idv__msg.is-err { color: #9a2f22; }