/*
 * Tunerzine theme, Design 05 (Windshield Banner, Lot Night type).
 * Order: tokens, base, primitives (stickers, labels, frames), layout,
 * header, cards, sections, article, pages, footer, mobile.
 */

/* ---------- Tokens ---------- */
:root {
	--tz-bg: #121214;
	--tz-header-bg: #050506;
	--tz-surface: #1C1C20;
	--tz-surface-hover: #24242A;
	--tz-divider: #2E2E36;
	--tz-text: #F5F5F0;
	--tz-text-secondary: #A3A3AD;
	--tz-text-soft: #D9D9DE;
	--tz-accent: #F89731;
	--tz-accent-hover: #FFAD52;
	--tz-accent-glow: rgba(248, 151, 49, .35);
	--tz-ink: #121214;
	--tz-paper: #D8D8DC;
	--tz-cream: #E9E2CF;
	--tz-radius: 14px;
	--tz-font-body: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
	--tz-font-mono: 'Space Mono', ui-monospace, 'Courier New', monospace;
	--tz-max: 1400px;
	--tz-gutter: 24px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--tz-bg);
	color: var(--tz-text);
	font-family: var(--tz-font-body);
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}
img { max-width: 100%; height: auto; }
a { color: var(--tz-text); text-decoration: none; }
a:hover { color: var(--tz-accent); }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--tz-accent); outline-offset: 3px; }
.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.skip-link:focus {
	position: fixed; top: 8px; left: 8px; z-index: 100001; width: auto; height: auto; clip: auto;
	padding: 12px 16px; background: var(--tz-accent); color: var(--tz-ink); font-weight: 800;
}

/* ---------- Type primitives ---------- */
.wide, .tz-h1, .tz-h2, .tz-h3 {
	font-family: var(--tz-font-body);
	font-stretch: 125%;
	font-weight: 900;
}
.mono { font-family: var(--tz-font-mono); }
.tz-h1 {
	margin: 0;
	font-size: clamp(56px, 10vw, 160px);
	line-height: .82;
	letter-spacing: -.03em;
	text-transform: uppercase;
}
.tz-h2 {
	margin: 0;
	font-size: clamp(44px, 6vw, 92px);
	line-height: .86;
	text-transform: uppercase;
}
.tz-h3 { margin: 0; font-size: clamp(30px, 4vw, 56px); line-height: .9; text-transform: uppercase; }
.tz-outline { -webkit-text-stroke: 2px var(--tz-text); color: transparent; }
.tz-ttl { text-shadow: 6px 5px 0 var(--tz-accent); }
/* Linked shadow titles invert on hover: orange letters, light shadow. */
.tz-ttl a:hover, a:hover > .tz-ttl { color: var(--tz-accent); text-shadow: 6px 5px 0 var(--tz-text); }
.tz-kicker { font-family: var(--tz-font-mono); font-size: 13px; letter-spacing: .24em; color: var(--tz-text-secondary); text-transform: uppercase; }
.tz-cred { font-family: var(--tz-font-mono); font-size: 11px; color: var(--tz-text-secondary); text-transform: uppercase; letter-spacing: .02em; }

/* ---------- Primitives: stickers, chips, label tape, frames ---------- */
.sticker {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border: 4px solid var(--tz-text);
	box-shadow: 0 6px 0 rgba(0, 0, 0, .45);
	font-family: var(--tz-font-body);
	font-stretch: 125%;
	font-weight: 900;
	text-transform: uppercase;
	line-height: 1;
	background: var(--tz-ink);
	color: var(--tz-text);
	text-decoration: none;
}
a.sticker:hover, button.sticker:hover { color: var(--tz-text); filter: brightness(1.12); }
.sticker--pill { border-radius: 999px; min-height: 46px; padding: 0 18px; font-size: 14px; }
.sticker--tag { border-radius: 8px; padding: 8px 14px; font-size: 13px; }
.sticker--round { border-radius: 50%; }
.sticker--accent, a.sticker--accent:hover { background: var(--tz-accent); color: var(--tz-ink); }
.sticker--paper { background: var(--tz-text); color: var(--tz-ink); }
/* White buttons flip to orange with white text on hover (pills inside a linked card follow the card's hover). */
a.sticker--paper:hover, button.sticker--paper:hover { background: var(--tz-accent); color: var(--tz-text); filter: none; }
.tz-arrow { flex: 0 0 auto; display: block; transform: translateY(-.06em); } /* uppercase text sits slightly high in its line box; lift the arrow to the letters' optical centre */
.sticker--lg { min-height: 52px; padding: 0 24px; font-size: 15px; }
button.sticker { cursor: pointer; }

.tz-cat {
	display: inline-flex;
	align-items: center;
	border: 3px solid var(--tz-text);
	border-radius: 999px;
	padding: 3px 10px 2px;
	font-stretch: 125%;
	font-weight: 900;
	font-size: 11px;
	letter-spacing: .04em;
	text-transform: uppercase;
	box-shadow: 0 3px 0 rgba(0, 0, 0, .45);
	background: var(--tz-ink);
	color: var(--tz-text);
}
.tz-cat--accent { background: var(--tz-accent); color: var(--tz-ink); }

.tz-dymo {
	display: inline-block;
	background: #0B0B0C;
	color: var(--tz-text);
	font-family: var(--tz-font-mono);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: 5px 10px 4px;
	border-radius: 3px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 2px 0 rgba(0, 0, 0, .6);
}
.tz-dymo--accent { background: var(--tz-accent); color: var(--tz-ink); }

.tz-vinyl {
	/* The white frame sits outside the photo: it is padding, not a border, so
	   the photo is never clipped by the frame's inner curve. The photo's own
	   corner radius is just small enough to tuck inside the outer curve. */
	--fw: 6px;
	--fr: 14px;
	padding: var(--fw);
	border-radius: var(--fr);
	box-shadow: 0 10px 0 rgba(0, 0, 0, .45);
	overflow: hidden;
	background: var(--tz-text);
}
.tz-vinyl > img, .tz-vinyl > .tz-pic { border-radius: calc(var(--fr) - var(--fw)); }
.tz-vinyl--thin { --fw: 4px; --fr: 10px; }

/* Every photo is a 3:2 frame; the whole image is shown, never cropped. */
.tz-pic, .tz-vinyl > img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: contain;
	background: #000;
}
.tz-fill { object-fit: cover !important; }
.tz-gallery-image.tz-fill { width: 100%; height: 100%; }
.tz-pic--empty { aspect-ratio: 3 / 2; background: var(--tz-surface); }

.tz-tilt-l { transform: rotate(-1.5deg); }
.tz-tilt-r { transform: rotate(1.5deg); }
.tz-tilt-l2 { transform: rotate(-3deg); }
.tz-tilt-r2 { transform: rotate(3deg); }

/* ---------- Layout ---------- */
.tz-wrap { max-width: var(--tz-max); margin: 0 auto; padding: 0 var(--tz-gutter); }
.tz-section { padding-top: 112px; }
.tz-section--tight { padding-top: 72px; }
.tz-sec-head {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: 16px;
	margin-bottom: 36px;
}
.g2, .g3, .g4, .g6, .g8 { display: grid; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.g6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.g8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.gap-cards { gap: 48px 28px; }
.list-reset { list-style: none; margin: 0; padding: 0; }

/* ---------- Header: windshield banner ---------- */
.tz-banner { background: var(--tz-header-bg); border-bottom: 8px solid var(--tz-accent); }
.tz-banner__inner {
	max-width: var(--tz-max);
	margin: 0 auto;
	padding: 18px var(--tz-gutter) 14px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px 40px;
}
.tz-tagline { font-family: var(--tz-font-mono); font-size: 12px; letter-spacing: .3em; color: var(--tz-text-secondary); text-transform: uppercase; }
.tz-tagline--top { display: none; flex: 1 1 100%; text-align: center; font-size: 11px; letter-spacing: .22em; }
.tz-logo img { display: block; width: clamp(240px, 36vw, 520px); height: auto; }

.tz-nav ul {
	list-style: none;
	margin: 0 auto;
	padding: 22px var(--tz-gutter) 8px;
	max-width: var(--tz-max);
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
	align-items: center;
}
.tz-nav li:nth-child(4n+1) .sticker:not(.is-current) { transform: none; }
.tz-nav .is-current { transform: rotate(-2deg); }
.tz-nav .is-garage { border-radius: 8px; transform: rotate(2deg); }
.tz-search-btn { width: 46px; height: 46px; padding: 0; border-radius: 50%; }

.tz-mbar { display: none; max-width: var(--tz-max); margin: 0 auto; padding: 18px 16px 4px; gap: 10px; align-items: flex-start; }
.tz-mnav { flex: 1 1 0; min-width: 0; } /* 0 basis: the open list (full row width) must not widen this column */
.tz-mnav summary { list-style: none; cursor: pointer; min-height: 52px; padding: 0 20px; border-radius: 999px; font-size: 15px; }
.tz-mnav summary::-webkit-details-marker { display: none; }
.tz-mnav summary svg { display: block; } /* block, not inline: inline sat 1px above the caps on the text baseline */
.tz-mnav .x { display: none; }
.tz-mnav[open] .x { display: inline; }
.tz-mnav[open] .b { display: none; }
.tz-mnav ul { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; width: calc(100vw - 32px); } /* full row width: the list opens below the Menu and search buttons, under the 16px side gutters */
.tz-mnav ul a { width: 100%; min-height: 52px; justify-content: flex-start; padding: 0 20px; border-radius: 14px; font-size: 16px; }
.tz-mbar .tz-search-btn { flex: 0 0 auto; width: 52px; height: 52px; }

.tz-searchbar { display: none; max-width: 760px; margin: 18px auto 0; padding: 0 var(--tz-gutter); }
.tz-searchbar.is-open { display: block; }

/* ---------- Search forms ---------- */
.tz-searchform { display: flex; flex-wrap: nowrap; gap: 10px; align-items: center; }
.tz-searchform__go { flex: 0 0 auto; width: 58px; height: 58px; padding: 0; border-radius: 50%; }
.tz-searchform__go:hover { color: var(--tz-text); }
.tz-searchform input[type=search] {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 58px;
	background: var(--tz-header-bg);
	border: 4px solid var(--tz-text);
	border-radius: 999px;
	color: var(--tz-text);
	padding: 0 24px;
	font-weight: 700;
	font-size: 18px;
}
.tz-searchform input[type=search]::placeholder { color: #7C7C86; }

/* ---------- Cards ---------- */
.tz-card { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; color: var(--tz-text); }
.tz-card__frame { position: relative; display: block; width: 100%; }
.tz-card__link { display: flex; flex-direction: column; gap: 6px; color: var(--tz-text); }
.tz-card__link:hover { color: var(--tz-text); }
.tz-card__link:hover .tz-card__title, .tz-card__link:hover .tz-card__sub,
.tz-card:has(.tz-card__frame:hover) .tz-card__title, .tz-card:has(.tz-card__frame:hover) .tz-card__sub { color: var(--tz-accent); }
.tz-card__badge {
	position: absolute;
	top: -14px;
	right: 20px;
	padding: 6px 12px;
	border-radius: 8px;
	font-size: 12px;
	z-index: 2;
}
.tz-card__label { position: absolute; top: -16px; right: 14px; padding: 6px 12px; border-radius: 6px; font-size: 14px; z-index: 2; }
.tz-card__date { position: absolute; left: 14px; bottom: -12px; z-index: 2; }
.tz-card__cat { margin-top: 8px; }
.tz-card__title { font-weight: 800; font-size: 20px; line-height: 1.25; transition: color .15s; }
.tz-card__sub { font-stretch: 125%; font-weight: 900; font-size: 24px; line-height: .95; text-transform: uppercase; color: var(--tz-text); transition: color .15s; }
.tz-card__car { font-weight: 700; font-size: 17px; color: var(--tz-accent); }

/* Bylines: date and credits, names link to contributor pages */
.tz-byline > span + span::before { content: " \00B7  "; }
.tz-byline a { color: inherit; }
.tz-byline a:hover { color: var(--tz-accent); }

/* Small horizontal card (trending, related on phones) */
.tz-mini { display: flex; gap: 16px; align-items: flex-start; color: var(--tz-text); }
.tz-mini__thumb { flex: 0 0 150px; }
.tz-mini__body { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.tz-mini__title { font-weight: 800; font-size: 17px; line-height: 1.25; }

/* Featured row */
.tz-feat { display: flex; flex-wrap: wrap; gap: 32px; align-items: center; color: var(--tz-text); }
.tz-feat--reverse { flex-direction: row-reverse; }
.tz-feat__media { flex: 3 1 560px; min-width: 0; position: relative; display: block; }
.tz-feat__link { display: flex; flex-direction: column; gap: 10px; color: var(--tz-text); }
.tz-feat__link:hover { color: var(--tz-text); }
.tz-feat__body { flex: 2 1 320px; display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.tz-feat__title { font-stretch: 125%; font-weight: 900; font-size: clamp(34px, 3.6vw, 54px); line-height: .9; text-transform: uppercase; }
.tz-feat__title { transition: color .15s; }
.tz-feat__link:hover .tz-feat__title, .tz-feat:has(.tz-feat__media:hover) .tz-feat__title { color: var(--tz-accent); }
.tz-feat__car { font-weight: 700; font-size: 20px; color: var(--tz-accent); }
.tz-feat .tz-byline { font-size: 12px; }
.tz-feat .tz-card__badge { top: -16px; right: 24px; font-size: 13px; }

/* ---------- Home: hero ---------- */
.tz-hero { position: relative; }
.tz-hero .tz-vinyl { --fr: 16px; }
.tz-hero__cat { position: absolute; top: -14px; left: 32px; padding: 10px 18px; border-radius: 10px; font-size: 16px; transform: rotate(-5deg); z-index: 3; }
.tz-hero__round { position: absolute; top: 40px; right: 48px; width: 140px; height: 140px; font-size: 17px; text-align: center; transform: rotate(10deg); z-index: 3; }
.tz-hero__round--long { font-size: 13px; }
.tz-hero__flag { display: none; }
.tz-hello { position: absolute; top: 200px; right: 64px; width: 240px; border: 4px solid var(--tz-text); border-radius: 14px; overflow: hidden; transform: rotate(-4deg); box-shadow: 0 8px 0 rgba(0, 0, 0, .45); background: var(--tz-text); z-index: 3; }
.tz-hello__top { background: var(--tz-accent); color: var(--tz-ink); text-align: center; padding: 8px 6px 4px; display: flex; flex-direction: column; }
.tz-hello__top b { font-stretch: 125%; font-weight: 900; font-size: 26px; line-height: 1; }
.tz-hello__top span { font-family: var(--tz-font-mono); font-weight: 700; font-size: 11px; letter-spacing: .1em; }
.tz-hello__name { padding: 14px 10px; text-align: center; color: var(--tz-ink); font-weight: 800; font-size: 24px; line-height: 1.05; }
.tz-hero__overlay {
	position: absolute;
	left: 6px; right: 6px; bottom: 6px;
	border-radius: 0 0 10px 10px; /* matches the photo corner inside the 16px frame */
	background: linear-gradient(0deg, rgba(18, 18, 20, .92) 30%, rgba(18, 18, 20, 0));
	padding: clamp(80px, 10vw, 160px) clamp(20px, 4vw, 48px) clamp(20px, 4vw, 48px);
	display: flex;
	flex-direction: column;
	gap: 14px;
	align-items: flex-start;
}
.tz-hero__car { margin: 0; font-weight: 700; font-size: 20px; }
.tz-hero__title { margin: 0; font-stretch: 125%; font-weight: 900; font-size: clamp(46px, 7vw, 112px); line-height: .86; letter-spacing: -.03em; text-transform: uppercase; max-width: 12ch; }
.tz-hero__meta { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; }
.tz-hero__meta .mono { font-size: 14px; }
.tz-hero__meta .mono > span + span::before { content: " \00B7  "; }

/* ---------- Home: makes sticker sheet, event types ---------- */
.tz-sheet { background: var(--tz-paper); color: var(--tz-ink); border-radius: 14px; padding: clamp(20px, 3vw, 36px); }
.tz-sheet__title { color: var(--tz-ink); margin-bottom: 6px; }
.tz-sheet__note { margin: 0 0 22px; font-size: 12px; letter-spacing: .14em; color: #2A2A30; }
.tz-sheet-chip {
	width: 100%;
	min-height: 80px;
	flex-direction: column;
	gap: 2px;
	padding: 0 6px;
	font-size: 16px;
	outline: 1px dashed #77777F;
	outline-offset: 4px;
}
.tz-sheet-chip span { font-family: var(--tz-font-mono); font-size: 11px; font-weight: 400; text-transform: none; color: #C9C9CF; }
.tz-sheet-chip.sticker--accent span, .tz-sheet-chip.sticker--paper span { color: var(--tz-ink); }
.tz-sheet li:nth-child(4n+2) .tz-sheet-chip { border-radius: 12px; }
.tz-sheet li:nth-child(4n+3) .tz-sheet-chip { border-radius: 999px; }
.tz-sheet li:nth-child(4n+4) .tz-sheet-chip { border-radius: 4px; }
.tz-sheet li:nth-child(4n+1) .tz-sheet-chip { border-radius: 999px; }
.tz-typechip { width: 100%; min-height: 96px; flex-direction: column; gap: 4px; border-radius: 16px; font-size: 22px; }
.tz-typechip span { font-family: var(--tz-font-mono); font-size: 12px; font-weight: 400; text-transform: none; }
a.tz-typechip:hover, a.tz-sheet-chip:hover { background: var(--tz-accent); color: var(--tz-ink); filter: none; }
a.tz-typechip.sticker--paper:hover, a.tz-sheet-chip.sticker--paper:hover,
a.tz-sheet-chip.sticker--accent:hover { color: var(--tz-text); }
a.tz-typechip:hover span, a.tz-sheet-chip:hover span { color: inherit; }

/* ---------- Home: remastered peeling sticker ---------- */
.tz-rem { display: flex; flex-wrap: wrap; gap: 48px; align-items: center; }
.tz-rem__card { flex: 1 1 520px; min-width: 0; position: relative; display: block; transform: rotate(-2deg); clip-path: polygon(0 0, 100% 0, 100% 84%, 90% 100%, 0 100%); }
.tz-rem__paper { background: var(--tz-cream); color: #2A2620; border-radius: 22px; padding: 16px 16px 44px; display: flex; flex-direction: column; gap: 14px; }
.tz-rem__paper img { border-radius: 8px; background: transparent; }
.tz-rem__link { display: flex; flex-direction: column; gap: 14px; color: inherit; }
.tz-rem__link:hover { color: inherit; }
.tz-rem__title { font-stretch: 125%; font-weight: 900; font-size: 38px; line-height: .95; text-transform: uppercase; transition: color .15s; }
.tz-rem__link:hover .tz-rem__title { color: var(--tz-accent); }
.tz-rem__paper .tz-byline { color: #2A2620; font-size: 12px; }
.tz-rem__peel { position: absolute; right: 0; bottom: 0; width: 10%; height: 16%; background: linear-gradient(135deg, #F5F5F0 0%, #BDB6A4 55%, #8E887A 100%); clip-path: polygon(0 0, 100% 0, 0 100%); box-shadow: -4px -4px 8px rgba(0, 0, 0, .35); }
.tz-rem__card .sticker { position: absolute; top: 28px; left: 28px; transform: rotate(-4deg); z-index: 2; }
/* f/stop: the Remastered print, mirrored (photo on the right, tilted the other way) */
.tz-fstop .tz-rem__card { transform: rotate(2deg); }
.tz-fstop .tz-fstop__h { text-transform: none; }
.tz-fstop.is-loading .tz-fstop__img, .tz-fstop.is-loading .tz-fstop__title, .tz-fstop.is-loading .tz-fstop__credit { opacity: 0; }
.tz-fstop__img, .tz-fstop__title, .tz-fstop__credit { transition: opacity .25s; }
.tz-rem__text { flex: 1 1 360px; display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.tz-rem__h { margin: 0; font-stretch: 125%; font-weight: 900; font-size: clamp(34px, 4.6vw, 64px); line-height: .86; text-transform: uppercase; white-space: nowrap; }

/* ---------- Newsletter bumper sticker ---------- */
.tz-bumper {
	background: var(--tz-accent);
	color: var(--tz-ink);
	border-radius: 18px;
	padding: clamp(24px, 4vw, 44px) clamp(20px, 4vw, 56px);
	display: flex;
	flex-wrap: wrap;
	gap: 24px 48px;
	align-items: center;
	transform: rotate(-1deg);
}
.tz-bumper__copy { flex: 1 1 420px; display: flex; flex-direction: column; gap: 10px; }
.tz-bumper__copy p { margin: 0; font-size: 18px; line-height: 1.5; font-weight: 600; max-width: 46ch; }
.tz-bumper__form { flex: 1 1 380px; }
.tz-newsletter-form { display: flex; flex-wrap: wrap; gap: 8px; }
.tz-newsletter-form input[type=email] {
	flex: 1 1 220px;
	min-height: 54px;
	background: var(--tz-text);
	border: 3px solid var(--tz-ink);
	border-radius: 999px;
	color: var(--tz-ink);
	padding: 0 20px;
	font-family: var(--tz-font-mono);
	font-size: 15px;
}
.tz-newsletter-form button {
	min-height: 54px;
	padding: 0 28px;
	border: 3px solid var(--tz-ink);
	border-radius: 999px;
	background: var(--tz-ink);
	color: var(--tz-text);
	font-stretch: 125%;
	font-weight: 900;
	font-size: 15px;
	text-transform: uppercase;
	cursor: pointer;
}
.tz-newsletter-done, .tz-newsletter-error { flex: 1 1 100%; margin: 6px 0 0; font-weight: 700; }

/* ---------- Events: credential pass + lanyard cards ---------- */
.tz-pass { display: block; margin-bottom: 56px; }
.tz-pass__inner { background: var(--tz-text); color: var(--tz-ink); border-radius: 22px; padding: 14px; display: flex; flex-wrap: wrap; box-shadow: 0 12px 0 rgba(0, 0, 0, .45); }
.tz-pass__media { flex: 3 1 560px; min-width: 0; }
.tz-pass__media { display: block; }
.tz-pass__media img { border-radius: 8px; }
.tz-pass__info { flex: 2 1 300px; margin-left: clamp(18px, 3vw, 36px); padding: clamp(18px, 3vw, 36px); display: flex; flex-direction: column; gap: 14px; justify-content: center; border-left: 3px dashed var(--tz-ink); }
.tz-pass__link { display: flex; flex-direction: column; gap: 14px; color: var(--tz-ink); }
.tz-pass__link:hover { color: var(--tz-ink); }
.tz-pass__link:hover .tz-pass__title, .tz-pass:has(.tz-pass__media:hover) .tz-pass__title { color: var(--tz-ink); -webkit-text-stroke-color: var(--tz-accent); }
.tz-pass .tz-byline { color: var(--tz-ink); font-size: 12px; }
.tz-pass__kicker { font-family: var(--tz-font-mono); font-size: 12px; font-weight: 700; letter-spacing: .2em; }
.tz-pass__title { font-stretch: 125%; font-weight: 900; font-size: clamp(44px, 5vw, 84px); line-height: .82; color: var(--tz-accent); -webkit-text-stroke: 2px var(--tz-ink); text-transform: uppercase; }
.tz-pass__sub { font-weight: 800; font-size: 22px; line-height: 1.2; }
.tz-pass a.sticker, .tz-pass .sticker { background: var(--tz-ink); color: var(--tz-text); border-color: var(--tz-ink); }
.tz-pass a.sticker:hover { background: var(--tz-accent); color: var(--tz-ink); filter: none; }
.tz-pass:hover { color: var(--tz-ink); }
/* Event cards: the same white band as the photo frames (6px, 14px outer radius) */
.tz-lanyard { display: flex; flex-direction: column; background: var(--tz-surface); border-radius: 14px; overflow: hidden; border: 6px solid var(--tz-text); box-shadow: 0 10px 0 rgba(0, 0, 0, .45); color: var(--tz-text); }
.tz-lanyard__media { position: relative; }
.tz-lanyard__media::after { content: ''; position: absolute; top: 10px; left: 50%; width: 56px; height: 12px; margin-left: -28px; border-radius: 999px; background: var(--tz-ink); border: 2px solid #55555D; }
.tz-lanyard__body { padding: 18px 18px 20px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; border-top: 3px dashed #3A3A42; }
.tz-lanyard__media { display: block; }
.tz-lanyard .tz-card__link { color: var(--tz-text); }
.tz-lanyard .tz-card__link:hover .tz-card__title, .tz-lanyard:has(.tz-lanyard__media:hover) .tz-card__title { color: var(--tz-accent); }

/* ---------- f/stop rear window strip ---------- */

/* ---------- Page heads (archives, search, pages) ---------- */
.tz-page-head { padding-top: 56px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; }
.tz-page-head__main { display: flex; flex-direction: column; gap: 10px; }
.tz-page-head .tz-dymo { align-self: flex-start; }
.tz-count { padding: 10px 18px; border-radius: 999px; font-size: 16px; transform: rotate(4deg); }
.tz-bio { flex: 1 1 100%; max-width: 70ch; color: var(--tz-text-soft); font-size: 17px; line-height: 1.6; }

/* Archive filter (markup and script from the old theme) */
.tz-archive-filters {
	margin-top: 36px;
	background: var(--tz-paper);
	color: var(--tz-ink);
	border-radius: 14px;
	padding: 18px 22px;
	display: flex;
	flex-wrap: wrap;
	gap: 14px 18px;
	align-items: center;
	transform: rotate(-.3deg);
	box-shadow: 0 8px 0 rgba(0, 0, 0, .45);
	flex: 1 1 100%;
}
.tz-archive-filters select {
	min-height: 50px;
	background: var(--tz-ink);
	color: var(--tz-text);
	border: 3px solid var(--tz-text);
	border-radius: 999px;
	padding: 0 18px;
	font-weight: 700;
	font-size: 15px;
	min-width: 220px;
}
.tz-archive-filters select:disabled { opacity: .45; }
.tz-archive-filters .button {
	min-height: 50px;
	padding: 0 24px;
	border-radius: 999px;
	background: var(--tz-ink);
	color: var(--tz-text);
	border: 4px solid var(--tz-ink);
	font-stretch: 125%;
	font-weight: 900;
	text-transform: uppercase;
	cursor: pointer;
	box-shadow: 0 6px 0 rgba(0, 0, 0, .3);
}
.tz-filter-group { display: inline-flex; flex-wrap: wrap; gap: 10px; }
.tz-filter-or { font-family: var(--tz-font-mono); font-weight: 700; }
.tz-filter-reset { color: var(--tz-ink); font-family: var(--tz-font-mono); font-weight: 700; text-decoration: underline; min-height: 50px; display: inline-flex; align-items: center; }
.tz-filter-reset:hover { color: #000; }

/* Pagination */
.tz-pagination { padding-top: 88px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; align-items: center; }
.tz-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 52px; height: 52px; padding: 0 14px;
	border: 4px solid var(--tz-text); border-radius: 999px; box-shadow: 0 6px 0 rgba(0, 0, 0, .45);
	background: var(--tz-ink); color: var(--tz-text);
	font-stretch: 125%; font-weight: 900; font-size: 16px; text-transform: uppercase;
}
.tz-pagination .page-numbers.current { background: var(--tz-accent); color: var(--tz-ink); transform: rotate(-4deg); }
.tz-pagination .page-numbers.dots { border: 0; box-shadow: none; background: none; color: var(--tz-text-secondary); font-family: var(--tz-font-mono); }
.tz-pagination .next, .tz-pagination .prev { background: var(--tz-text); color: var(--tz-ink); padding: 0 22px; }
.tz-pagination a.page-numbers:hover { color: var(--tz-text); filter: brightness(1.15); }
.tz-pagination .next:hover, .tz-pagination .prev:hover { color: var(--tz-ink); }

/* ---------- Article ---------- */
.tz-art-hero { position: relative; padding-top: 32px; }
.tz-art-hero .tz-vinyl { --fr: 16px; }
.tz-art-hero .tz-hero__round { top: calc(32px + 40px); right: calc(var(--tz-gutter) + 48px); } /* same spot on the photo as the homepage hero */
.tz-art-head { padding-top: 40px; }
.tz-art-tags { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.tz-art-title { margin: 22px 0 0; font-stretch: 125%; font-weight: 900; font-size: clamp(36px, 6.2vw, 96px); line-height: .9; letter-spacing: -.03em; text-transform: uppercase; max-width: 16ch; }
.tz-art-meta {
	display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center;
	margin-top: 28px; padding: 18px 0; border-top: 2px dashed #3A3A42; border-bottom: 2px dashed #3A3A42;
	font-family: var(--tz-font-mono); font-size: 14px;
}
.tz-art-meta a { color: var(--tz-accent); font-weight: 700; }
.tz-art-meta a:hover { color: var(--tz-text); }
.tz-share-btn { margin-left: auto; min-height: 44px; padding: 0 18px; border-radius: 999px; font-size: 13px; }
.tz-share-btn.tz-share-copied { background: var(--tz-accent); color: var(--tz-ink); }

.tz-strip {
	background: var(--tz-header-bg);
	border: 4px solid var(--tz-text);
	border-radius: 14px;
	box-shadow: 0 8px 0 rgba(0, 0, 0, .45);
	display: flex; flex-wrap: wrap; align-items: stretch; overflow: hidden;
	transform: rotate(-.4deg);
	margin: 0 0 28px;
}
.tz-strip__label { flex: 0 0 auto; background: var(--tz-accent); color: var(--tz-ink); padding: 18px 22px; font-stretch: 125%; font-weight: 900; font-size: 20px; line-height: 1; text-transform: uppercase; display: flex; align-items: center; }
.tz-strip__text, .tz-art-body .tz-strip__text { flex: 1 1 420px; align-self: center; margin: 0; padding: 16px 22px; font-size: 16px; line-height: 1.55; color: var(--tz-text-soft); }
.tz-strip__text a { color: var(--tz-accent); font-weight: 700; }

.tz-art-layout { display: flex; flex-wrap: wrap; gap: 56px; align-items: flex-start; padding-top: 48px; }
.tz-art-body { flex: 999 1 640px; min-width: 0; max-width: 820px; }
.tz-art-layout:not(.has-sidebar) .tz-art-body { margin: 0 auto; max-width: 900px; }
.tz-art-body p { margin: 0 0 24px; font-size: 19px; line-height: 1.75; color: #E4E4E8; }
.tz-art-body a { color: var(--tz-accent); font-weight: 700; text-decoration: none; }
.tz-art-body a:hover { color: var(--tz-text); }
.tz-art-body h2, .tz-art-body h3, .tz-art-body h4 { font-stretch: 125%; font-weight: 900; text-transform: uppercase; line-height: 1; margin: 40px 0 18px; }
.tz-art-body h2 { font-size: clamp(26px, 3vw, 36px); }
.tz-art-body h3 { font-size: clamp(22px, 2.4vw, 28px); }
.tz-art-body ul, .tz-art-body ol { font-size: 18px; line-height: 1.7; color: #E4E4E8; padding-left: 1.3em; margin: 0 0 24px; }
.tz-art-body blockquote { margin: 32px 0; padding: 18px 24px; border-left: 0; background: var(--tz-surface); border-radius: 14px; box-shadow: inset 0 0 0 3px var(--tz-divider); font-size: 20px; }
.tz-art-body iframe, .tz-art-body video { max-width: 100%; }
.tz-art-body .wp-block-embed__wrapper iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; border-radius: 12px; }
.tz-art-body .wp-block-image img, .tz-art-body img[class*="gb-media"] { border-radius: 12px; }

/* Inline gallery images: floated 45%, alternating; full width on phones */
.tz-inline-img { margin-top: 6px; overflow: visible; border-radius: 0; }
.tz-inline-img a { display: block; padding: 4px; border: 0; border-radius: 10px; overflow: hidden; background: var(--tz-text); box-shadow: 0 8px 0 rgba(0, 0, 0, .4); }
.tz-inline-img img { display: block; width: 100%; height: auto; border-radius: 6px; }
.tz-inline-img.right a { transform: rotate(1.2deg); }
.tz-inline-img.left a { transform: rotate(-1.2deg); }
.tz-photo-credit { font-family: var(--tz-font-mono); font-size: 11px !important; color: var(--tz-text-secondary) !important; margin-top: 10px !important; letter-spacing: .02em; }

/* Quick facts + build sheet */
.tz-side { flex: 1 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 28px; }
@media (min-width: 1001px) { .tz-art-layout.has-sidebar .tz-side { position: sticky; top: 40px; } }
.tz-facts { background: var(--tz-paper); color: var(--tz-ink); border-radius: 14px; padding: 22px; transform: rotate(1deg); box-shadow: 0 8px 0 rgba(0, 0, 0, .45); }
.tz-facts h2 { margin: 0 0 14px; font-size: 22px; }
.tz-facts dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 10px 16px; align-items: baseline; }
.tz-facts dt { font-family: var(--tz-font-mono); font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.tz-facts dd { margin: 0; font-weight: 800; font-size: 17px; overflow-wrap: anywhere; }
.tz-facts a { color: var(--tz-ink); text-decoration: underline; }
.tz-build { background: var(--tz-surface); border: 3px solid var(--tz-divider); border-radius: 14px; padding: 22px; display: flex; flex-direction: column; gap: 18px; }
.tz-build__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.tz-build__head h2 { margin: 0; font-size: 22px; }
.tz-build__spec + .tz-build__spec { border-top: 2px dashed #3A3A42; padding-top: 16px; }
.tz-build__spec h3 { margin: 0 0 6px; font-family: var(--tz-font-mono); font-size: 11px; letter-spacing: .16em; color: var(--tz-accent); text-transform: uppercase; font-weight: 700; }
.tz-build__spec p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--tz-text-soft); }

/* Gallery (Core markup, Design 05 styling) */
.tz-gallery-divider { margin: 72px 0 0; display: flex; }
/* Rule under GALLERY: the space below it matches the space between the
   letters and the rule (12px margin + the line box below the caps). */
.tz-gallery-divider .tz-gallery-title { margin-bottom: 0 !important; }
.tz-gallery-divider .tz-gallery-title::after { margin-bottom: 0; }
.tz-gallery-divider + .tz-gallery { margin-top: 28.5px; } /* measured: GALLERY baseline-to-rule gap at all widths */
.tz-gallery-title {
	margin: 0; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; width: 100%;
	font-stretch: 125%; font-weight: 900; font-size: clamp(40px, 5.6vw, 84px); line-height: .86; text-transform: uppercase; color: var(--tz-text);
}
.tz-gallery-credit { font-family: var(--tz-font-mono); font-size: 13px; font-weight: 400; letter-spacing: 0; text-transform: none; line-height: 1.4; }
.tz-gallery-credit a { color: var(--tz-accent); font-weight: 700; }
.tz-gallery { background: transparent; border: 0; border-radius: 0; overflow: visible; }
.tz-gallery-main { box-sizing: content-box; width: calc(100% - 12px); max-width: none; padding: 6px; border: 0; border-radius: 14px; box-shadow: 0 10px 0 rgba(0, 0, 0, .45); background: var(--tz-text); }
.tz-gallery-image-wrap { background: #000; border-radius: 8px; overflow: hidden; }
.tz-gallery-image { border-radius: 0; }
.tz-gallery-controls { background: transparent; border-top: 0; padding: 22px 0 14px; }
.tz-gallery-nav { width: 56px; height: 56px; border: 4px solid var(--tz-text); background: var(--tz-ink); box-shadow: 0 6px 0 rgba(0, 0, 0, .45); }
.tz-gallery-nav:hover { background: var(--tz-accent); border-color: var(--tz-text); color: var(--tz-ink); }
.tz-gallery-counter { font-family: var(--tz-font-mono); color: var(--tz-text); background: #0B0B0C; padding: 5px 10px 4px; border-radius: 3px; letter-spacing: .14em; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 2px 0 rgba(0, 0, 0, .6); }
.tz-gallery-thumbs { padding: 6px 0 14px; background: transparent; gap: 8px; scroll-snap-type: x mandatory; }
.tz-gallery-thumb { box-sizing: content-box; width: 144px; height: 96px; border: 3px solid transparent; border-radius: 8px; background: #000; scroll-snap-align: start; }
.tz-gallery-thumb.active { border-color: var(--tz-accent); }

/* Related */
.tz-related { padding-top: 104px; }

/* ---------- Pages ---------- */
.tz-prose { flex: 999 1 640px; min-width: 0; max-width: 820px; }
.tz-prose p, .tz-prose li { font-size: 18px; line-height: 1.75; color: #E4E4E8; }
.tz-prose p { margin: 0 0 22px; }
.tz-prose a { color: var(--tz-accent); font-weight: 700; overflow-wrap: anywhere; }
.tz-prose a:hover { color: var(--tz-text); }
.tz-prose h2 { font-stretch: 125%; font-weight: 900; text-transform: uppercase; font-size: clamp(24px, 2.4vw, 32px); line-height: 1; margin: 0 0 16px; padding-top: 28px; border-top: 2px dashed #3A3A42; }
.tz-prose h2:first-child { border-top: 0; padding-top: 0; }
.tz-prose h3 { font-stretch: 125%; font-weight: 900; text-transform: uppercase; font-size: 20px; margin: 24px 0 10px; }
.tz-page-cols { display: flex; flex-wrap: wrap; gap: 56px; align-items: flex-start; padding-top: 56px; }
.tz-toc { flex: 1 1 300px; min-width: 0; background: var(--tz-paper); color: var(--tz-ink); border-radius: 14px; padding: 22px 24px; transform: rotate(-.8deg); box-shadow: 0 8px 0 rgba(0, 0, 0, .45); align-self: flex-start; }
.tz-toc h2 { margin: 0 0 10px; font-family: var(--tz-font-mono); font-size: 11px; letter-spacing: .16em; color: #2A2A30; }
.tz-toc ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; counter-reset: t; }
.tz-toc li { counter-increment: t; }
.tz-toc a { display: flex; gap: 10px; align-items: baseline; padding: 8px 0; font-weight: 700; font-size: 15px; line-height: 1.3; color: var(--tz-ink); }
.tz-toc a::before { content: counter(t, decimal-leading-zero); font-family: var(--tz-font-mono); font-size: 11px; color: #55555D; }
.tz-toc a:hover { color: var(--tz-ink); text-decoration: underline; }

/* About: contributors (list appended to the page content by Core) */
.tz-contributors { background: var(--tz-paper); color: var(--tz-ink); border-radius: 16px; padding: clamp(22px, 3vw, 40px); transform: rotate(-.3deg); box-shadow: 0 10px 0 rgba(0, 0, 0, .45); margin-top: 104px; }
.tz-contributors-heading { margin: 0 0 24px !important; padding: 0 !important; border: 0 !important; color: var(--tz-ink); font-stretch: 125%; font-weight: 900; font-size: clamp(30px, 4.4vw, 64px) !important; line-height: .9; text-transform: uppercase; }
.tz-contributor-list { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-wrap: wrap; gap: 10px; }
.tz-contributor-list li { margin: 0; font-size: 14px !important; line-height: 1 !important; }
.tz-contributor-list a {
	display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px;
	border: 3px solid var(--tz-ink); border-radius: 999px; background: var(--tz-text); color: var(--tz-ink) !important;
	font-weight: 800 !important; box-shadow: 0 3px 0 rgba(0, 0, 0, .35);
}
.tz-contributor-list a:hover { background: var(--tz-accent); }
.tz-archive-shots { flex: 1 1 360px; min-width: 0; display: flex; flex-direction: column; gap: 36px; }
.tz-archive-shots figure { margin: 0; position: relative; }
.tz-archive-shots .tz-dymo { position: absolute; left: 14px; bottom: -12px; }

/* Contact (WPForms restyle) */
.tz-contact { display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start; padding-top: 56px; }
.tz-contact__panel { flex: 999 1 620px; min-width: 0; background: var(--tz-surface); border: 3px solid var(--tz-divider); border-radius: 18px; padding: clamp(22px, 3vw, 40px); }
.tz-contact__panel h2 { margin: 0 0 22px; font-size: clamp(28px, 3vw, 40px); }
.tz-contact__side { flex: 1 1 320px; min-width: 0; }
/* Contact: the form is a centred column under the full-width heading */
.tz-contact-col { max-width: 920px; }
.tz-mailcard { background: var(--tz-text); color: var(--tz-ink); border-radius: 14px; padding: 26px 26px 30px; transform: rotate(2deg); box-shadow: 0 10px 0 rgba(0, 0, 0, .45); position: relative; }
.tz-mailcard .tz-dymo { position: absolute; top: -14px; left: 22px; }
.tz-mailcard p, .tz-mailcard h2 { color: var(--tz-ink); }
.tz-mailcard h2 { margin: 8px 0 14px; font-size: 26px; }
.tz-mailcard p { margin: 0; font-family: var(--tz-font-mono); font-size: 16px; line-height: 1.7; }
.wpforms-container .wpforms-field { padding: 0 0 22px !important; }
.wpforms-container .wpforms-field-label { font-family: var(--tz-font-mono) !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--tz-text) !important; margin-bottom: 8px !important; }
.wpforms-container .wpforms-required-label { color: var(--tz-accent) !important; }
.wpforms-container input[type=text], .wpforms-container input[type=email], .wpforms-container textarea {
	width: 100% !important; max-width: none !important; background: var(--tz-ink) !important; border: 3px solid var(--tz-text) !important; border-radius: 14px !important;
	color: var(--tz-text) !important; padding: 14px 18px !important; font-size: 17px !important; min-height: 56px; box-shadow: none !important;
}
.wpforms-container input:focus, .wpforms-container textarea:focus { border-color: var(--tz-accent) !important; outline: none; box-shadow: 0 0 0 3px var(--tz-accent-glow) !important; }
.wpforms-container .wpforms-submit {
	min-height: 56px !important; padding: 0 30px !important; border-radius: 999px !important; background: var(--tz-text) !important; color: var(--tz-ink) !important;
	border: 4px solid var(--tz-text) !important; box-shadow: 0 6px 0 rgba(0, 0, 0, .45) !important; font-stretch: 125%; font-weight: 900 !important; text-transform: uppercase; font-size: 16px !important;
}
.wpforms-container .wpforms-submit:hover, .wpforms-container .wpforms-submit:focus-visible { background: var(--tz-accent) !important; color: var(--tz-text) !important; }
.wpforms-container .wpforms-error, .wpforms-container label.wpforms-error { color: #FF8A7A !important; }
.wpforms-confirmation-container-full { background: var(--tz-ink) !important; border: 3px solid var(--tz-accent) !important; color: var(--tz-text) !important; border-radius: 14px; }

/* 404 */
.tz-404 { max-width: 1000px; margin: 0 auto; padding: 80px var(--tz-gutter) 0; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 22px; }
.tz-404__code { margin: 0; font-stretch: 125%; font-weight: 900; font-size: clamp(120px, 22vw, 300px); line-height: .8; letter-spacing: -.04em; text-shadow: 10px 8px 0 var(--tz-accent); }
.tz-404 .tz-searchform { width: 100%; max-width: 680px; text-align: left; }

/* Photo wall page */
.tz-photo-wall-page { padding-top: 40px; }
.tz-pw-item { border: 3px solid var(--tz-text); border-radius: 10px; overflow: hidden; background: #000; }
.tz-pw-item:hover { border-color: var(--tz-accent); }
.tz-pw-status { font-family: var(--tz-font-mono); }

/* ---------- Footer ---------- */
.tz-footer { margin-top: 120px; background: var(--tz-header-bg); border-top: 8px solid var(--tz-accent); }
.tz-footer__inner { max-width: var(--tz-max); margin: 0 auto; padding: 56px var(--tz-gutter) 28px; display: flex; flex-direction: column; gap: 40px; }
.tz-footer__cols { display: flex; flex-wrap: wrap; gap: 40px; justify-content: space-between; }
.tz-footer__about { flex: 1 1 320px; display: flex; flex-direction: column; gap: 14px; }
.tz-footer__about img.tz-footer-logo { width: 230px; height: auto; }
.tz-footer__about p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--tz-text-soft); max-width: 44ch; }
.tz-footer h2 { margin: 0 0 12px; font-family: var(--tz-font-mono); font-size: 11px; font-weight: 400; letter-spacing: .16em; color: var(--tz-text-secondary); text-transform: uppercase; }
.tz-footer__col { flex: 0 1 180px; }
.tz-footer__col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; font-size: 16px; font-weight: 600; }
.tz-footer__news { flex: 1 1 280px; }
.tz-footer__news .tz-newsletter-form { flex-direction: column; }
.tz-footer__news .tz-newsletter-form input[type=email] { background: var(--tz-bg); border: 2px solid #44444C; color: var(--tz-text); min-height: 48px; flex: 0 0 auto; }
.tz-footer__news .tz-newsletter-form button { background: var(--tz-accent); color: var(--tz-ink); border: 0; min-height: 48px; }
.tz-social { display: flex; gap: 10px; }
.tz-social a { width: 46px; height: 46px; border-radius: 50%; border-width: 3px; padding: 0; }
.tz-play { align-self: flex-start; display: inline-block; }
.tz-play img { display: block; height: 48px; width: auto; }
.tz-footer__bottom { display: flex; flex-wrap: wrap; gap: 12px 24px; justify-content: space-between; border-top: 2px dashed #2A2A30; padding-top: 18px; font-size: 13px; color: var(--tz-text-secondary); }
.tz-footer__bottom nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 16px; }
.tz-footer__bottom a { color: var(--tz-text-secondary); }
.tz-footer__bottom a:hover { color: var(--tz-accent); }

/* ---------- Gear: product boxes and the buy bar (Core markup), Design 05 ---------- */
.tz-gear-card {
	background: var(--tz-surface);
	border: 6px solid var(--tz-text);
	border-radius: 14px;
	box-shadow: 0 10px 0 rgba(0, 0, 0, .45);
}
.tz-gear-card .tz-gear-media { border-radius: 8px; background: #000; }
.tz-gear-card .tz-gear-brand { font-family: var(--tz-font-mono); font-weight: 700; letter-spacing: .16em; }
.tz-gear-card .tz-gear-name { font-stretch: 125%; font-weight: 900; font-size: 24px; line-height: 1.05; text-transform: uppercase; color: var(--tz-text); }
.tz-gear-card .tz-gear-meta { font-family: var(--tz-font-mono); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
.tz-gear-card .tz-gear-buttons { gap: 12px; }
.tz-gear-card .tz-gear-btn,
.tz-gear-bar .tz-gear-bar-btn {
	min-height: 48px;
	padding: 0 22px;
	border: 4px solid var(--tz-text);
	border-radius: 999px;
	background: var(--tz-ink);
	color: var(--tz-text);
	box-shadow: 0 6px 0 rgba(0, 0, 0, .45);
	font-family: var(--tz-font-body);
	font-stretch: 125%;
	font-weight: 900;
	font-size: 13px;
	letter-spacing: 0;
	text-transform: uppercase;
}
.tz-gear-card .tz-gear-btn.is-primary,
.tz-gear-bar .tz-gear-bar-btn { background: var(--tz-accent); border-color: var(--tz-text); color: var(--tz-ink); }
/* Hover: orange, text colour inverted (same rule as every other sticker) */
.tz-gear-card .tz-gear-btn:hover, .tz-gear-card .tz-gear-btn:focus-visible { background: var(--tz-accent); border-color: var(--tz-text); color: var(--tz-ink); }
.tz-gear-card .tz-gear-btn.is-primary:hover, .tz-gear-card .tz-gear-btn.is-primary:focus-visible,
.tz-gear-bar .tz-gear-bar-btn:hover, .tz-gear-bar .tz-gear-bar-btn:focus-visible { background: var(--tz-accent); color: var(--tz-text); }
.tz-gear-bar { background: var(--tz-surface); border-top: 6px solid var(--tz-text); -webkit-backdrop-filter: none; backdrop-filter: none; }
.tz-gear-bar .tz-gear-bar-img { border-radius: 6px; }
.tz-gear-bar .tz-gear-bar-name { font-weight: 800; color: var(--tz-text); }
.tz-gear-bar .tz-gear-bar-btn { min-height: 44px; padding: 0 20px; box-shadow: 0 4px 0 rgba(0, 0, 0, .45); }
.tz-gear-bar .tz-gear-bar-close {
	width: 34px; height: 34px;
	border: 3px solid var(--tz-text);
	background: var(--tz-ink);
	color: var(--tz-text);
	font-size: 18px;
	box-shadow: 0 3px 0 rgba(0, 0, 0, .45);
}
.tz-gear-bar .tz-gear-bar-close:hover, .tz-gear-bar .tz-gear-bar-close:focus-visible { background: var(--tz-accent); color: var(--tz-ink); }
@media (min-width: 769px) {
	.tz-gear-bar {
		border: 6px solid var(--tz-text);
		border-radius: 14px;
		box-shadow: 0 10px 0 rgba(0, 0, 0, .45);
	}
}
@media (max-width: 700px) {
	.tz-gear-card .tz-gear-name { font-size: 20px; }
	.tz-gear-card .tz-gear-btn { width: 100%; }
}

/* ---------- Load more (section pages) ---------- */
.tz-loadmore { display: flex; justify-content: center; padding-top: 72px; }
.tz-loadmore[hidden], .tz-pagination[hidden] { display: none; }

/* ---------- Cookie consent (Complianz): black sticker panel, white band ---------- */
.cmplz-cookiebanner {
	--cmplz_banner_background_color: var(--tz-ink);
	--cmplz_banner_border_color: var(--tz-text);
	--cmplz_banner_border_width: 6px;
	--cmplz_banner_border_radius: 14px;
	--cmplz_text_color: var(--tz-text);
	--cmplz_hyperlink_color: var(--tz-accent);
	--cmplz_button_border_radius: 999px;
	--cmplz_button_accept_background_color: var(--tz-accent);
	--cmplz_button_accept_border_color: var(--tz-text);
	--cmplz_button_accept_text_color: var(--tz-ink);
	--cmplz_button_deny_background_color: var(--tz-ink);
	--cmplz_button_deny_border_color: var(--tz-text);
	--cmplz_button_deny_text_color: var(--tz-text);
	--cmplz_button_settings_background_color: var(--tz-ink);
	--cmplz_button_settings_border_color: var(--tz-text);
	--cmplz_button_settings_text_color: var(--tz-text);
	--cmplz_slider_active_color: var(--tz-accent);
	--cmplz_slider_inactive_color: #44444C;
	--cmplz_slider_bullet_color: var(--tz-text);
	--cmplz_category_header_always_active_color: var(--tz-accent);
	box-shadow: 0 10px 0 rgba(0, 0, 0, .45) !important;
	font-family: var(--tz-font-body);
}
.cmplz-cookiebanner .cmplz-title { font-stretch: 125%; font-weight: 900; text-transform: uppercase; letter-spacing: 0; }
.cmplz-cookiebanner .cmplz-close { color: var(--tz-text); }
.cmplz-cookiebanner .cmplz-close:hover { color: var(--tz-accent); }
.cmplz-cookiebanner .cmplz-btn {
	border-width: 4px !important;
	box-shadow: 0 6px 0 rgba(0, 0, 0, .45);
	font-family: var(--tz-font-body);
	font-stretch: 125%;
	font-weight: 900;
	text-transform: uppercase;
}
/* Hover: orange, text colour inverted (same as every other sticker) */
.cmplz-cookiebanner .cmplz-btn:hover { background-color: var(--tz-accent) !important; color: var(--tz-ink) !important; text-decoration: none; }
.cmplz-cookiebanner .cmplz-btn.cmplz-accept:hover { color: var(--tz-text) !important; }
.cmplz-cookiebanner .cmplz-categories .cmplz-category { background-color: var(--tz-surface); border-radius: 10px; }
.cmplz-cookiebanner .cmplz-links .cmplz-link { color: var(--tz-accent); }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
	.g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.g8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.g6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1000px) {
	.tz-nav { display: none; }
	.tz-mbar { display: flex; }
}
@media (max-width: 900px) {
	.g3 { grid-template-columns: minmax(0, 1fr); }
	.tz-pass__info { border-left: 0; border-top: 3px dashed var(--tz-ink); margin-left: 0; margin-top: clamp(18px, 3vw, 36px); }
}
@media (max-width: 760px) {
	:root { --tz-gutter: 16px; }
	.hide-sm { display: none !important; }
	.tz-tagline--side { display: none; }
	.tz-tagline--top { display: block; }
	.tz-tilt-l, .tz-tilt-r, .tz-tilt-l2, .tz-tilt-r2, .tz-bumper, .tz-rem__card, .tz-strip, .tz-facts, .tz-toc, .tz-mailcard, .tz-archive-filters, .tz-inline-img a { transform: none !important; }
	.tz-hero__overlay { position: static; background: none; padding: 16px 0 0; }
	.tz-hero__round, .tz-hello { display: none; }
	.tz-section { padding-top: 80px; }
	.tz-art-body p { font-size: 17px; }
	.tz-inline-img { width: 100% !important; float: none !important; margin: 8px 0 28px !important; }
	.tz-gallery-thumb { width: 114px; height: 76px; }
	.tz-archive-filters select { min-width: 0; width: 100%; }
	.tz-filter-group { width: 100%; }
	.tz-filter-group select { flex: 1 1 100%; }
	.tz-share-btn { margin-left: 0; }
	/* Phone: lighter title shadow so big type stays legible; no clipped headings. */
	.tz-ttl { text-shadow: 3px 3px 0 var(--tz-accent); }
	.tz-ttl a:hover, a:hover > .tz-ttl { text-shadow: 3px 3px 0 var(--tz-text); }
	.tz-h1 { font-size: clamp(40px, 13vw, 56px); overflow-wrap: anywhere; }
	.tz-strip__label { font-size: 16px; padding: 14px 18px; line-height: 1.1; }
	.tz-strip__label { flex: 1 1 100%; justify-content: center; text-align: center; }
	.tz-hero__flag { display: inline-flex; align-self: flex-start; }
	/* Section headers: View All always sits under the heading, centred */
	.tz-sec-head { flex-direction: column; align-items: flex-start; }
	.tz-sec-head > .sticker { align-self: center; }
	.tz-inline-img .tz-photo-credit, .tz-article-body .wp-block-image .tz-photo-credit { padding: 0 2px; }
}
@media (max-width: 600px) {
	.g4 { grid-template-columns: minmax(0, 1fr); }
	.g8, .g6, .g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tz-mini__thumb { flex-basis: 120px; }
}
@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; }
}