/* =========================================================
   Muck and the Mires — 2026 refresh
   Loaded LAST on every page so it overrides the old template.
   To undo everything: remove the "2026 refresh" lines from
   each page's <head> (or restore your backed-up pages).
   ========================================================= */

/* ---------- Black everywhere ---------- */
body,
.body1, #page1 .body1,
.body2 {
	background: #000 !important;
}

/* ---------- Header: logo + menu on one line ---------- */
header {
	height: auto !important;
	margin-bottom: 0 !important;
	padding-bottom: 24px;
}
#page1 header { padding-bottom: 0; }

.site-header {
	display: flex;
	align-items: flex-end;   /* the logo artwork sits at the bottom of logo.png */
	justify-content: flex-start;
	gap: 28px;
	padding: 6px 0 0 0;
	overflow: visible;
	box-sizing: border-box;
}
.site-logo { flex: 0 0 auto; display: block; line-height: 0; }
.site-logo img { width: 270px; height: auto; display: block; }
.site-logo:hover { font-family: inherit; letter-spacing: normal; }

.site-header nav { flex: 1 1 auto; margin-bottom: 2px; }

#menu {
	padding: 0 !important;
	margin: 0;
	display: flex;
	flex-wrap: nowrap;
	list-style: none;
}
#menu li { float: none; padding-left: 1px; }
#menu li a,
#menu li a:hover {
	color: #fff;
	background: none;
	margin: 0;
	font-family: BebasNeue, "Bebas Neue", Impact, sans-serif;
	letter-spacing: 1px;
	white-space: nowrap;
}
#menu li a:hover,
#menu .active a,
#menu .active a:hover {
	background: url(../images/menu_bg.gif) bottom repeat-x #d40000;
	color: #fff;
}

/* Hamburger button (only shown on phones) */
.menu-toggle {
	display: none;
	margin-left: auto;
	width: 46px;
	height: 42px;
	padding: 10px;
	background: none;
	border: 0;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}
.menu-toggle span {
	display: block;
	height: 3px;
	margin: 0 0 6px 0;
	background: #fff;
	border-radius: 2px;
	transition: transform .2s ease, opacity .2s ease;
}
.menu-toggle span:last-child { margin-bottom: 0; }
.menu-open .menu-toggle span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.menu-open .menu-toggle span:nth-child(2) { opacity: 0; }
.menu-open .menu-toggle span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

/* ---------- Latest News ---------- */
.latest-news { padding: 0 0 40px 0 !important; }
.latest-news h2 { padding: 34px 16px 18px 16px; }

.news-grid {
	display: flex;
	gap: 24px;
	padding: 0 16px;
	align-items: stretch;
}
.news-item {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	min-width: 0;
}
/* Square frame so every cover lines up and the headlines start at the same height */
.news-cover {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	background: #000;
	line-height: 0;
	margin-bottom: 14px;
}
.news-cover img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; }
.news-cover:hover { font-family: inherit; letter-spacing: normal; }

.news-item h3,
.news-item p,
.mail-list,
.mail-list input,
.mail-list p,
#icons a,
#footer_link {
	font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
}
/* Titles white, details light gray ~2pt smaller, leading set solid */
.news-item h3 {
	color: #fff;
	font-size: 17px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
	padding: 0 0 6px 0;
}
.news-item p {
	color: #b8b8b8;
	font-size: 15px;
	line-height: 1;
	padding: 0 0 16px 0;
}

/* Order button — same red as the menu */
.btn-order,
.btn-order:hover,
.mail-list button {
	display: inline-block;
	align-self: flex-start;
	margin-top: auto;
	padding: 0 22px;
	height: 43px;
	line-height: 43px;
	border: 0;
	border-radius: 0;
	background: url(../images/menu_bg.gif) bottom repeat-x #d40000;
	color: #fff;
	font-family: BebasNeue, "Bebas Neue", Impact, sans-serif;
	font-size: 21px;
	letter-spacing: 1px;
	text-decoration: none;
	cursor: pointer;
}
.btn-order:hover,
.mail-list button:hover { filter: brightness(1.15); }
.btn-order,
.mail-list button { box-sizing: border-box; max-width: 100%; }

/* ---------- Mail list section (homepage) ---------- */
.mail-list {
	margin: 10px 16px 0 16px;
	padding: 34px 0 40px 0;
	border-top: 1px solid #262626;
}
.mail-list h2 { padding: 0 0 6px 0; }
.mail-list p { color: #c9c6c1; font-size: 15px; padding: 0 0 18px 0; }
.mail-list form { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.mail-list label {
	display: block;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 5px;
}
.mail-field { flex: 1 1 200px; }
.mail-field--email { flex: 2 1 280px; }
.mail-list input[type="email"],
.mail-list input[type="text"] {
	width: 100%;
	box-sizing: border-box;
	height: 43px;
	padding: 0 12px;
	border: 1px solid #555;
	border-radius: 0;
	background: #111;
	color: #fff;
	font-size: 16px;
}
.mail-list input:focus { outline: 2px solid #ffff00; outline-offset: 0; border-color: #ffff00; }
.mail-list button { margin-top: 0; flex: 0 0 auto; align-self: flex-end; }
.mail-hp { position: absolute; left: -5000px; }

/* ---------- Footer / Follow Us ---------- */
footer { padding-left: 6px !important; padding-bottom: 30px !important; }  /* lines Follow Us up with Latest News */
#icons li { line-height: 2em; }
#icons a,
#icons a:hover {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 15px;
	letter-spacing: 0;
}
#icons a:hover { color: #fff; }
#icons svg { width: 18px; height: 18px; fill: currentColor; flex: 0 0 18px; }
#icons a span { vertical-align: middle; }
#footer_link a:hover { font-family: inherit; letter-spacing: normal; }

/* ---------- Page intro lines (Music, Store) ---------- */
.page-intro,
.pay-note {
	font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
	color: #fff;
	font-size: 15px;
	line-height: 1.2;
	padding: 0 0 10px 0;
}
.page-intro a { color: #fff; }
.page-intro a:hover { font-family: inherit; letter-spacing: normal; }

/* ---------- Music / Discography grid ---------- */
.discography { padding: 3px 16px 30px 16px !important; }
.discography h2 { padding-bottom: 6px; }
.discography .page-intro { text-transform: uppercase; font-size: 14px; padding-bottom: 22px; }
.disc-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 34px 24px;
}
.disc-item { min-width: 0; font-family: "Archivo", "Helvetica Neue", Arial, sans-serif; }
.disc-cover { display: block; line-height: 0; margin-bottom: 10px; aspect-ratio: 1 / 1; background: #000; }
.disc-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
a.disc-cover:hover { font-family: inherit; letter-spacing: normal; opacity: .85; }
.disc-item h3 {
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
	padding: 0 0 4px 0;
}
.disc-item p {
	color: #b8b8b8;
	font-size: 12px;
	line-height: 1;
	padding: 0;
}

/* ---------- Store ---------- */
.store { padding: 3px 16px 30px 16px !important; }
.store h2 { padding-bottom: 8px; }
.pay-note { display: flex; align-items: center; gap: 8px; padding: 6px 0 8px 0; }
.pay-note svg { width: 16px; height: 16px; fill: #fff; flex: 0 0 16px; }
.pay-marks {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 28px 0;
	padding: 0;
	list-style: none;
}
.pay-marks li {
	font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .5px;
	text-transform: uppercase;
	color: #fff;
	border: 1px solid #555;
	border-radius: 4px;
	padding: 5px 9px;
	line-height: 1;
}
.product-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 44px 32px;
}
.product {
	display: flex;
	flex-direction: column;
	min-width: 0;
	font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
}
.product-img {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	background: #000;
	margin-bottom: 14px;
	overflow: hidden;
	line-height: 0;
}
.product-img img { width: 100%; height: 100%; object-fit: contain; display: block; }
a.product-img:hover { font-family: inherit; letter-spacing: normal; opacity: .85; }
.product h3 {
	color: #fff;
	font-size: 17px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
	padding: 0 0 6px 0;
}
.product p {
	color: #b8b8b8;
	font-size: 15px;
	line-height: 1;
	padding: 0 0 8px 0;
}
.product .price strong { color: #fff; font-weight: 600; }
.product-desc a { color: #b8b8b8; }
.product-desc a:hover { color: #fff; font-family: inherit; letter-spacing: normal; }
.product-buy { margin-top: auto; padding-top: 10px; }
.buy-form { margin: 0; }
.size-label {
	display: block;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 5px;
}
.size-select {
	display: block;
	width: 100%;
	max-width: 260px;
	height: 40px;
	margin-bottom: 12px;
	padding: 0 10px;
	background: #111;
	color: #fff;
	border: 1px solid #555;
	border-radius: 0;
	font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
	font-size: 15px;
}
.product-buy .btn-order { margin-top: 0; }
.soon-tag {
	display: inline-block;
	height: 43px;
	line-height: 43px;
	padding: 0 22px;
	border: 1px solid #555;
	color: #b8b8b8;
	font-family: BebasNeue, "Bebas Neue", Impact, sans-serif;
	font-size: 21px;
	letter-spacing: 1px;
}

/* ---------- Contact page ---------- */
.contact-page { padding: 3px 16px 40px 16px !important; }
.contact-page h2 { padding-bottom: 8px; }
.contact-page .page-intro { padding-bottom: 24px; max-width: 640px; }
.contact-form { max-width: 640px; font-family: "Archivo", "Helvetica Neue", Arial, sans-serif; }
.contact-row { display: flex; gap: 14px; }
.contact-row .contact-field { flex: 1 1 0; }
.contact-field { margin-bottom: 14px; }
.contact-field label {
	display: block;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 5px;
}
.contact-field input,
.contact-field textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	border: 1px solid #555;
	border-radius: 0;
	background: #111;
	color: #fff;
	font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
	font-size: 16px;
	line-height: 1.4;
}
.contact-field input { height: 43px; }
.contact-field textarea { resize: vertical; min-height: 150px; }
.contact-field input:focus,
.contact-field textarea:focus { outline: 2px solid #ffff00; outline-offset: 0; border-color: #ffff00; }
.contact-form .btn-order { margin-top: 4px; }
.contact-form .btn-order[disabled] { opacity: .6; cursor: wait; }
.contact-status { min-height: 20px; padding: 14px 0 0 0; font-size: 15px; color: #b8b8b8; }
.contact-status.is-ok { color: #fff; }
.contact-status.is-error { color: #ff6b6b; }

/* ---------- EPK / Press Kit page ---------- */
html { scroll-behavior: smooth; }
.epk { padding: 3px 16px 40px 16px !important; font-family: "Archivo", "Helvetica Neue", Arial, sans-serif; }
.epk > h2 { padding-bottom: 8px; }
.epk .page-intro { max-width: 680px; padding-bottom: 18px; }
.epk-jump {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 0 0 8px 0;
}
.epk-jump a,
.epk-jump a:hover {
	display: inline-block;
	padding: 8px 14px;
	border: 1px solid #555;
	color: #fff;
	font-family: BebasNeue, "Bebas Neue", Impact, sans-serif;
	font-size: 18px;
	letter-spacing: 1px;
	line-height: 1;
	text-decoration: none;
}
.epk-jump a:hover { border-color: #fff; }

.epk-section {
	padding: 30px 0 6px 0;
	border-top: 1px solid #262626;
	margin-top: 26px;
	scroll-margin-top: 16px;
}
.epk-h { padding: 0 0 16px 0 !important; }
.epk-h-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }

.epk-cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}
.epk-card { display: flex; flex-direction: column; min-width: 0; }
.epk-card-img {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 4 / 3;
	background: #000;
	border: 1px solid #222;
	overflow: hidden;
	margin-bottom: 12px;
	line-height: 0;
}
.epk-card-img img { max-width: 100%; max-height: 100%; width: auto; height: auto; display: block; }
a.epk-card-img:hover { font-family: inherit; letter-spacing: normal; opacity: .85; }
.epk-card h3 {
	color: #fff;
	font-size: 17px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
	padding: 0 0 6px 0;
}
.epk-card p { color: #b8b8b8; font-size: 15px; line-height: 1; padding: 0 0 14px 0; }
.epk-card .btn-order { margin-top: auto; }

.epk-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; margin: 0; }
.epk-facts > div { padding: 12px 0; border-bottom: 1px solid #1c1c1c; }
.epk-facts dt {
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .5px;
	line-height: 1;
	padding-bottom: 6px;
}
.epk-facts dd { margin: 0; color: #b8b8b8; font-size: 15px; line-height: 1.25; }

.epk-quotes {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	list-style: none;
	margin: 26px 0 0 0;
	padding: 0;
}
.epk-quotes li { border-left: 3px solid #d40000; padding: 2px 0 2px 14px; }
.epk-quotes q {
	display: block;
	quotes: "\201C" "\201D";
	color: #fff;
	font-family: BebasNeue, "Bebas Neue", Impact, sans-serif;
	font-size: 26px;
	letter-spacing: .5px;
	line-height: 1;
	padding-bottom: 8px;
}
.epk-quotes span { display: block; color: #b8b8b8; font-size: 13px; line-height: 1; }
.epk-quotes span::before { content: "\2014\00a0"; }

.epk-text p {
	color: #d0d0d0;
	font-size: 16px;
	line-height: 1.55;
	padding: 0 0 16px 0;
	max-width: 760px;
}
.epk-text strong { color: #fff; font-weight: 600; }
.epk-text a { color: #fff; }
.epk-longbio::after { content: ""; display: block; clear: both; }
.epk-fig {
	float: right;
	clear: right;
	max-width: 220px;
	margin: 4px 0 16px 28px;
}
.epk-fig img { display: block; max-width: 100%; height: auto; }
.epk-fig a:hover { font-family: inherit; letter-spacing: normal; }
.epk-fig figcaption { color: #8c8c8c; font-size: 12px; line-height: 1.2; padding-top: 6px; }

.epk-copy {
	flex: 0 0 auto;
	background: none;
	border: 1px solid #555;
	color: #fff;
	padding: 7px 12px;
	font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}
.epk-copy:hover { border-color: #fff; }

.epk-booking p { color: #b8b8b8; font-size: 15px; line-height: 1.2; padding: 0 0 16px 0; }

/* ---------- Press Photos page ---------- */
.back-link { padding: 0 0 6px 0; font-size: 14px; line-height: 1; }
.back-link a, .back-link a:hover { color: #b8b8b8; text-decoration: none; font-family: inherit; letter-spacing: normal; }
.back-link a:hover { color: #fff; }
.photo-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px 24px;
	padding-top: 8px;
}
.photo-card { display: flex; flex-direction: column; min-width: 0; }
.photo-thumb {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #111;
	margin-bottom: 12px;
	line-height: 0;
}
.photo-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
a.photo-thumb:hover { font-family: inherit; letter-spacing: normal; opacity: .85; }
.photo-card h3 {
	color: #fff;
	font-size: 17px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
	padding: 0 0 6px 0;
}
.photo-card .photo-credit { color: #b8b8b8; font-size: 15px; line-height: 1; padding: 0 0 6px 0; }
.photo-card .photo-meta { color: #8c8c8c; font-size: 12px; line-height: 1; padding: 0 0 14px 0; }
.photo-card .btn-order { margin-top: auto; }
.epk-booking a:not(.btn-order) { color: #fff; }

/* ---------- Tablet (768–959px): tighten the menu ---------- */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	.site-header { gap: 16px; padding-left: 10px; padding-right: 10px; }
	.site-logo img { width: 205px; }
	#menu li a { padding: 0 10px; font-size: 18px; }
	.disc-grid { grid-template-columns: repeat(4, 1fr); }
	.product-grid { grid-template-columns: repeat(2, 1fr); }
	.epk-cards { grid-template-columns: repeat(2, 1fr); }
	.photo-grid { grid-template-columns: repeat(2, 1fr); }
	.epk-quotes { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- Phones (767px and below): hamburger menu ---------- */
@media only screen and (max-width: 767px) {
	.site-header {
		flex-wrap: wrap;
		gap: 0;
		padding: 0 14px 0 14px;
	}
	.site-logo img { width: 190px; }
	.menu-toggle { display: block; margin-bottom: -4px; }

	.site-header nav {
		flex: 0 0 100%;
		margin-bottom: 0;
		display: none;
	}
	.menu-open nav { display: block; }

	#menu {
		flex-direction: column;
		margin-top: 12px;
		border-top: 1px solid #333;
	}
	#menu li { padding: 0; border-bottom: 1px solid #222; }
	#menu li a {
		height: 48px;
		line-height: 48px;
		padding: 0 14px;
		font-size: 22px;
	}

	header { padding-bottom: 16px; }
	#page1 header { padding-bottom: 0; }
	.slideshow { margin-top: 14px; }

	.latest-news h2 { padding: 22px 14px 14px 14px; }
	.news-grid { flex-direction: column; gap: 22px; padding: 0 14px; }
	/* Compact rows on phones: small cover left, text + button right */
	.news-item {
		display: grid;
		grid-template-columns: 38% 1fr;
		grid-template-rows: auto auto 1fr;
		column-gap: 14px;
		align-items: start;
	}
	.news-cover { grid-column: 1; grid-row: 1 / span 3; margin-bottom: 0; }
	.news-cover img { max-width: 100%; }
	.news-item h3 { grid-column: 2; font-size: 16px; }
	.news-item p { grid-column: 2; font-size: 14px; padding-bottom: 10px; }
	.news-item .btn-order { grid-column: 2; grid-row: 3; justify-self: start; align-self: end; height: 38px; line-height: 38px; font-size: 19px; padding: 0 16px; }

	.mail-list { margin: 0 14px; }
	.mail-field, .mail-field--email { flex: 1 1 100%; }
	.mail-list button { width: 100%; }

	.discography, .store { padding: 0 14px 24px 14px !important; }
	.disc-grid { grid-template-columns: repeat(2, 1fr); gap: 26px 16px; }
	.product-grid { grid-template-columns: 1fr; gap: 40px; }
	.size-select { max-width: none; }
	.product-buy .btn-order { width: 100%; text-align: center; }

	.contact-page { padding: 0 14px 30px 14px !important; }
	.contact-row { flex-direction: column; gap: 0; }
	.contact-form .btn-order { width: 100%; }

	.epk { padding: 0 14px 30px 14px !important; }
	.epk-cards { grid-template-columns: repeat(2, 1fr); gap: 22px 14px; }
	.epk-card .btn-order { width: 100%; text-align: center; padding: 0 8px; font-size: 19px; }
	.epk-facts { grid-template-columns: 1fr; }
	.epk-quotes { grid-template-columns: 1fr 1fr; gap: 18px 14px; }
	.epk-quotes q { font-size: 22px; }
	.epk-fig { float: none; max-width: 100%; margin: 4px 0 16px 0; }
	.photo-grid { grid-template-columns: repeat(2, 1fr); gap: 26px 14px; }
	.photo-card .btn-order { width: 100%; text-align: center; padding: 0 8px; font-size: 18px; }
}