/* ==========================================================================
   GENERÁLT FÁJL — NE SZERKESZD KÖZVETLENÜL!
   Forrás: assets/css/src/*.css  ·  Build: php assets/css/build.php
   A komponensek a fájlnév-prefix (00..19) sorrendjében fűződnek össze.
   ========================================================================== */
/* ==========================================================================
   Invgroup Kft. — Brutalist 2026
   ========================================================================== */

:root {
	/* Brand palette */
	--ig-ink: #0A0A0A;
	--ig-paper: #FFFFFF;
	--ig-bone: #F5F2EC;
	--ig-accent: #E8FF00;
	--ig-accent-ink: #0A0A0A;
	--ig-line: #0A0A0A;
	--ig-muted: #6B6B6B;
	--ig-danger: #E11D48;
	--ig-ok: #15803D;

	/* Layout */
	--ig-stroke: 2px;
	--ig-stroke-bold: 3px;
	--ig-stroke-mega: 6px;
	--ig-radius: 0px;
	--ig-container: 1320px;
	--ig-gutter-x: clamp(20px, 4vw, 56px);
	--ig-gutter-y: clamp(48px, 8vw, 120px);

	/* Typography */
	--ig-font-display: "InterTight", "Inter", "Helvetica Neue", Arial, sans-serif;
	--ig-font-body: "Inter", "Helvetica Neue", Arial, sans-serif;
	--ig-font-mono: ui-monospace, "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;

	--ig-size-h1: clamp(48px, 9vw, 140px);
	--ig-size-h2: clamp(34px, 5vw, 72px);
	--ig-size-h3: clamp(24px, 3vw, 40px);
	--ig-size-h4: clamp(18px, 1.5vw, 24px);
	--ig-size-body: 16px;
	--ig-size-small: 13px;
	--ig-size-eyebrow: 12px;

	--ig-leading-tight: 0.92;
	--ig-leading-snug: 1.05;
	--ig-leading-body: 1.55;
	--ig-tracking-display: -0.02em;
	--ig-tracking-eyebrow: 0.16em;
}

/* ==========================================================================
   Reset
   ========================================================================== */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	/* Kill double-tap zoom and the 300ms tap delay site-wide. Pinch-zoom
	   still works for accessibility — only double-tap-to-zoom is disabled. */
	touch-action: manipulation;
}

body {
	background: var(--ig-paper);
	color: var(--ig-ink);
	font-family: var(--ig-font-body);
	font-size: var(--ig-size-body);
	line-height: var(--ig-leading-body);
	margin: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

img {
	display: block;
	height: auto;
	max-width: 100%;
}

button {
	font: inherit;
}

/* iOS Safari auto-zooms when an input has font-size below 16px. Enforce a
   16px (1rem) baseline on every form control so taps never trigger zoom.
   Larger sizes set by component rules (display fonts, big stepper inputs,
   etc.) override this through normal cascade. */
input,
select,
textarea {
	font-size: 16px;
}

/* ==========================================================================
   Typography
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
	font-family: var(--ig-font-display);
	font-weight: 800;
	letter-spacing: var(--ig-tracking-display);
	line-height: var(--ig-leading-tight);
	margin: 0 0 0.6em;
	text-transform: uppercase;
}

h1 { font-size: var(--ig-size-h1); }
h2 { font-size: var(--ig-size-h2); }
h3 { font-size: var(--ig-size-h3); }
h4 { font-size: var(--ig-size-h4); line-height: var(--ig-leading-snug); }

p { margin: 0 0 1em; }

/* Eyebrow tag — always reads as a yellow chip. Used on every page-head,
   section-head, hero, and admin notice. The --accent modifier remains as
   a no-op alias so older markup keeps working. */
.ig-eyebrow {
	background: var(--ig-accent);
	color: var(--ig-accent-ink, var(--ig-ink));
	display: inline-block;
	font-family: var(--ig-font-mono);
	font-size: var(--ig-size-eyebrow);
	font-weight: 700;
	letter-spacing: var(--ig-tracking-eyebrow);
	margin-bottom: 16px;
	padding: 4px 10px;
	text-transform: uppercase;
}

/* Kept for back-compat — same look as the base. */
.ig-eyebrow--accent {
	background: var(--ig-accent);
	color: var(--ig-accent-ink, var(--ig-ink));
	padding: 4px 10px;
}

.ig-muted { color: var(--ig-muted); }

/* ==========================================================================
   Layout
   ========================================================================== */

.ig-container {
	margin: 0 auto;
	max-width: var(--ig-container);
	padding: 0 var(--ig-gutter-x);
}

.ig-site-main {
	min-height: 60vh;
}

.ig-section {
	padding: var(--ig-gutter-y) 0;
}

/* ==========================================================================
   Header
   ========================================================================== */

.ig-site-header {
	background: var(--ig-paper);
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	position: sticky;
	top: 0;
	z-index: 30;
}

.ig-site-header__inner {
	align-items: stretch;
	display: flex;
	min-height: 80px;
	padding: 0;
	width: 100%;
}

.ig-brand {
	align-items: center;
	border-right: var(--ig-stroke-bold) solid var(--ig-line);
	display: flex;
	font-family: var(--ig-font-display);
	font-size: 22px;
	font-weight: 900;
	letter-spacing: -0.02em;
	padding: 0 28px;
	text-transform: uppercase;
}

.ig-brand strong {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	margin-left: 6px;
	padding: 0 6px;
}

.ig-nav {
	align-items: stretch;
	display: flex;
	flex: 1 1 auto;
	flex-wrap: wrap;
	justify-content: flex-end;
	padding: 0;
}

.ig-nav a {
	align-items: center;
	border-left: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-ink);
	display: flex;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	padding: 0 22px;
	text-transform: uppercase;
	transition: background 120ms ease, color 120ms ease;
}

.ig-nav a:hover,
.ig-nav a[aria-current="page"] {
	background: var(--ig-ink);
	color: var(--ig-paper);
}

.ig-context {
	align-items: stretch;
	border-left: var(--ig-stroke) solid var(--ig-line);
	display: flex;
	flex: 0 0 auto;
	padding: 0;
}

.ig-context select {
	background: var(--ig-paper);
	border: 0;
	border-radius: 0;
	color: var(--ig-ink);
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.06em;
	min-height: 100%;
	padding: 0 28px 0 18px;
	text-transform: uppercase;
}

.ig-context select:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-context button {
	background: var(--ig-ink);
	border: 0;
	color: var(--ig-paper);
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	min-height: 100%;
	padding: 0 18px;
	text-transform: uppercase;
}

.ig-cart-btn {
	align-items: center;
	background: var(--ig-ink);
	border-left: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-paper);
	display: flex;
	flex: 0 0 auto;
	min-width: 76px;
	padding: 0 22px;
	position: relative;
	transition: background 120ms ease, color 120ms ease;
}

.ig-cart-btn:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-cart-btn svg {
	display: block;
	height: 24px;
	width: 24px;
}

.ig-cart-btn__badge {
	background: var(--ig-accent);
	border: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-accent-ink);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0;
	line-height: 1;
	min-width: 22px;
	padding: 3px 5px;
	position: absolute;
	right: 8px;
	text-align: center;
	top: 12px;
}

.ig-cart-btn__badge[hidden] {
	display: none;
}

.ig-cart-spinner {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 14px;
	margin-left: 10px;
}

/* ==========================================================================
   Quick buy table
   ========================================================================== */

.ig-quickbuy {
	padding-top: 0;
	padding-bottom: 96px;
	position: relative;
}

.ig-quickbuy__filters {
	border-top: var(--ig-stroke-bold) solid var(--ig-line);
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	gap: 0;
	grid-template-columns: 2fr 1fr auto;
	margin-bottom: 24px;
}

.ig-quickbuy__filter {
	border-right: var(--ig-stroke) solid var(--ig-line);
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px 18px;
}

.ig-quickbuy__filter:last-child {
	border-right: 0;
}

.ig-quickbuy__filter > span {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.ig-quickbuy__filter input[type="search"],
.ig-quickbuy__filter select {
	background: transparent;
	border: 0;
	color: var(--ig-ink);
	font-family: var(--ig-font-display);
	font-size: 18px;
	font-weight: 700;
	padding: 0;
	width: 100%;
}

.ig-quickbuy__filter input[type="search"]:focus,
.ig-quickbuy__filter select:focus {
	outline: 0;
}

.ig-quickbuy__filter--search {
	min-width: 260px;
}

.ig-quickbuy__check {
	align-items: center;
	flex-direction: row !important;
	gap: 12px !important;
}

.ig-quickbuy__check input[type="checkbox"] {
	accent-color: var(--ig-accent);
	height: 20px;
	width: 20px;
}

.ig-quickbuy__check span {
	color: var(--ig-ink) !important;
	font-family: var(--ig-font-mono) !important;
	font-size: 13px !important;
}

.ig-quickbuy__wrap {
	overflow-x: auto;
}

.ig-quickbuy__table {
	border: var(--ig-stroke-bold) solid var(--ig-line);
	border-collapse: collapse;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	width: 100%;
}

.ig-quickbuy__table th {
	background: var(--ig-ink);
	color: var(--ig-paper);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.1em;
	padding: 12px 14px;
	text-align: left;
	text-transform: uppercase;
}

.ig-quickbuy__table tbody tr {
	border-top: var(--ig-stroke) solid var(--ig-line);
	transition: background 120ms ease;
}

.ig-quickbuy__table tbody tr:hover {
	background: var(--ig-bone);
}

.ig-quickbuy__table td {
	padding: 10px 14px;
	vertical-align: middle;
}

.ig-quickbuy__sku {
	color: var(--ig-muted);
	font-size: 11px;
	letter-spacing: 0.04em;
	white-space: nowrap;
}

.ig-quickbuy__col-num {
	text-align: right;
	white-space: nowrap;
}

.ig-quickbuy__col-qty {
	width: 80px;
}

.ig-quickbuy__col-qty input {
	background: var(--ig-bone);
	border: var(--ig-stroke) solid var(--ig-line);
	border-radius: 0;
	font-family: var(--ig-font-mono);
	font-weight: 700;
	min-height: 36px;
	padding: 0 8px;
	text-align: center;
	width: 64px;
}

.ig-quickbuy__table .ig-button {
	font-size: 11px;
	letter-spacing: 0.06em;
	min-height: 36px;
	padding: 0 12px;
	white-space: nowrap;
}

.ig-quickbuy__noprice {
	color: var(--ig-danger);
	font-size: 11px;
}

.ig-quickbuy__meta {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	margin-bottom: 12px;
	text-transform: uppercase;
}

.ig-quickbuy__more {
	border: var(--ig-stroke-bold) solid var(--ig-line);
	border-top: 0;
	display: flex;
	justify-content: center;
	padding: 20px;
}

.ig-quickbuy__more .ig-button {
	font-size: 12px;
	letter-spacing: 0.08em;
	min-height: 44px;
	padding: 0 24px;
}

.ig-quickbuy__toast {
	background: var(--ig-accent);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	bottom: 24px;
	color: var(--ig-accent-ink);
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
	left: 50%;
	letter-spacing: 0.04em;
	padding: 12px 22px;
	position: fixed;
	transform: translateX(-50%);
	z-index: 110;
}

.ig-quickbuy__toast[hidden] {
	display: none;
}

@media (max-width: 880px) {
	.ig-quickbuy__filters {
		grid-template-columns: 1fr;
	}
	.ig-quickbuy__filter {
		border-right: 0;
		border-bottom: var(--ig-stroke) solid var(--ig-line);
	}
	.ig-quickbuy__filter:last-child {
		border-bottom: 0;
	}
}

/* ==========================================================================
   Modal (confirm dialog)
   ========================================================================== */

.ig-modal {
	align-items: center;
	display: flex;
	inset: 0;
	justify-content: center;
	padding: 24px;
	position: fixed;
	z-index: 200;
}

.ig-modal__backdrop {
	animation: ig-modal-fade 200ms ease both;
	background: rgba(0, 0, 0, 0.7);
	inset: 0;
	position: absolute;
}

.ig-modal__panel {
	animation: ig-modal-pop 220ms cubic-bezier(0.34, 1.56, 0.64, 1) both;
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	box-shadow: 8px 8px 0 var(--ig-accent);
	max-width: 420px;
	padding: 28px 28px 24px;
	position: relative;
	width: 100%;
}

.ig-modal__panel h3 {
	font-size: 22px;
	letter-spacing: -0.01em;
	margin: 0 0 12px;
}

.ig-modal__panel p {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	letter-spacing: 0.02em;
	line-height: 1.5;
	margin: 0 0 22px;
}

.ig-modal__panel p strong {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	padding: 0 6px;
}

.ig-modal__actions {
	display: flex;
	gap: 10px;
}

.ig-modal__actions .ig-button {
	flex: 1;
	min-height: 48px;
	padding: 0 14px;
}

@keyframes ig-modal-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes ig-modal-pop {
	from { opacity: 0; transform: translateY(20px) scale(0.96); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ==========================================================================
   Hamburger button (mobile only, hidden by default)
   ========================================================================== */

.ig-hamburger {
	align-items: center;
	background: var(--ig-paper);
	border: 0;
	border-left: var(--ig-stroke-bold) solid var(--ig-line);
	cursor: pointer;
	display: none;
	flex-direction: column;
	gap: 5px;
	height: 100%;
	justify-content: center;
	min-height: 64px;
	padding: 0 18px;
	transition: background 120ms ease;
}

.ig-hamburger:hover {
	background: var(--ig-accent);
}

.ig-hamburger span {
	background: var(--ig-ink);
	display: block;
	height: 3px;
	transform-origin: center;
	transition: transform 240ms ease, opacity 200ms ease;
	width: 26px;
}

.ig-hamburger.is-open span:nth-child(1) {
	transform: translateY(8px) rotate(45deg);
}
.ig-hamburger.is-open span:nth-child(2) {
	opacity: 0;
}
.ig-hamburger.is-open span:nth-child(3) {
	transform: translateY(-8px) rotate(-45deg);
}

/* ==========================================================================
   Mobile drawer
   ========================================================================== */

.ig-drawer-backdrop {
	background: rgba(0, 0, 0, 0.55);
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: fixed;
	transition: opacity 240ms ease, visibility 0s linear 240ms;
	visibility: hidden;
	z-index: 80;
}

.ig-drawer-backdrop.is-open {
	opacity: 1;
	pointer-events: auto;
	transition: opacity 240ms ease, visibility 0s linear 0s;
	visibility: visible;
}

.ig-drawer-backdrop.is-open {
	opacity: 1;
}

.ig-drawer {
	background: var(--ig-paper);
	border-left: var(--ig-stroke-mega) solid var(--ig-line);
	display: none;
	flex-direction: column;
	height: 100dvh;
	max-width: 360px;
	overflow-y: auto;
	position: fixed;
	right: 0;
	top: 0;
	transform: translateX(105%);
	transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
	width: 86%;
	z-index: 90;
}

@media (max-width: 880px) {
	.ig-drawer {
		display: flex;
	}
}

.ig-drawer.is-open {
	transform: translateX(0);
}

.ig-drawer__header {
	align-items: center;
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	display: flex;
	justify-content: space-between;
	padding: 18px 22px;
}

.ig-drawer__title {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.18em;
}

.ig-drawer__close {
	background: var(--ig-ink);
	border: 0;
	color: var(--ig-paper);
	cursor: pointer;
	height: 40px;
	padding: 0;
	transition: background 120ms ease, color 120ms ease;
	width: 40px;
}

.ig-drawer__close svg {
	display: block;
	height: 22px;
	margin: 0 auto;
	width: 22px;
}

.ig-drawer__close:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-drawer__nav {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.ig-drawer__nav a {
	align-items: center;
	border-bottom: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-ink);
	display: flex;
	font-family: var(--ig-font-display);
	font-size: 22px;
	font-weight: 800;
	justify-content: space-between;
	letter-spacing: -0.01em;
	opacity: 0;
	padding: 22px 24px;
	text-transform: uppercase;
	transform: translateX(20px);
	transition: background 160ms ease, color 160ms ease, transform 240ms ease, opacity 240ms ease;
}

.ig-drawer.is-open .ig-drawer__nav a {
	opacity: 1;
	transform: translateX(0);
}

.ig-drawer.is-open .ig-drawer__nav a:nth-child(1) { transition-delay: 60ms; }
.ig-drawer.is-open .ig-drawer__nav a:nth-child(2) { transition-delay: 90ms; }
.ig-drawer.is-open .ig-drawer__nav a:nth-child(3) { transition-delay: 120ms; }
.ig-drawer.is-open .ig-drawer__nav a:nth-child(4) { transition-delay: 150ms; }
.ig-drawer.is-open .ig-drawer__nav a:nth-child(5) { transition-delay: 180ms; }
.ig-drawer.is-open .ig-drawer__nav a:nth-child(6) { transition-delay: 210ms; }

.ig-drawer__nav a:hover,
.ig-drawer__nav a[aria-current="page"] {
	background: var(--ig-ink);
	color: var(--ig-paper);
}

.ig-drawer__nav a[aria-current="page"] i {
	color: var(--ig-accent);
}

.ig-drawer__nav i {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 18px;
	font-style: normal;
	transition: color 160ms ease;
}

.ig-drawer__nav a small {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	display: inline-block;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	margin-left: 8px;
	padding: 2px 6px;
}

.ig-drawer__nav a small[hidden] {
	display: none;
}

.ig-drawer__context {
	border-top: var(--ig-stroke-bold) solid var(--ig-line);
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 22px 24px;
}

.ig-drawer__label {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.ig-drawer__context select {
	background: var(--ig-bone);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	border-radius: 0;
	font-family: var(--ig-font-mono);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.06em;
	min-height: 48px;
	padding: 0 14px;
	text-transform: uppercase;
	width: 100%;
}

html.ig-no-scroll,
html.ig-no-scroll body {
	overflow: hidden;
}

.ig-cart-btn:hover .ig-cart-btn__badge {
	background: var(--ig-ink);
	color: var(--ig-accent);
}

.ig-cart-btn--account.is-logged::after {
	background: var(--ig-accent);
	border: var(--ig-stroke) solid var(--ig-line);
	border-radius: 999px;
	content: "";
	height: 10px;
	position: absolute;
	right: 14px;
	top: 14px;
	width: 10px;
}

/* ==========================================================================
   Account page
   ========================================================================== */

.ig-account {
	padding-top: 0;
	padding-bottom: 96px;
}

/* ==========================================================================
   Account hero + brutalist tile nav
   ========================================================================== */

.ig-account-hero {
	align-items: start;
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	gap: 16px 24px;
	grid-template-columns: minmax(0, 1fr) auto;
	margin: 0 0 clamp(20px, 3vw, 32px);
	padding: 0 0 clamp(20px, 3vw, 32px);
}

.ig-account-hero__intro h1 {
	margin: 6px 0 0;
}

.ig-account-hero__logout {
	align-items: center;
	border: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-ink);
	display: inline-flex;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	gap: 10px;
	letter-spacing: 0.12em;
	margin-top: 8px;
	padding: 10px 14px;
	text-decoration: none;
	text-transform: uppercase;
	transition: background 140ms ease, color 140ms ease;
	white-space: nowrap;
}

.ig-account-hero__logout svg {
	height: 16px;
	width: 16px;
}

.ig-account-hero__logout:hover,
.ig-account-hero__logout:focus-visible {
	background: var(--ig-ink);
	color: var(--ig-paper);
	outline: none;
}

.ig-account-nav {
	display: grid;
	gap: 0;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 0 0 clamp(28px, 4vw, 48px);
}

.ig-account-nav__tile {
	align-items: end;
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	color: var(--ig-ink);
	display: grid;
	gap: 8px;
	grid-template-areas:
		"index    arrow"
		"name     name";
	grid-template-columns: minmax(0, 1fr) auto;
	margin: 0 -1.5px -1.5px 0;
	min-height: 110px;
	padding: 16px 18px;
	position: relative;
	text-decoration: none;
	transition: background 140ms ease, color 140ms ease, transform 140ms ease, box-shadow 140ms ease;
}

.ig-account-nav__tile::before {
	color: var(--ig-muted);
	content: attr(data-index);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	grid-area: index;
	letter-spacing: 0.12em;
	transition: color 140ms ease;
}

.ig-account-nav__name {
	display: block;
	font-family: var(--ig-font-display);
	font-size: clamp(20px, 2vw, 28px);
	font-weight: 900;
	grid-area: name;
	letter-spacing: -0.02em;
	line-height: 1;
	text-transform: uppercase;
}

.ig-account-nav__arrow {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 14px;
	grid-area: arrow;
	transition: color 140ms ease, transform 200ms ease;
}

.ig-account-nav__bolt {
	background: var(--ig-ink);
	color: var(--ig-accent);
	font-size: 13px;
	grid-area: index;
	justify-self: start;
	line-height: 1;
	padding: 4px 8px;
}

.ig-account-nav__tile:hover {
	background: var(--ig-bone, #f6f6f3);
}

.ig-account-nav__tile:hover .ig-account-nav__arrow {
	color: var(--ig-ink);
	transform: translateX(4px);
}

.ig-account-nav__tile.is-active {
	background: var(--ig-ink);
	color: var(--ig-paper);
}

.ig-account-nav__tile.is-active::before {
	color: var(--ig-accent);
}

.ig-account-nav__tile.is-active .ig-account-nav__arrow {
	color: var(--ig-accent);
}

.ig-account-nav__tile--accent {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-account-nav__tile--accent:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	transform: translate(-2px, -2px);
	box-shadow: 4px 4px 0 var(--ig-ink);
}

.ig-account-nav__tile--accent .ig-account-nav__arrow,
.ig-account-nav__tile--accent::before {
	color: var(--ig-accent-ink);
}

.ig-account-nav__tile--accent:hover .ig-account-nav__arrow {
	color: var(--ig-accent-ink);
}

@media (max-width: 880px) {
	.ig-account-hero {
		grid-template-columns: 1fr;
	}
	.ig-account-hero__logout {
		justify-self: start;
		margin-top: 0;
	}
	.ig-account-nav {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.ig-account-nav__tile--accent {
		grid-column: 1 / -1;
		min-height: 80px;
	}
	.ig-account-nav__tile {
		min-height: 92px;
	}
	.ig-account-nav__name {
		font-size: 18px;
	}
}

@media (max-width: 480px) {
	.ig-account-nav {
		grid-template-columns: 1fr;
	}
	.ig-account-nav__tile {
		min-height: 72px;
	}
}

.ig-account-grid {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ig-account-card {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	gap: 16px;
	padding: 28px;
}

.ig-account-card h2 {
	font-size: 20px;
	letter-spacing: 0;
	margin: 0;
}

.ig-account-card--wide {
	grid-column: span 2;
}

.ig-account-card form,
.ig-account-form {
	display: grid;
	gap: 16px;
}

.ig-account-card label,
.ig-account-form label {
	display: grid;
	gap: 6px;
}

.ig-account-card label > span,
.ig-account-form label > span {
	color: var(--ig-ink);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.ig-account-card input[type="text"],
.ig-account-card input[type="email"],
.ig-account-card input[type="password"],
.ig-account-card input[type="tel"],
.ig-account-form input,
.ig-account-form select {
	background: var(--ig-bone);
	border: var(--ig-stroke) solid var(--ig-line);
	border-radius: 0;
	color: var(--ig-ink);
	font-family: var(--ig-font-mono);
	font-size: 16px;
	min-height: 48px;
	padding: 0 14px;
	width: 100%;
}

.ig-account-remember {
	align-items: center;
	display: flex !important;
	flex-direction: row;
	gap: 8px !important;
}

.ig-account-remember input {
	width: auto !important;
	min-height: auto !important;
}

.ig-account-forgot {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.04em;
	text-decoration: underline;
}

.ig-account-forgot:hover {
	color: var(--ig-ink);
}

.ig-account-legal {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.04em;
	line-height: 1.5;
	margin: 0;
}

.ig-account-guest {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: 32px;
}

.ig-account-dl {
	border-top: var(--ig-stroke) solid var(--ig-line);
	display: grid;
	gap: 0;
	grid-template-columns: max-content 1fr;
	margin: 0;
}

.ig-account-dl dt,
.ig-account-dl dd {
	border-bottom: var(--ig-stroke) solid var(--ig-line);
	font-family: var(--ig-font-mono);
	font-size: 13px;
	margin: 0;
	padding: 10px 0;
}

.ig-account-dl dt {
	color: var(--ig-muted);
	font-weight: 600;
	letter-spacing: 0.04em;
	padding-right: 16px;
	text-transform: uppercase;
}

.ig-account-dl dd {
	color: var(--ig-ink);
	font-weight: 600;
}

.ig-account address {
	color: var(--ig-ink);
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-style: normal;
	line-height: 1.7;
}

@media (max-width: 880px) {
	.ig-account-grid,
	.ig-account-guest {
		grid-template-columns: 1fr;
	}
	.ig-account-card--wide {
		grid-column: span 1;
	}
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.ig-button {
	align-items: center;
	background: var(--ig-ink, #0a0a0a);
	border: var(--ig-stroke-bold, 3px) solid var(--ig-line, #0a0a0a);
	border-radius: var(--ig-radius, 0);
	color: var(--ig-paper, #ffffff);
	cursor: pointer;
	display: inline-flex;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
	gap: 8px;
	justify-content: center;
	letter-spacing: 0.08em;
	min-height: 52px;
	padding: 0 26px;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	transition: background 120ms ease, color 120ms ease, transform 80ms ease;
	-webkit-appearance: none;
	appearance: none;
	-webkit-tap-highlight-color: transparent;
}

.ig-button:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-button:active {
	transform: translate(2px, 2px);
}

.ig-button--ghost {
	background: var(--ig-paper);
	color: var(--ig-ink);
}

.ig-button--accent {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-button--accent:hover {
	background: var(--ig-ink);
	color: var(--ig-paper);
}

.ig-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 28px;
}

/* ==========================================================================
   Hero (home)
   ========================================================================== */

.ig-hero {
	--dmx-r: 232;
	--dmx-g: 255;
	--dmx-b: 0;
	--dmx-mul: 0.6;
	--dmx-shu: 1;
	--dmx-dim: 0.6;
	--dmx-raw-r: 232;
	--dmx-raw-g: 255;
	--dmx-raw-b: 0;
	background: var(--ig-paper);
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	overflow: hidden;
	position: relative;
}

.ig-hero__wash {
	background:
		radial-gradient(ellipse 60% 80% at 22% 30%, rgb(var(--dmx-r) var(--dmx-g) var(--dmx-b) / calc(0.55 * var(--dmx-intensity, 0))) 0%, transparent 70%),
		radial-gradient(ellipse 50% 70% at 80% 65%, rgb(var(--dmx-r) var(--dmx-g) var(--dmx-b) / calc(0.40 * var(--dmx-intensity, 0))) 0%, transparent 70%);
	inset: 0;
	mix-blend-mode: multiply;
	pointer-events: none;
	position: absolute;
	transition: background 90ms linear;
	z-index: 0;
}

.ig-hero__beams {
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	position: absolute;
	z-index: 0;
}

.ig-hero__beam {
	height: 110%;
	position: absolute;
	top: -10%;
	transform-origin: 50% 0%;
}

.ig-hero__beam > span {
	background: linear-gradient(180deg,
		rgb(var(--dmx-r) var(--dmx-g) var(--dmx-b)) 0%,
		rgb(var(--dmx-r) var(--dmx-g) var(--dmx-b) / 0) 85%);
	display: block;
	filter:
		blur(8px)
		drop-shadow(0 0 10px rgba(232, 255, 0, calc(0.55 * var(--dmx-intensity, 0))))
		drop-shadow(0 0 24px rgba(232, 255, 0, calc(0.30 * var(--dmx-intensity, 0))));
	height: 100%;
	opacity: calc(0.78 * var(--dmx-intensity, 0));
	transform-origin: 50% 0%;
	transition: opacity 90ms linear, background 90ms linear;
	width: 100%;
}

.ig-hero__beam:nth-child(1) { left: 12%;  width: 180px; }
.ig-hero__beam:nth-child(2) { left: 38%;  width: 140px; }
.ig-hero__beam:nth-child(3) { right: 14%; width: 220px; }

.ig-hero[data-dmx-stage] .ig-hero__beam        { transform: rotate(8deg); }
.ig-hero[data-dmx-stage] .ig-hero__beam:nth-child(2) { transform: rotate(-6deg); }
.ig-hero[data-dmx-stage] .ig-hero__beam:nth-child(3) { transform: rotate(10deg); }

.ig-hero[data-dmx-stage].is-panning .ig-hero__beam {
	animation: ig-pan var(--dmx-pan-period, 4s) ease-in-out infinite alternate;
}
.ig-hero[data-dmx-stage].is-panning .ig-hero__beam:nth-child(2) {
	animation-delay: calc(var(--dmx-pan-period, 4s) * -0.33);
}
.ig-hero[data-dmx-stage].is-panning .ig-hero__beam:nth-child(3) {
	animation-delay: calc(var(--dmx-pan-period, 4s) * -0.66);
}

.ig-hero[data-dmx-stage].is-tilting .ig-hero__beam > span {
	animation: ig-tilt var(--dmx-tilt-period, 4s) ease-in-out infinite alternate;
}
.ig-hero[data-dmx-stage].is-tilting .ig-hero__beam:nth-child(2) > span {
	animation-delay: calc(var(--dmx-tilt-period, 4s) * -0.5);
}
.ig-hero[data-dmx-stage].is-tilting .ig-hero__beam:nth-child(3) > span {
	animation-delay: calc(var(--dmx-tilt-period, 4s) * -0.25);
}

@keyframes ig-pan {
	0%   { transform: rotate(-35deg); }
	100% { transform: rotate(35deg); }
}

@keyframes ig-tilt {
	0%   { transform: rotate(-14deg) scaleY(0.55); }
	100% { transform: rotate(14deg)  scaleY(1.20); }
}

@media (prefers-reduced-motion: reduce) {
	.ig-hero[data-dmx-stage].is-panning .ig-hero__beam,
	.ig-hero[data-dmx-stage].is-tilting .ig-hero__beam > span {
		animation: none;
	}
}

.ig-hero__content {
	align-items: start;
	display: grid;
	column-gap: clamp(32px, 4vw, 64px);
	row-gap: 0;
	grid-template-columns: minmax(0, 1fr) 380px;
	grid-template-rows: auto auto;
	overflow: hidden;
	padding-top: clamp(48px, 7vw, 120px);
	padding-bottom: clamp(40px, 5vw, 80px);
	position: relative;
	z-index: 1;
}

.ig-hero__text {
	min-width: 0;
}

.ig-hero__content > .ig-hero__split {
	grid-column: 1 / -1;
	grid-row: 2;
}

.ig-hero[data-dmx-stage].is-blackout .ig-hero__wash,
.ig-hero[data-dmx-stage].is-blackout .ig-hero__beams {
	opacity: 0;
}

.ig-hero[data-dmx-stage].is-strobing .ig-hero__wash,
.ig-hero[data-dmx-stage].is-strobing .ig-hero__beams {
	animation: ig-strobe var(--dmx-strobe-period, 200ms) linear infinite;
}

@keyframes ig-strobe {
	0%, 39%   { opacity: 1; }
	40%, 100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.ig-hero[data-dmx-stage].is-strobing .ig-hero__wash,
	.ig-hero[data-dmx-stage].is-strobing .ig-hero__beams {
		animation: none;
		opacity: 0.6;
	}
}

.ig-hero__text > .ig-eyebrow {
	margin-bottom: clamp(20px, 3vw, 40px);
}

.ig-hero__headline {
	font-size: clamp(56px, 13vw, 200px);
	letter-spacing: -0.04em;
	line-height: 0.86;
	margin: 0 0 clamp(28px, 4vw, 48px);
	text-transform: uppercase;
}

.ig-hero__headline mark {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	padding: 0 0.06em;
	white-space: nowrap;
}

.ig-hero__split {
	align-items: end;
	display: grid;
	gap: 32px 48px;
	grid-template-columns: minmax(0, 1.2fr) auto;
}

.ig-hero__lead {
	font-family: var(--ig-font-display);
	font-size: clamp(18px, 1.6vw, 24px);
	font-weight: 500;
	line-height: 1.35;
	margin: 0;
	max-width: 52ch;
}

.ig-hero__split .ig-actions {
	margin: 0;
}

.ig-hero__stats {
	border-top: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 1;
}

.ig-hero__stats > div {
	background: var(--ig-paper);
	border-right: var(--ig-stroke) solid var(--ig-line);
	padding: clamp(20px, 2.5vw, 32px) clamp(20px, 2.5vw, 36px);
	position: relative;
	transition: background 200ms ease, color 200ms ease;
}

.ig-hero__stats > div:last-child {
	border-right: 0;
}

.ig-hero__stats > div:hover {
	background: var(--ig-ink);
	color: var(--ig-paper);
}

.ig-hero__stats > div:hover dd {
	color: var(--ig-accent);
}

.ig-hero__stats > div:nth-child(1)::before,
.ig-hero__stats > div:nth-child(2)::before,
.ig-hero__stats > div:nth-child(3)::before,
.ig-hero__stats > div:nth-child(4)::before {
	color: var(--ig-muted);
	content: attr(data-i);
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: 0.1em;
	position: absolute;
	right: 14px;
	top: 12px;
}

.ig-hero__stats > div:nth-child(1) { counter-reset: stat 1; }
.ig-hero__stats > div:nth-child(1)::before { content: "01"; }
.ig-hero__stats > div:nth-child(2)::before { content: "02"; }
.ig-hero__stats > div:nth-child(3)::before { content: "03"; }
.ig-hero__stats > div:nth-child(4)::before { content: "04"; }

.ig-hero__stats dt {
	display: block;
	font-family: var(--ig-font-display);
	font-size: clamp(36px, 5vw, 72px);
	font-weight: 900;
	letter-spacing: -0.04em;
	line-height: 0.95;
	margin: 0 0 6px;
}

.ig-hero__stats dt span {
	color: var(--ig-accent);
	font-size: 0.55em;
	font-weight: 800;
	margin-left: 2px;
	vertical-align: super;
}

.ig-hero__stats > div:hover dt span {
	color: var(--ig-accent);
}

.ig-hero__stats dd {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.1em;
	margin: 0;
	text-transform: uppercase;
}

/* ==========================================================================
   PARTY MODE — stage equipment (hidden by default, visible when hero has
   .is-party-mode). Colors invert (white→black bg, black→white text), action
   buttons collapse to PARTY only, line-array/blinders/side stacks fade in.
   ========================================================================== */

.ig-hero { transition: background-color 600ms ease, color 600ms ease; }

.ig-hero__stage {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: 0;
	transform: scale(0.96);
	transition: opacity 600ms ease, transform 600ms ease;
	z-index: 0;
	overflow: hidden;            /* containment — children can never extend the hero */
}
/* In party mode, raise above content so the cabinets and stage actually read.
   pointer-events stays none so the DMX/DJ panel under it is still clickable. */
.ig-hero.is-party-mode .ig-hero__stage {
	z-index: 3;
}
/* But the DMX / DJ panel must always sit on top of everything when party
   mode is engaged — otherwise the stage equipment covers the controls. */
.ig-hero.is-party-mode .ig-dmx {
	z-index: 40;
}
/* Stats row sits outside the stage container — stays visible in party mode. */
.ig-hero.is-party-mode .ig-hero__stage {
	opacity: 1;
	transform: scale(1);
}

/* Truss — full-width horizontal beam at the top with PAR lamps mounted on
   it and 5 line array clusters hanging below. Mimics a festival upstage
   front-truss configuration. */
.ig-hero__truss {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 130px;
	pointer-events: none;
}
.ig-hero__truss-bar {
	position: absolute;
	top: 4px;
	left: 3%;
	right: 3%;
	height: 9px;
	background:
		linear-gradient(180deg, #555 0%, #2a2a2a 50%, #1a1a1a 100%),
		repeating-linear-gradient(90deg, transparent 0 14px, rgba(0,0,0,0.4) 14px 16px);
	border-top: 1px solid #777;
	border-bottom: 1px solid #0a0a0a;
	box-shadow: 0 2px 6px rgba(0,0,0,0.8), 0 0 0 1px #050505;
}
/* PAR lamp row — 8 cans mounted under the truss bar between the two blinder
   clusters. Default = unlit (MH mode). Reactive to DMX color only in PAR mode. */
.ig-hero__pars {
	position: absolute;
	top: 16px;
	left: 20%;
	right: 20%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.ig-hero__pars i {
	display: block;
	width: 22px;
	height: 26px;
	background:
		radial-gradient(ellipse 110% 70% at 50% 100%,
			rgb(var(--par-r, 0) var(--par-g, 0) var(--par-b, 0) / calc(1.0 * var(--par-intensity, 0))) 0%,
			rgb(var(--par-r, 0) var(--par-g, 0) var(--par-b, 0) / calc(0.55 * var(--par-intensity, 0))) 55%,
			transparent 90%),
		linear-gradient(180deg, #2a2a2a 0%, #0a0a0a 100%);
	border: 1.5px solid #1a1a1a;
	border-top: 2.5px solid #3a3a3a;
	border-radius: 2px 2px 50% 50% / 2px 2px 12px 12px;
	box-shadow:
		0 0 0 1px #050505,
		0 1px 0 rgba(255,255,255,0.06) inset,
		/* close cone — bright core right under the can */
		0 calc(14px + 18px * var(--par-intensity, 0)) calc(20px + 44px * var(--par-intensity, 0))
			calc(2px + 4px * var(--par-intensity, 0))
			rgb(var(--par-r, 0) var(--par-g, 0) var(--par-b, 0) / calc(0.90 * var(--par-intensity, 0))),
		/* mid cone — broader halo halfway down */
		0 calc(34px + 36px * var(--par-intensity, 0)) calc(46px + 80px * var(--par-intensity, 0))
			calc(4px + 8px * var(--par-intensity, 0))
			rgb(var(--par-r, 0) var(--par-g, 0) var(--par-b, 0) / calc(0.60 * var(--par-intensity, 0))),
		/* far atmospheric — diffuse wash reaching toward stage floor */
		0 calc(68px + 72px * var(--par-intensity, 0)) calc(90px + 160px * var(--par-intensity, 0))
			calc(6px + 12px * var(--par-intensity, 0))
			rgb(var(--par-r, 0) var(--par-g, 0) var(--par-b, 0) / calc(0.35 * var(--par-intensity, 0)));
	transition: box-shadow 90ms linear, background 90ms linear;
}
/* PAR strobe + blackout (driven by the PAR fixture's own SHU channel) */
.ig-hero.is-par-strobing .ig-hero__pars i {
	animation: ig-par-strobe var(--par-strobe-period, 200ms) steps(2) infinite;
}
.ig-hero.is-par-blackout .ig-hero__pars i {
	background: linear-gradient(180deg, #2a2a2a 0%, #0a0a0a 100%);
	box-shadow: 0 0 0 1px #050505, 0 1px 0 rgba(255,255,255,0.06) inset;
}
@keyframes ig-par-strobe {
	0%, 49%   { filter: brightness(0.25); }
	50%, 100% { filter: brightness(1.2); }
}

/* PAR effect channel — driven by PAR fixture's PAN slider value. The JS adds
   one of these classes to .ig-hero and sets --par-fx-speed for the duration. */

/* CHASE — sequential left → right running light */
.ig-hero.is-par-fx-chase .ig-hero__pars i {
	animation: ig-par-fx-chase var(--par-fx-speed, 0.7s) linear infinite;
}
.ig-hero.is-par-fx-chase .ig-hero__pars i:nth-child(1) { animation-delay: 0.000s; }
.ig-hero.is-par-fx-chase .ig-hero__pars i:nth-child(2) { animation-delay: -0.087s; }
.ig-hero.is-par-fx-chase .ig-hero__pars i:nth-child(3) { animation-delay: -0.174s; }
.ig-hero.is-par-fx-chase .ig-hero__pars i:nth-child(4) { animation-delay: -0.261s; }
.ig-hero.is-par-fx-chase .ig-hero__pars i:nth-child(5) { animation-delay: -0.348s; }
.ig-hero.is-par-fx-chase .ig-hero__pars i:nth-child(6) { animation-delay: -0.435s; }
.ig-hero.is-par-fx-chase .ig-hero__pars i:nth-child(7) { animation-delay: -0.522s; }
.ig-hero.is-par-fx-chase .ig-hero__pars i:nth-child(8) { animation-delay: -0.609s; }
@keyframes ig-par-fx-chase {
	0%, 75%, 100% { filter: brightness(0.18); }
	8%, 18%       { filter: brightness(1.7); }
}

/* RANDOM — each lamp flashes on its own irregular schedule (prime-ish ratios). */
.ig-hero.is-par-fx-random .ig-hero__pars i {
	animation: ig-par-fx-random var(--par-fx-speed, 0.4s) steps(1, end) infinite;
}
.ig-hero.is-par-fx-random .ig-hero__pars i:nth-child(1) { animation-duration: calc(var(--par-fx-speed, 0.4s) * 1.00); animation-delay: 0.07s; }
.ig-hero.is-par-fx-random .ig-hero__pars i:nth-child(2) { animation-duration: calc(var(--par-fx-speed, 0.4s) * 1.37); animation-delay: 0.13s; }
.ig-hero.is-par-fx-random .ig-hero__pars i:nth-child(3) { animation-duration: calc(var(--par-fx-speed, 0.4s) * 0.83); animation-delay: 0.21s; }
.ig-hero.is-par-fx-random .ig-hero__pars i:nth-child(4) { animation-duration: calc(var(--par-fx-speed, 0.4s) * 1.51); animation-delay: 0.05s; }
.ig-hero.is-par-fx-random .ig-hero__pars i:nth-child(5) { animation-duration: calc(var(--par-fx-speed, 0.4s) * 1.13); animation-delay: 0.19s; }
.ig-hero.is-par-fx-random .ig-hero__pars i:nth-child(6) { animation-duration: calc(var(--par-fx-speed, 0.4s) * 0.97); animation-delay: 0.11s; }
.ig-hero.is-par-fx-random .ig-hero__pars i:nth-child(7) { animation-duration: calc(var(--par-fx-speed, 0.4s) * 1.69); animation-delay: 0.23s; }
.ig-hero.is-par-fx-random .ig-hero__pars i:nth-child(8) { animation-duration: calc(var(--par-fx-speed, 0.4s) * 0.71); animation-delay: 0.17s; }
@keyframes ig-par-fx-random {
	0%, 55%   { filter: brightness(0.15); }
	60%, 72%  { filter: brightness(1.9); }
	75%, 100% { filter: brightness(0.15); }
}

/* MULTI — each lamp gets its own fixed color, synchronized fast blink. The
   per-lamp --par-r/g/b overrides defeat the global PAR color so each lamp
   stays its own hue regardless of the RGB sliders. */
.ig-hero.is-par-fx-multi .ig-hero__pars i {
	animation: ig-par-fx-multi var(--par-fx-speed, 0.4s) ease-in-out infinite;
}
.ig-hero.is-par-fx-multi .ig-hero__pars i:nth-child(1) { --par-r: 255; --par-g:   0; --par-b:   0; --par-intensity: 1; }
.ig-hero.is-par-fx-multi .ig-hero__pars i:nth-child(2) { --par-r: 255; --par-g: 140; --par-b:   0; --par-intensity: 1; }
.ig-hero.is-par-fx-multi .ig-hero__pars i:nth-child(3) { --par-r: 255; --par-g: 240; --par-b:   0; --par-intensity: 1; }
.ig-hero.is-par-fx-multi .ig-hero__pars i:nth-child(4) { --par-r:  20; --par-g: 255; --par-b:  20; --par-intensity: 1; }
.ig-hero.is-par-fx-multi .ig-hero__pars i:nth-child(5) { --par-r:   0; --par-g: 230; --par-b: 255; --par-intensity: 1; }
.ig-hero.is-par-fx-multi .ig-hero__pars i:nth-child(6) { --par-r:  40; --par-g:  80; --par-b: 255; --par-intensity: 1; }
.ig-hero.is-par-fx-multi .ig-hero__pars i:nth-child(7) { --par-r: 180; --par-g:  40; --par-b: 255; --par-intensity: 1; }
.ig-hero.is-par-fx-multi .ig-hero__pars i:nth-child(8) { --par-r: 255; --par-g:  40; --par-b: 200; --par-intensity: 1; }
.ig-hero.is-par-fx-multi .ig-hero__pars i:nth-child(even) { animation-delay: calc(var(--par-fx-speed, 0.4s) * -0.5); }
@keyframes ig-par-fx-multi {
	0%, 100% { filter: brightness(1.0); }
	50%      { filter: brightness(0.25); }
}
/* Hanging line array — 5 of them at distributed positions across the truss. */
.ig-hero__line-array {
	position: absolute;
	top: 80px;                          /* below the truss bar + blinders + PAR row */
	display: flex;
	flex-direction: column;
	gap: 1.5px;
	transform-origin: 50% 0;
	animation: ig-rig-sway 6s ease-in-out infinite alternate;
}
.ig-hero__line-array::before {
	content: "";
	position: absolute;
	top: -4px; left: 50%;
	width: 1.5px; height: 4px;
	background: #555;
	transform: translateX(-50%);
}
.ig-hero__line-array--1 { left: 16%; animation-delay:    0s; }
.ig-hero__line-array--2 { left: 32%; animation-delay: -1.2s; }
.ig-hero__line-array--3 { left: 48%; animation-delay: -2.4s; }
.ig-hero__line-array--4 { left: 64%; animation-delay: -3.6s; }
.ig-hero__line-array--5 { left: 80%; animation-delay: -4.8s; }
.ig-hero__line-array i {
	display: block;
	width: 54px;
	height: 16px;
	background:
		linear-gradient(180deg, #2a2a2a 0%, #0a0a0a 100%);
	border: 1.25px solid #2a2a2a;
	box-shadow:
		0 1px 0 rgba(255,255,255,0.06) inset,
		0 -1px 0 #000 inset,
		0 2px 0 #000;
	position: relative;
}
.ig-hero__line-array i::before,
.ig-hero__line-array i::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 9px; height: 9px;
	border-radius: 50%;
	background:
		radial-gradient(circle at 35% 30%, #3a3a3a 0%, #0a0a0a 70%),
		#0a0a0a;
	border: 1px solid #1a1a1a;
	transform: translateY(-50%);
}
.ig-hero__line-array i::before { left: 7px; }
.ig-hero__line-array i::after  { right: 7px; }
@keyframes ig-rig-sway {
	from { transform: rotate(-1.4deg); }
	to   { transform: rotate( 1.4deg); }
}

/* Blinders — row of warm-white lamps mounted on a truss above the stage.
   Pulse in syncopated rhythm. BLN button on the DMX panel can fire them
   to full-bright strobe. */
/* Blinder clusters — two of them, mounted at the two edges of the truss,
   each a 2-wide × 4-tall grid hanging below the truss bar. */
.ig-hero__blinders {
	position: absolute;
	top: 16px;
	display: grid;
	grid-template-columns: 26px 26px;
	grid-auto-rows: 16px;
	gap: 3px;
	padding: 5px;
	background: linear-gradient(180deg, #1a1a1a, #050505);
	border: 1.5px solid #2a2a2a;
	border-radius: 0 0 3px 3px;
	box-shadow: 0 3px 0 #000, 0 0 0 1.5px #000 inset;
}
.ig-hero__blinders--left  { left:  3.5%; }
.ig-hero__blinders--right { right: 3.5%; }
.ig-hero__blinders::before {
	/* short bracket onto the truss bar above */
	content: "";
	position: absolute;
	top: -5px;
	left: 16px; right: 16px;
	height: 5px;
	background: linear-gradient(180deg, #555 0%, #2a2a2a 100%);
	border: 1px solid #0a0a0a;
	border-bottom: 0;
}
.ig-hero__blinders i {
	display: block;
	width: 100%;
	height: 100%;
	background: #2a2010;                       /* dark amber — lamp off */
	border-radius: 3px;
	box-shadow: 0 0 0 1px #1a1408 inset, 0 1px 1px rgba(0,0,0,0.5);
	opacity: 0.85;
}

/* BLN-button-held fire state: every blinder goes full-bright WHITE strobe,
   with a brief hero-wide flash overlay for impact. */
.ig-hero.is-blinder-firing .ig-hero__blinders i {
	animation: ig-blinder-fire 100ms steps(2) infinite;
	background: #ffffff;
}
@keyframes ig-blinder-fire {
	0%, 49%   { opacity: 0.2; box-shadow: 0 0 6px #fff; }
	50%, 100% { opacity: 1;   box-shadow: 0 0 25px #ffffff, 0 0 60px rgba(255,255,255,0.95), 0 0 100px rgba(255,255,255,0.7); }
}
.ig-hero.is-blinder-firing::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(255,255,255,0.18);
	pointer-events: none;
	z-index: 2;
	animation: ig-bln-flash 100ms steps(2) infinite;
}
@keyframes ig-bln-flash {
	0%, 49%   { opacity: 0; }
	50%, 100% { opacity: 1; }
}

/* Side speaker stacks — much bigger so they read against the dark backdrop.
   Sub + mid + top + LED indicators + brand label. */
.ig-hero__stack {
	position: absolute;
	bottom: 4%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
}
.ig-hero__stack--left  { left:  1.5%; }
.ig-hero__stack--right { right: 1.5%; }
.ig-hero__stack i {
	background:
		linear-gradient(180deg, #2a2a2a 0%, #0a0a0a 100%);
	border: 1.5px solid #3a3a3a;
	box-shadow:
		0 1px 0 rgba(255,255,255,0.08) inset,
		0 -1px 0 #000 inset,
		0 4px 0 #000,
		0 6px 14px rgba(0,0,0,0.7);
	position: relative;
}
/* Tiny power-on LED — only on top + mid cabinets. The sub cabinet's ::after
   is needed for its INVGROUP brand plate (would be hijacked by this rule
   otherwise because of specificity). */
.ig-hero__stack-top::after,
.ig-hero__stack-mid::after {
	content: "";
	position: absolute;
	top: 4px; right: 4px;
	width: 4px; height: 4px;
	border-radius: 50%;
	background: #4dff7a;
	box-shadow: 0 0 4px #4dff7a, 0 0 8px rgba(77,255,122,0.7);
}
/* TOP — small line-array-style box */
.ig-hero__stack-top {
	width: 96px;
	height: 44px;
}
.ig-hero__stack-top::before {
	content: "INVGROUP";
	position: absolute;
	left: 0; right: 0;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
	font-family: var(--ig-font-display, var(--ig-font-mono));
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.20em;
	color: #ffd060;
	opacity: 0.95;
	text-shadow: 0 0 4px rgba(255,208,96,0.45);
}
/* MID — mid-range horn cabinet */
.ig-hero__stack-mid {
	width: 116px;
	height: 70px;
}
.ig-hero__stack-mid::before {
	content: "";
	position: absolute;
	inset: 10px 16px;
	background:
		radial-gradient(circle at 30% 30%, #3a3a3a 0%, #0a0a0a 70%),
		linear-gradient(180deg, #2a2a2a, #0a0a0a);
	border-radius: 5px;
	border: 1.5px solid #1a1a1a;
	box-shadow: 0 0 4px #000 inset;
}
/* SUB — taller bass cabinet with brushed-metal texture, big driver up top,
   a recessed reflex port band in the middle, and a polished INVGROUP brand
   plate filling the bottom face. */
.ig-hero__stack-sub {
	width: 156px;
	height: 210px;
	background:
		repeating-linear-gradient(180deg, transparent 0 2px, rgba(255,255,255,0.02) 2px 3px),
		linear-gradient(180deg, transparent 0 112px, rgba(0,0,0,0.85) 114px 132px, transparent 134px),
		linear-gradient(180deg, #2e2e2e 0%, #181818 32%, #050505 100%);
	border: 1.5px solid #3a3a3a;
	border-top: 3px solid #4a4a4a;
	border-bottom: 3px solid #050505;
	box-shadow:
		0 1px 0 rgba(255,255,255,0.10) inset,
		0 -2px 0 rgba(0,0,0,0.85) inset,
		0 5px 0 #000,
		0 8px 20px rgba(0,0,0,0.8);
	padding: 0;
}
.ig-hero__stack-sub::before {
	/* Big driver cone — sits in the upper third */
	content: "";
	position: absolute;
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
	width: 96px;
	height: 96px;
	border-radius: 50%;
	background:
		radial-gradient(circle at 36% 30%, #5a5a5a 0%, #1a1a1a 55%, #050505 100%),
		#050505;
	border: 3px solid #1f1f1f;
	box-shadow:
		0 0 0 1px #2a2a2a inset,
		0 0 8px #000 inset,
		0 0 0 2px #3a3a3a,
		0 3px 6px rgba(0,0,0,0.9);
}
.ig-hero__stack-sub::after {
	/* INVGROUP brand plate — spans the bottom face */
	content: "INVGROUP";
	position: absolute;
	left: 8px;
	right: 8px;
	bottom: 12px;
	padding: 9px 2px;
	text-align: center;
	font-family: var(--ig-font-display, sans-serif);
	font-size: 14px;
	font-weight: 900;
	letter-spacing: 0.14em;
	color: #7a7a7a;
	background: linear-gradient(180deg, #050505 0%, #1c1c1c 50%, #050505 100%);
	border: 1px solid #050505;
	border-radius: 2px;
	text-shadow: 0 1px 0 #000, 0 -1px 0 rgba(255,255,255,0.07);
	box-shadow:
		0 0 0 1px #2a2a2a inset,
		0 1px 0 rgba(255,255,255,0.06) inset,
		0 -1px 0 rgba(0,0,0,0.6) inset;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: clip;
}
.ig-hero.is-party-mode .ig-hero__stack-sub {
	animation: ig-stack-pump 0.5s ease-in-out infinite;
}
.ig-hero.is-party-mode .ig-hero__stack-sub::before {
	animation: ig-cone-pump 0.5s ease-in-out infinite;
}
/* Keyframes preserve the translateX(-50%) base centering by including it in
   every step — otherwise the scale transform replaces it and the cone slips. */
@keyframes ig-stack-pump {
	0%, 100% { transform: scaleY(1)     translateY(0); }
	50%      { transform: scaleY(1.025) translateY(-2px); }
}
@keyframes ig-cone-pump {
	0%, 100% { transform: translateX(-50%) scale(1); }
	50%      { transform: translateX(-50%) scale(0.95); }
}

/* Stage floor — a proper platform with depth perspective + warm light strip.
   The ::before is the floor plate; the ::after is the edge light. */
.ig-hero__stage-floor {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 48px;
	pointer-events: none;
}
.ig-hero__stage-floor::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, transparent 0%, rgba(30,20,5,0.7) 25%, rgba(60,40,10,0.92) 100%),
		repeating-linear-gradient(90deg, transparent 0 40px, rgba(255,206,77,0.06) 40px 41px);
	border-top: 2px solid rgba(255,206,77,0.35);
}
.ig-hero__stage-floor::after {
	content: "";
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 5px;
	background: linear-gradient(90deg, transparent 0%, #ffce4d 25%, #ffe48a 50%, #ffce4d 75%, transparent 100%);
	box-shadow: 0 0 30px rgba(255,206,77,0.9), 0 0 60px rgba(255,206,77,0.45);
}

/* DJ silhouette — head + shoulders, standing on the stage floor.
   Positioned in front of the stage but DJ panel still on top via its z-index.
   On the user's viewport: only head visible above panel (DJ behind console). */
.ig-hero__dj {
	position: absolute;
	left: 50%;
	bottom: 48px;                          /* sits on top of the stage floor */
	transform: translateX(-50%);
	width: 140px;
	height: 220px;
	pointer-events: none;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.ig-hero__dj-torso {
	width: 130px;
	height: 130px;
	margin-top: -6px;
	background:
		radial-gradient(ellipse 70% 50% at 50% 0%, #1a1a1a 0%, #050505 80%),
		linear-gradient(180deg, #0a0a0a 0%, #1a1a1a 100%);
	clip-path: polygon(28% 0, 72% 0, 100% 100%, 0 100%);
	box-shadow: 0 0 0 1px #1a1a1a, 0 -4px 14px rgba(0,0,0,0.8);
	order: 3;
}
.ig-hero__dj-neck {
	width: 22px;
	height: 12px;
	background: linear-gradient(180deg, #1a1a1a 0%, #050505 100%);
	order: 2;
	margin-top: -2px;
	box-shadow: 0 0 0 1px #1a1a1a;
}
.ig-hero__dj-head {
	width: 56px;
	height: 64px;
	background:
		radial-gradient(ellipse 60% 50% at 50% 35%, #2a2a2a 0%, #0a0a0a 100%);
	border-radius: 48% 48% 42% 42%;
	box-shadow: 0 0 0 1.5px #1a1a1a, 0 4px 10px rgba(0,0,0,0.8);
	order: 1;
	position: relative;
}
.ig-hero__dj-headphones {
	position: absolute;
	top: 6px;
	left: 50%;
	transform: translateX(-50%);
	width: 78px;
	height: 28px;
	order: 0;
	z-index: 1;
	pointer-events: none;
}
.ig-hero__dj-headphones::before {
	/* arch over the head */
	content: "";
	position: absolute;
	inset: 0;
	border: 4px solid #2a2a2a;
	border-bottom: 0;
	border-radius: 50% 50% 0 0;
	box-shadow: 0 0 0 1px #050505, 0 0 0 1.5px #1a1a1a inset;
}
.ig-hero__dj-cup {
	position: absolute;
	bottom: -4px;
	width: 16px;
	height: 22px;
	background: linear-gradient(180deg, #3a3a3a 0%, #050505 100%);
	border: 1.5px solid #050505;
	border-radius: 5px;
	box-shadow: 0 0 0 1px #1a1a1a inset, 0 2px 4px rgba(0,0,0,0.7);
}
.ig-hero__dj-cup--l { left: -2px; }
.ig-hero__dj-cup--r { right: -2px; }
.ig-hero__dj-cup::after {
	/* tiny accent LED on each cup */
	content: "";
	position: absolute;
	top: 6px; left: 50%;
	transform: translateX(-50%);
	width: 3px; height: 3px;
	border-radius: 50%;
	background: var(--ig-accent);
	box-shadow: 0 0 4px var(--ig-accent);
}

/* Speaker stack accents — bright LED strip on top + bottom edges so the
   cabinets pop out from the black backdrop even when partially behind the
   DJ panel. Only enabled in party mode (avoids work outside the scene). */
.ig-hero.is-party-mode .ig-hero__stack i {
	box-shadow:
		0 1px 0 rgba(255,255,255,0.08) inset,
		0 -1px 0 #000 inset,
		0 4px 0 #000,
		0 6px 14px rgba(0,0,0,0.7),
		0 -2px 0 0 rgba(255,206,77,0.35),    /* warm top trim */
		0 12px 18px rgba(255,206,77,0.12);    /* warm under-glow toward floor */
}

/* ===== Color flip when party mode is on ===== */
.ig-hero.is-party-mode {
	background: #050505;
	color: #f0f0f0;
}
.ig-hero.is-party-mode .ig-hero__wash {
	background: radial-gradient(ellipse at 50% 40%, rgba(232,255,0,0.08) 0%, transparent 60%);
}
.ig-hero.is-party-mode .ig-hero__headline { color: #ffffff; }
.ig-hero.is-party-mode .ig-hero__headline mark { background: var(--ig-accent); color: #000; }
.ig-hero.is-party-mode .ig-hero__lead { color: #c0c0c0; }
/* Stats row stays in its original light-on-white look in party mode — it lives
   outside the stage scene and shouldn't be tinted by the dark inversion. */
.ig-hero.is-party-mode .ig-hero__stats        { color: var(--ig-ink); }
.ig-hero.is-party-mode .ig-hero__stats dt,
.ig-hero.is-party-mode .ig-hero__stats dd     { color: var(--ig-ink); }
.ig-hero.is-party-mode .ig-hero__stats > div  { background: var(--ig-paper); border-color: var(--ig-line); }
.ig-hero.is-party-mode .ig-hero__stats > div:hover        { background: var(--ig-ink); color: var(--ig-paper); }
.ig-hero.is-party-mode .ig-hero__stats > div:hover dd     { color: var(--ig-accent); }
.ig-hero.is-party-mode .ig-button--ghost {
	color: #ffffff;
	border-color: #ffffff;
}
.ig-hero.is-party-mode .ig-button--ghost:hover {
	background: #ffffff;
	color: #000000;
}

/* Hide regular action buttons in party mode — PARTY button morphs into the
   only call-to-action. */
.ig-hero.is-party-mode .ig-actions > a {
	opacity: 0;
	transform: translateY(-4px);
	pointer-events: none;
	transition: opacity 300ms, transform 300ms;
}
.ig-actions > a { transition: opacity 400ms, transform 400ms; }

/* PARTY button — fixed to the right edge of the viewport, only visible while
   the hero is in view (controlled by IntersectionObserver in JS adding the
   .is-in-view class). Slides in from the right when hero enters viewport. */
.ig-button--party {
	position: fixed;
	right: 0;
	top: 38vh;
	z-index: 60;
	background: linear-gradient(135deg, #ff3da5 0%, #ff7e1b 50%, #ffe23a 100%);
	color: #0a0a0a;
	border: 2px solid #0a0a0a;
	border-right: 0;
	border-radius: 6px 0 0 6px;
	font-family: var(--ig-font-display, var(--ig-font-mono));
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 14px 18px;
	cursor: pointer;
	overflow: hidden;
	box-shadow: -4px 4px 0 rgba(0,0,0,0.6), -8px 0 22px rgba(255,61,165,0.35);
	/* Hidden by default — slides in from the right when hero is visible. */
	opacity: 0;
	transform: translateX(110%);
	pointer-events: none;
	transition: opacity 280ms ease, transform 320ms cubic-bezier(0.2, 0.8, 0.3, 1), background 200ms;
}
.ig-button--party.is-in-view {
	opacity: 1;
	transform: translateX(0);
	pointer-events: auto;
}
.ig-button--party:hover {
	transform: translateX(-2px);
	box-shadow: -6px 4px 0 rgba(0,0,0,0.7), -12px 0 28px rgba(255,61,165,0.55);
}
.ig-button--party::after {
	/* shimmer sweep across the face */
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,0.4) 50%, transparent 70%);
	transform: translateX(-100%);
	animation: ig-party-shimmer 3.4s ease-in-out infinite;
	pointer-events: none;
}
@keyframes ig-party-shimmer {
	0%, 60% { transform: translateX(-100%); }
	80%     { transform: translateX(100%); }
	100%    { transform: translateX(100%); }
}
.ig-button__party-label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
}
.ig-button__party-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.ig-button__party-icon svg { width: 16px; height: 16px; display: block; }
.ig-button__party-label--on  { display: none; }
.is-party-mode .ig-button--party {
	background: var(--ig-accent);
	color: #0a0a0a;
}
.is-party-mode .ig-button__party-label--off { display: none; }
.is-party-mode .ig-button__party-label--on  { display: inline-flex; }

/* Hide the sticky party button on mobile — the hero panel is hidden too;
   "party mode" with no DMX/DJ to drive it isn't meaningful at that size. */
@media (max-width: 880px) {
	.ig-button--party { display: none; }
}

/* Hide stage equipment on mobile where the hero is narrow — keeps the
   color flip + button toggle, but no half-cut speaker silhouettes. */
@media (max-width: 880px) {
	.ig-hero__stage { display: none; }
}

/* ==========================================================================
   DMX console (hero left)
   ========================================================================== */

.ig-dmx {
	align-self: center;
	justify-self: center;
	margin: 0;
	max-width: 380px;
	position: relative;
	width: 100%;
	z-index: 2;
}

.ig-dmx__panel {
	background:
		linear-gradient(180deg, #2a2a2a 0%, #161616 18%, #0d0d0d 70%, #1a1a1a 100%);
	border: 2px solid #0a0a0a;
	border-radius: 4px;
	box-shadow:
		0 0 0 1px #3a3a3a inset,
		0 2px 0 #060606 inset,
		8px 8px 0 rgba(10,10,10,0.85);
	color: #f0f0f0;
	padding: 14px 16px 18px;
	position: relative;
}

.ig-dmx__panel::before {
	background:
		repeating-linear-gradient(90deg, rgba(255,255,255,0.04) 0 1px, transparent 1px 4px),
		repeating-linear-gradient(0deg, rgba(0,0,0,0.25) 0 1px, transparent 1px 3px);
	border-radius: 4px;
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
}

.ig-dmx__head {
	align-items: center;
	border-bottom: 1px solid #2a2a2a;
	display: flex;
	gap: 8px;
	margin-bottom: 10px;
	padding-bottom: 8px;
	position: relative;
}

.ig-dmx__brand {
	color: #f5f5f5;
	font-family: var(--ig-font-display);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.18em;
}

.ig-dmx__model {
	color: #888;
	flex: 1;
	font-family: var(--ig-font-mono);
	font-size: 9px;
	letter-spacing: 0.12em;
}

.ig-dmx__power {
	background: #E8FF00;
	border-radius: 999px;
	box-shadow: 0 0 6px #E8FF00, 0 0 12px rgba(232,255,0,0.6);
	display: block;
	height: 8px;
	width: 8px;
}

.ig-dmx__blk {
	background: linear-gradient(180deg, #2a0a0a 0%, #150505 100%);
	border: 1px solid #4a0000;
	border-radius: 2px;
	box-shadow:
		0 1px 0 rgba(255,80,80,0.15) inset,
		0 -1px 0 #000 inset,
		0 1px 0 #000;
	color: #ff4646;
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.1em;
	padding: 4px 8px;
	text-shadow: 0 0 4px rgba(255,70,70,0.6);
	transition: background 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.ig-dmx__blk:hover {
	background: linear-gradient(180deg, #3a0c0c 0%, #1f0707 100%);
}

.ig-dmx__blk[aria-pressed="true"] {
	background: linear-gradient(180deg, #ff2a2a 0%, #c00000 100%);
	border-color: #ff8080;
	color: #fff;
	box-shadow:
		0 0 0 1px #500 inset,
		0 0 10px rgba(255,40,40,0.85),
		0 0 18px rgba(255,40,40,0.55);
	text-shadow: 0 0 6px rgba(255,255,255,0.7);
}

/* BLN — blinder fire button. Same pill chrome as BLK but yellow-accent
   (matches the warm blinder lamps). Lit / glowing when held. */
.ig-dmx__bln {
	background: linear-gradient(180deg, #3a3000 0%, #1a1500 100%);
	border: 1px solid #4a4000;
	border-radius: 2px;
	box-shadow:
		0 1px 0 rgba(255,220,80,0.15) inset,
		0 -1px 0 #000 inset,
		0 1px 0 #000;
	color: #ffd060;
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.1em;
	padding: 4px 7px;
	text-shadow: 0 0 4px rgba(255,208,96,0.6);
	transition: background 80ms ease, color 80ms ease, box-shadow 80ms ease;
}
.ig-dmx__bln:hover { background: linear-gradient(180deg, #4a4000 0%, #251f00 100%); }
.ig-dmx__bln[aria-pressed="true"] {
	background: linear-gradient(180deg, #ffe48a 0%, #ffce4d 100%);
	border-color: #ffffff;
	color: #1a1500;
	box-shadow:
		0 0 0 1px #fff inset,
		0 0 12px rgba(255,230,120,0.95),
		0 0 24px rgba(255,206,77,0.75);
	text-shadow: 0 0 4px rgba(255,255,255,0.9);
}

/* Fixture toggle — segmented MH | PAR control in the DMX head.
   MH (default) enables pan/tilt; PAR disables them (PAR cans don't move). */
.ig-dmx__fixture {
	display: inline-flex;
	border: 1px solid #2a2a2a;
	background: #050505;
	border-radius: 2px;
	overflow: hidden;
	box-shadow: 0 1px 0 #000, 0 -1px 0 rgba(255,255,255,0.04) inset;
	margin-left: auto;
}
.ig-dmx__fixture-btn {
	background: transparent;
	border: 0;
	color: #777;
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.12em;
	padding: 3px 6px;
	transition: background 100ms ease, color 100ms ease;
}
.ig-dmx__fixture-btn:hover { color: #d8d8d8; }
.ig-dmx__fixture-btn + .ig-dmx__fixture-btn { border-left: 1px solid #1a1a1a; }
.ig-dmx__fixture-btn.is-active {
	background: var(--ig-accent);
	color: #0a0a0a;
	box-shadow: 0 0 6px rgba(232,255,0,0.5) inset;
	text-shadow: none;
}

/* PAR mode: TLT has no meaning for PARs — gray out its fader. PAN is
   repurposed as an FX channel (chase / random / multi) and stays active. */
.ig-hero[data-fixture="par"] .ig-dmx__fader:has(input[data-dmx-input="tlt"]) {
	opacity: 0.32;
	filter: grayscale(0.8);
}
.ig-hero[data-fixture="par"] .ig-dmx__fader:has(input[data-dmx-input="tlt"]) input {
	pointer-events: none;
}
.ig-hero[data-fixture="par"] .ig-dmx__display-row:last-child {
	opacity: 0.45;
}
/* Highlight the PAN fader in PAR mode — its role changed to FX. */
.ig-hero[data-fixture="par"] .ig-dmx__fader:has(input[data-dmx-input="pan"]) .ig-dmx__cap {
	color: var(--ig-accent);
	text-shadow: 0 0 4px rgba(232,255,0,0.6);
}
.ig-hero[data-fixture="par"] .ig-dmx__display-row:nth-last-child(2) .ig-dmx__display-lbl {
	color: var(--ig-accent);
}

/* Move the model text out of the head when fixture toggle is there (avoid
   line-wrap on narrow panels) — the toggle visually carries the same role. */
.ig-dmx__head:has(.ig-dmx__fixture) .ig-dmx__model { display: none; }

.ig-dmx__display {
	background: linear-gradient(180deg, #0a1a0a 0%, #0d1f0d 100%);
	border: 1px solid #000;
	border-radius: 2px;
	box-shadow:
		0 0 0 1px #1f1f1f,
		0 1px 0 #353535 inset,
		0 -1px 0 #000 inset;
	color: #6dff7a;
	display: grid;
	font-family: ui-monospace, "SF Mono", Menlo, monospace;
	font-size: 9px;
	gap: 1px;
	grid-template-columns: repeat(7, 1fr);
	letter-spacing: 0.02em;
	margin-bottom: 14px;
	padding: 6px 4px;
	position: relative;
	text-shadow: 0 0 4px rgba(109,255,122,0.6);
}

.ig-dmx__display::after {
	background: repeating-linear-gradient(0deg, rgba(0,0,0,0.25) 0 1px, transparent 1px 2px);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
}

.ig-dmx__display-row {
	align-items: center;
	border-right: 1px dashed rgba(109,255,122,0.18);
	display: flex;
	flex-direction: column;
	gap: 1px;
	padding: 2px 0;
}

.ig-dmx__display-row:last-child {
	border-right: 0;
}

.ig-dmx__display-ch {
	color: rgba(109,255,122,0.55);
	font-size: 8px;
}

.ig-dmx__display-lbl {
	color: rgba(109,255,122,0.7);
	font-size: 8px;
	font-weight: 700;
}

.ig-dmx__display-val {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
}

.ig-dmx__faders {
	display: grid;
	gap: 4px;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	padding: 4px 2px 2px;
}

.ig-dmx__fader {
	--fader-color: #fff;
	align-items: center;
	background: linear-gradient(180deg, #0e0e0e 0%, #1a1a1a 100%);
	border: 1px solid #050505;
	border-radius: 2px;
	box-shadow: 0 1px 0 #2c2c2c inset, 0 -1px 0 #000 inset;
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	overflow: hidden;
	padding: 6px 0 4px;
	position: relative;
}

.ig-dmx__pip {
	--pip-on: 0;
	background: var(--fader-color);
	border-radius: 999px;
	box-shadow: 0 0 4px var(--fader-color), 0 0 0 1px #000;
	height: 6px;
	opacity: calc(0.15 + 0.85 * var(--pip-on));
	transition: opacity 90ms linear;
	width: 6px;
}

.ig-dmx__fader {
	min-height: 168px;
}

.ig-dmx__track {
	display: none;
}

.ig-dmx__range {
	background: transparent;
	cursor: ns-resize;
	flex: 1;
	height: 120px;
	margin: 0;
	max-width: 100%;
	padding: 0;
	width: 26px;
	writing-mode: vertical-lr;
	direction: rtl;
}

.ig-dmx__range:focus {
	outline: 1px dashed var(--fader-color);
	outline-offset: 2px;
}

.ig-dmx__range::-webkit-slider-runnable-track {
	background:
		linear-gradient(90deg, #050505 0%, #1a1a1a 50%, #050505 100%);
	border: 1px solid #000;
	box-shadow: 0 0 0 1px #2c2c2c, 0 0 6px rgba(0,0,0,0.6) inset;
	width: 5px;
}

.ig-dmx__range::-moz-range-track {
	background:
		linear-gradient(90deg, #050505 0%, #1a1a1a 50%, #050505 100%);
	border: 1px solid #000;
	box-shadow: 0 0 0 1px #2c2c2c, 0 0 6px rgba(0,0,0,0.6) inset;
	width: 5px;
}

.ig-dmx__range::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	background:
		linear-gradient(180deg, #f4f4f4 0%, #d0d0d0 30%, #6a6a6a 31%, #d0d0d0 34%, #d0d0d0 66%, #6a6a6a 67%, #d0d0d0 70%, #888 100%);
	border: 1px solid #000;
	border-radius: 3px;
	box-shadow: 0 2px 0 rgba(0,0,0,0.7), 0 0 0 1px rgba(255,255,255,0.12) inset;
	cursor: grab;
	height: 28px;
	width: 22px;
}

.ig-dmx__range::-moz-range-thumb {
	background:
		linear-gradient(180deg, #f4f4f4 0%, #d0d0d0 30%, #6a6a6a 31%, #d0d0d0 34%, #d0d0d0 66%, #6a6a6a 67%, #d0d0d0 70%, #888 100%);
	border: 1px solid #000;
	border-radius: 3px;
	box-shadow: 0 2px 0 rgba(0,0,0,0.7), 0 0 0 1px rgba(255,255,255,0.12) inset;
	cursor: grab;
	height: 28px;
	width: 22px;
}

.ig-dmx__range:active::-webkit-slider-thumb { cursor: grabbing; }
.ig-dmx__range:active::-moz-range-thumb     { cursor: grabbing; }

.ig-dmx__cap {
	color: var(--fader-color);
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-shadow: 0 1px 0 #000;
}

.ig-dmx__smoke-row {
	align-items: stretch;
	display: flex;
	gap: 8px;
	margin-top: 12px;
}

.ig-dmx__smoke {
	background: linear-gradient(180deg, #2a2a2a 0%, #151515 100%);
	border: 1px solid #050505;
	border-radius: 2px;
	box-shadow:
		0 1px 0 rgba(255,255,255,0.08) inset,
		0 -1px 0 #000 inset,
		0 1px 0 #000;
	color: #d8d8d8;
	cursor: pointer;
	flex: 1;
	font-family: var(--ig-font-display);
	font-size: 13px;
	font-weight: 900;
	letter-spacing: 0.16em;
	padding: 9px 0;
	text-shadow: 0 1px 0 #000;
	transition: background 120ms ease, color 120ms ease, transform 80ms ease;
}
/* Compact variant — half the regular size so the CONFETTI button fits next to it. */
.ig-dmx__smoke--compact {
	flex: 0 0 auto;
	padding: 6px 10px;
	font-size: 10px;
	letter-spacing: 0.12em;
}

.ig-dmx__smoke:hover {
	background: linear-gradient(180deg, #3a3a3a 0%, #1c1c1c 100%);
	color: #fff;
}

.ig-dmx__smoke:active {
	transform: translateY(1px);
}

/* CONFETTI button — wide, party-gradient, takes the bulk of the row. */
.ig-dmx__confetti {
	background: linear-gradient(135deg, #ff3da5 0%, #ff7e1b 50%, #ffe23a 100%);
	border: 1px solid #050505;
	border-radius: 2px;
	box-shadow:
		0 1px 0 rgba(255,255,255,0.2) inset,
		0 -1px 0 rgba(0,0,0,0.4) inset,
		0 1px 0 #000;
	color: #0a0a0a;
	cursor: pointer;
	flex: 1 1 auto;
	font-family: var(--ig-font-display);
	font-size: 13px;
	font-weight: 900;
	letter-spacing: 0.16em;
	padding: 9px 0;
	text-shadow: 0 1px 0 rgba(255,255,255,0.25);
	transition: filter 120ms, transform 80ms;
}
.ig-dmx__confetti:hover  { filter: brightness(1.08); }
.ig-dmx__confetti:active { transform: translateY(1px); }

/* Confetti burst — pieces shoot from each side toward center on an arc. */
.ig-hero__confetti-burst {
	position: absolute;
	inset: 0;
	pointer-events: none;
	overflow: hidden;
	z-index: 5;
}
.ig-hero__confetti-piece {
	position: absolute;
	display: block;
	width: var(--cf-w, 6px);
	height: var(--cf-h, 11px);
	background: var(--cf-color, #fff);
	box-shadow: 0 0 6px var(--cf-color, #fff), 0 0 0 0.5px rgba(0,0,0,0.3);
	transform: rotate(var(--cf-rot-start, 0deg));
	animation: ig-confetti-fly var(--cf-dur, 2s) cubic-bezier(0.2, 0.7, 0.55, 0.95) forwards;
	will-change: transform, opacity;
}
@keyframes ig-confetti-fly {
	0%   { transform: translate(0, 0) rotate(var(--cf-rot-start));         opacity: 1; }
	35%  { transform: translate(calc(var(--cf-dx) * 0.55), var(--cf-dy));  opacity: 1; }
	80%  { opacity: 1; }
	100% { transform: translate(var(--cf-dx), calc(var(--cf-dy) * -1.3)) rotate(var(--cf-rot-end)); opacity: 0; }
}

.ig-dmx__smoke-ind {
	align-items: center;
	background: linear-gradient(180deg, #050505 0%, #0d0d0d 100%);
	border: 1px solid #000;
	border-radius: 2px;
	box-shadow: 0 0 0 1px #2a2a2a, 0 1px 0 #333 inset;
	color: #555;
	display: flex;
	font-family: var(--ig-font-mono);
	font-size: 9px;
	font-weight: 700;
	gap: 6px;
	letter-spacing: 0.1em;
	padding: 0 10px;
	transition: color 200ms ease;
}

.ig-dmx__smoke-ind-dot {
	background: #333;
	border-radius: 999px;
	box-shadow: 0 0 0 1px #000 inset;
	height: 8px;
	transition: background 200ms ease, box-shadow 200ms ease;
	width: 8px;
}

.ig-dmx__smoke-ind.is-heating {
	color: #ffb84d;
}
.ig-dmx__smoke-ind.is-heating .ig-dmx__smoke-ind-dot {
	animation: ig-smoke-heating 0.55s ease-in-out infinite alternate;
	background: #ffb84d;
}
@keyframes ig-smoke-heating {
	0%   { box-shadow: 0 0 1px #ffb84d, 0 0 0 1px #000 inset; opacity: 0.25; }
	100% { box-shadow: 0 0 8px #ffb84d, 0 0 12px rgba(255,184,77,0.6), 0 0 0 1px #000 inset; opacity: 1; }
}

.ig-dmx__smoke-ind.is-ready {
	color: #6dff7a;
}
.ig-dmx__smoke-ind.is-ready .ig-dmx__smoke-ind-dot {
	background: #6dff7a;
	box-shadow: 0 0 6px #6dff7a, 0 0 12px rgba(109,255,122,0.6), 0 0 0 1px #000 inset;
}

.ig-dmx__smoke-ind.is-firing {
	color: #fff;
}
.ig-dmx__smoke-ind.is-firing .ig-dmx__smoke-ind-dot {
	animation: ig-smoke-firing 0.4s ease-in-out infinite alternate;
	background: #ffffff;
}
@keyframes ig-smoke-firing {
	0%   { box-shadow: 0 0 4px #fff, 0 0 8px rgba(255,255,255,0.4), 0 0 0 1px #000 inset; }
	100% { box-shadow: 0 0 14px #fff, 0 0 22px rgba(255,255,255,0.85), 0 0 0 1px #000 inset; }
}

/* ============================================================
   LIGHT / MUSIC mode tabs — appear at the top of every panel
   ============================================================ */
.ig-deck-tabs {
	display: flex;
	gap: 0;
	margin: -14px -16px 12px;
	border-bottom: 1px solid #2a2a2a;
	background: linear-gradient(180deg, #1a1a1a 0%, #0c0c0c 100%);
}
.ig-deck-tabs__tab {
	flex: 1 1 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 9px 10px 8px;
	background: transparent;
	border: 0;
	border-right: 1px solid #2a2a2a;
	color: #777;
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	transition: color 120ms, background 120ms;
}
.ig-deck-tabs__tab:last-child { border-right: 0; }
.ig-deck-tabs__tab:hover { color: #d8d8d8; }
.ig-deck-tabs__tab.is-active {
	color: var(--ig-accent);
	background: linear-gradient(180deg, rgba(232,255,0,0.06) 0%, transparent 100%);
	box-shadow: inset 0 -2px 0 var(--ig-accent);
}
.ig-deck-tabs__dot {
	display: inline-block;
	width: 6px; height: 6px;
	border-radius: 50%;
	background: #3a3a3a;
	transition: background 120ms, box-shadow 120ms;
}
.ig-deck-tabs__tab.is-active .ig-deck-tabs__dot {
	background: var(--ig-accent);
	box-shadow: 0 0 5px var(--ig-accent), 0 0 9px rgba(232,255,0,0.6);
}

/* ============================================================
   DJ deck (MUSIC mode) — visual scaffold; audio engine arrives
   in a later phase. All controls are real form inputs already
   so the wiring step is purely JS.
   ============================================================ */
.ig-dj__status {
	display: inline-flex;
	align-items: center;
	padding: 2px 6px;
	background: #0a0a0a;
	border: 1px solid #2a2a2a;
	color: var(--ig-accent);
	font-family: var(--ig-font-mono);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.14em;
}

/* Two-decks-side-by-side grid — A | B */
.ig-dj-decks {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 6px;
	margin-top: 8px;
}
.ig-dj-deck {
	display: flex;
	flex-direction: column;
	gap: 7px;
	padding: 7px;
	background: linear-gradient(180deg, #161616 0%, #0d0d0d 100%);
	border: 1px solid #1f1f1f;
	border-radius: 2px;
	min-width: 0;
}

/* LCD display — pale-blue STN-style with dark text. Sits above the jog. */
.ig-dj-lcd {
	padding: 5px 7px;
	background:
		repeating-linear-gradient(0deg, rgba(0,0,0,0.04) 0 1px, transparent 1px 3px),
		linear-gradient(180deg, #c8dde8 0%, #a8c5d5 60%, #94b6c8 100%);
	border: 1px solid #050505;
	box-shadow:
		0 1px 0 rgba(255,255,255,0.45) inset,
		0 -1px 0 rgba(0,0,0,0.2) inset,
		0 1px 2px rgba(0,0,0,0.5);
	color: #0c2438;
	font-family: var(--ig-font-mono);
	font-weight: 800;
}
.ig-dj-lcd__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 6px;
	line-height: 1.25;
}
.ig-dj-lcd__row--title { margin-bottom: 2px; }
.ig-dj-lcd__title {
	font-size: 9px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
	flex: 1;
	text-shadow: 0 1px 0 rgba(255,255,255,0.3);
}
.ig-dj-lcd__row--meta { font-size: 9px; letter-spacing: 0.06em; }
.ig-dj-lcd__time { font-variant-numeric: tabular-nums; }
.ig-dj-lcd__sep { opacity: 0.45; margin: 0 2px; }
.ig-dj-lcd__bpm { font-variant-numeric: tabular-nums; opacity: 0.85; }
.ig-dj-lcd__bpm-unit { opacity: 0.6; margin-left: 3px; font-size: 8px; }

/* Jog wheel — auto-sized to deck column width, max 130px */
.ig-dj-jog {
	position: relative;
	width: 100%;
	max-width: 130px;
	margin: 0 auto;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: grab;
	touch-action: none;        /* let scratch use vertical drag without page scroll */
	user-select: none;
}
.ig-dj-jog.is-scratching { cursor: grabbing; }
.ig-dj-jog__ring {
	position: absolute; inset: 0;
	border-radius: 50%;
	background:
		radial-gradient(circle at 50% 50%, #1a1a1a 0%, #050505 70%),
		repeating-conic-gradient(from 0deg, rgba(255,255,255,0.04) 0deg 3deg, transparent 3deg 6deg);
	border: 2px solid #0a0a0a;
	box-shadow: 0 0 0 1px #2a2a2a inset, 0 2px 0 #060606;
}
.ig-dj-jog__platter {
	position: absolute; inset: 14px;
	border-radius: 50%;
	background: radial-gradient(circle at 50% 50%, #232323 0%, #0a0a0a 80%);
	border: 1px solid #303030;
	display: flex;
	align-items: flex-start;
	justify-content: center;
}
.ig-dj-deck.is-playing .ig-dj-jog__platter {
	animation: ig-dj-spin 1.8s linear infinite;
}
/* While the user is scratching, override the auto-spin and follow the finger. */
.ig-dj-jog.is-scratching .ig-dj-jog__platter {
	animation: none;
	transform: rotate(var(--scratch-angle, 0deg));
}
/* Subtle ring glow on touch to confirm contact */
.ig-dj-jog.is-scratching .ig-dj-jog__ring {
	box-shadow: 0 0 0 1px var(--ig-accent), 0 0 0 1px #2a2a2a inset, 0 2px 0 #060606;
}
.ig-dj-jog__marker {
	position: absolute;
	top: 4px; left: 50%;
	transform: translateX(-50%);
	width: 4px; height: 14px;
	background: var(--ig-accent);
	box-shadow: 0 0 4px var(--ig-accent), 0 0 8px rgba(232,255,0,0.6);
}
.ig-dj-jog__letter {
	position: relative;
	z-index: 1;
	color: #f5f5f5;
	font-family: var(--ig-font-display);
	font-size: 22px;
	font-weight: 900;
	letter-spacing: 0.04em;
	text-shadow: 0 1px 0 #000;
}
@keyframes ig-dj-spin {
	to { transform: rotate(360deg); }
}

/* Transport row — PLAY (wide) + CUE (narrow) */
.ig-dj-deck__transport {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: 4px;
}
.ig-dj-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	padding: 6px 4px;
	background: linear-gradient(180deg, #2a2a2a 0%, #151515 100%);
	border: 1px solid #1a1a1a;
	color: #ddd;
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.1em;
	box-shadow: 0 1px 0 rgba(255,255,255,0.05) inset, 0 -1px 0 #000 inset, 0 1px 0 #000;
	transition: background 120ms, color 120ms;
}
.ig-dj-btn svg { width: 10px; height: 10px; display: block; flex: 0 0 auto; }
.ig-dj-btn--cue  { color: #ffa53a; }
.ig-dj-btn:hover { background: linear-gradient(180deg, #383838 0%, #1c1c1c 100%); color: #fff; }
.ig-dj-btn[aria-pressed="true"] {
	background: linear-gradient(180deg, #4a4a00 0%, #1a1a00 100%);
	color: var(--ig-accent);
	box-shadow: 0 0 6px rgba(232,255,0,0.4) inset;
}
.ig-dj-btn__text { letter-spacing: 0.14em; }

/* Rotary knobs row — HI / MID / LOW per deck */
.ig-dj-knobs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
}
.ig-dj-knob {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
	position: relative;
	cursor: ns-resize;
	user-select: none;
	touch-action: none;
}
.ig-dj-knob__face {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background:
		radial-gradient(circle at 35% 30%, #3a3a3a 0%, #1a1a1a 55%, #050505 100%);
	border: 1.5px solid #000;
	box-shadow:
		0 0 0 1.5px #2a2a2a,
		0 1px 0 rgba(255,255,255,0.08) inset,
		0 0 6px rgba(0,0,0,0.7);
	position: relative;
}
.ig-dj-knob__indicator {
	position: absolute;
	top: 2px;
	left: 50%;
	width: 2px;
	height: 9px;
	background: var(--ig-accent);
	box-shadow: 0 0 4px var(--ig-accent), 0 0 7px rgba(232,255,0,0.5);
	transform-origin: 1px 14px;
	transform: translateX(-50%) rotate(var(--knob-angle, 0deg));
}
.ig-dj-knob.is-dragging .ig-dj-knob__face {
	box-shadow:
		0 0 0 1.5px var(--ig-accent),
		0 1px 0 rgba(255,255,255,0.08) inset,
		0 0 8px rgba(232,255,0,0.5);
}
.ig-dj-knob__label {
	font-family: var(--ig-font-mono);
	font-size: 8px;
	font-weight: 800;
	letter-spacing: 0.14em;
	color: #888;
}
.ig-dj-knob__input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0,0,0,0);
	border: 0;
}
.ig-dj-knob__input:focus + .ig-dj-knob__label,
.ig-dj-knob:has(.ig-dj-knob__input:focus) .ig-dj-knob__face {
	color: var(--ig-accent);
}
.ig-dj-knob:has(.ig-dj-knob__input:focus) .ig-dj-knob__face {
	box-shadow: 0 0 0 1.5px var(--ig-accent), 0 0 6px rgba(232,255,0,0.4);
}

/* Cross-fader — full-width horizontal between the two decks */
.ig-dj-xfade {
	margin-top: 10px;
	padding: 8px 10px 10px;
	background: linear-gradient(180deg, #0a0a0a 0%, #050505 100%);
	border: 1px solid #1f1f1f;
}
.ig-dj-xfade__labels {
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: #777;
	font-family: var(--ig-font-mono);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.14em;
	margin-bottom: 6px;
}
.ig-dj-xfade__title {
	color: #aaa;
	letter-spacing: 0.22em;
}
.ig-dj-xfade__track input[type="range"] {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	height: 24px;
	background: transparent;
	cursor: pointer;
}
.ig-dj-xfade__track input[type="range"]::-webkit-slider-runnable-track {
	height: 8px;
	background:
		linear-gradient(90deg, var(--ig-accent) 0%, #4a4a00 30%, #000 50%, #4a4a00 70%, var(--ig-accent) 100%);
	border: 1px solid #050505;
	border-radius: 1px;
	box-shadow: 0 1px 2px #000 inset;
}
.ig-dj-xfade__track input[type="range"]::-moz-range-track {
	height: 8px;
	background:
		linear-gradient(90deg, var(--ig-accent) 0%, #4a4a00 30%, #000 50%, #4a4a00 70%, var(--ig-accent) 100%);
	border: 1px solid #050505;
}
.ig-dj-xfade__track input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 18px; height: 22px;
	margin-top: -8px;
	background: linear-gradient(180deg, #f8f8f8 0%, #999 50%, #555 100%);
	border: 1.5px solid #000;
	box-shadow: 0 0 4px rgba(232,255,0,0.5), 0 1px 0 rgba(255,255,255,0.3) inset;
	cursor: ew-resize;
}
.ig-dj-xfade__track input[type="range"]::-moz-range-thumb {
	width: 18px; height: 22px;
	background: linear-gradient(180deg, #f8f8f8 0%, #999 50%, #555 100%);
	border: 1.5px solid #000;
	cursor: ew-resize;
}

/* FX strip — 3 knob inputs + SYNC button */
.ig-dj-fx {
	margin-top: 10px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1.2fr;
	gap: 6px;
	padding: 8px;
	background: linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%);
	border: 1px solid #1f1f1f;
}
.ig-dj-fx__knob {
	display: flex;
	flex-direction: column;
	gap: 4px;
	align-items: center;
}
.ig-dj-fx__label {
	color: #888;
	font-family: var(--ig-font-mono);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.14em;
}
.ig-dj-fx__knob input[type="range"] {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	height: 14px;
	background: transparent;
	cursor: pointer;
}
.ig-dj-fx__knob input[type="range"]::-webkit-slider-runnable-track {
	height: 3px;
	background: linear-gradient(90deg, #222 0%, var(--ig-accent) 50%, #222 100%);
	border: 1px solid #050505;
}
.ig-dj-fx__knob input[type="range"]::-moz-range-track {
	height: 3px;
	background: linear-gradient(90deg, #222 0%, var(--ig-accent) 50%, #222 100%);
	border: 1px solid #050505;
}
.ig-dj-fx__knob input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 8px; height: 12px;
	margin-top: -5px;
	background: #f0f0f0;
	border: 1px solid #000;
}
.ig-dj-fx__knob input[type="range"]::-moz-range-thumb {
	width: 8px; height: 12px;
	background: #f0f0f0;
	border: 1px solid #000;
}
.ig-dj-fx__sync {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	padding: 6px 4px;
	background: linear-gradient(180deg, #2a2a2a 0%, #0a0a0a 100%);
	border: 1px solid #000;
	color: #ccc;
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.12em;
	box-shadow: 0 1px 0 rgba(255,255,255,0.05) inset, 0 -1px 0 #000 inset;
}
.ig-dj-fx__sync-glyph { font-size: 13px; line-height: 1; }
.ig-dj-fx__sync:hover { color: #fff; }
.ig-dj-fx__sync[aria-pressed="true"] {
	background: linear-gradient(180deg, var(--ig-accent) 0%, #909500 100%);
	color: #000;
	box-shadow: 0 0 6px rgba(232,255,0,0.5);
}

/* ==========================================================================
   Hero smoke (fog machine)
   ========================================================================== */

.ig-hero__smoke {
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transition: opacity 1.4s ease-out;
	z-index: 50;
}

.ig-hero[data-dmx-stage].is-smoking .ig-hero__smoke   { opacity: 1; transition: opacity 200ms ease-out; }
.ig-hero[data-dmx-stage].is-smoke-fade .ig-hero__smoke { opacity: 0; }

.ig-hero__smoke-emitter {
	bottom: 0;
	height: 100%;
	position: absolute;
	width: 60%;
}

.ig-hero__smoke-emitter--left  { left: -4%; }
.ig-hero__smoke-emitter--right { right: -4%; }

.ig-hero__smoke-emitter span {
	backface-visibility: hidden;
	background: radial-gradient(circle at 45% 40%,
		rgba(255,255,255,0.78) 0%,
		rgba(248,249,252,0.64) 25%,
		rgba(228,232,240,0.45) 45%,
		rgba(200,208,220,0.25) 65%,
		rgba(170,180,195,0.10) 80%,
		rgba(150,160,175,0) 92%);
	border-radius: 50%;
	bottom: 0;
	display: block;
	filter: blur(12px);
	height: 240px;
	opacity: 0;
	position: absolute;
	transform: translateZ(0);
	width: 240px;
	will-change: transform, opacity;
}

.ig-hero__smoke-emitter--left span  { left: -10px; }
.ig-hero__smoke-emitter--right span { right: -10px; }

.ig-hero[data-dmx-stage].is-smoking .ig-hero__smoke-emitter--left  span,
.ig-hero[data-dmx-stage].is-smoke-fade .ig-hero__smoke-emitter--left span {
	animation: ig-smoke-left 5.6s var(--puff-delay, 0s) cubic-bezier(0.22, 0.7, 0.28, 1) infinite;
}
.ig-hero[data-dmx-stage].is-smoking .ig-hero__smoke-emitter--right span,
.ig-hero[data-dmx-stage].is-smoke-fade .ig-hero__smoke-emitter--right span {
	animation: ig-smoke-right 5.6s var(--puff-delay, 0s) cubic-bezier(0.22, 0.7, 0.28, 1) infinite;
}

@keyframes ig-smoke-left {
	0% {
		opacity: 0;
		transform: translate3d(0, 0, 0) scale(calc(var(--puff-scale, 1) * 0.25));
	}
	7% {
		opacity: 0.85;
		transform: translate3d(80px, calc(var(--puff-jitter, 0) * 0.4px - 16px), 0) scale(calc(var(--puff-scale, 1) * 0.4));
	}
	40% {
		opacity: 0.72;
		transform: translate3d(34vw, calc(var(--puff-jitter, 0) * 1.1px - 80px), 0) scale(calc(var(--puff-scale, 1) * 1.2));
	}
	75% {
		opacity: 0.5;
		transform: translate3d(52vw, calc(var(--puff-jitter, 0) * 1.5px - 160px), 0) scale(calc(var(--puff-scale, 1) * 2));
	}
	92% {
		opacity: 0.18;
		transform: translate3d(60vw, calc(var(--puff-jitter, 0) * 1.7px - 200px), 0) scale(calc(var(--puff-scale, 1) * 2.4));
	}
	100% {
		opacity: 0;
		transform: translate3d(64vw, calc(var(--puff-jitter, 0) * 1.8px - 220px), 0) scale(calc(var(--puff-scale, 1) * 2.7));
	}
}

@keyframes ig-smoke-right {
	0% {
		opacity: 0;
		transform: translate3d(0, 0, 0) scale(calc(var(--puff-scale, 1) * 0.25));
	}
	7% {
		opacity: 0.85;
		transform: translate3d(-80px, calc(var(--puff-jitter, 0) * 0.4px - 16px), 0) scale(calc(var(--puff-scale, 1) * 0.4));
	}
	40% {
		opacity: 0.72;
		transform: translate3d(-34vw, calc(var(--puff-jitter, 0) * 1.1px - 80px), 0) scale(calc(var(--puff-scale, 1) * 1.2));
	}
	75% {
		opacity: 0.5;
		transform: translate3d(-52vw, calc(var(--puff-jitter, 0) * 1.5px - 160px), 0) scale(calc(var(--puff-scale, 1) * 2));
	}
	92% {
		opacity: 0.18;
		transform: translate3d(-60vw, calc(var(--puff-jitter, 0) * 1.7px - 200px), 0) scale(calc(var(--puff-scale, 1) * 2.4));
	}
	100% {
		opacity: 0;
		transform: translate3d(-64vw, calc(var(--puff-jitter, 0) * 1.8px - 220px), 0) scale(calc(var(--puff-scale, 1) * 2.7));
	}
}

@media (prefers-reduced-motion: reduce) {
	.ig-hero[data-dmx-stage].is-smoking .ig-hero__smoke-emitter span,
	.ig-hero[data-dmx-stage].is-smoke-fade .ig-hero__smoke-emitter span {
		animation: none;
		opacity: 0.4;
		transform: scale(2);
	}
}

.ig-ticker {
	background: var(--ig-accent);
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	color: var(--ig-accent-ink);
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	overflow: hidden;
	padding: 12px 0;
	text-transform: uppercase;
	white-space: nowrap;
}

.ig-ticker__track {
	animation: ig-ticker 28s linear infinite;
	display: inline-flex;
	gap: 48px;
	padding-left: var(--ig-gutter-x);
}

.ig-ticker__track span::after {
	color: var(--ig-accent-ink);
	content: " ★ ";
	margin: 0 16px;
}

@keyframes ig-ticker {
	from { transform: translate3d(0, 0, 0); }
	to   { transform: translate3d(-50%, 0, 0); }
}

/* ==========================================================================
   Sections (categories, featured products)
   ========================================================================== */

.ig-categories,
.ig-featured {
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	padding: var(--ig-gutter-y) 0;
}

/* Page-top reset — ZERO top spacing on every page-level container so the
   only thing that controls the H1's distance from the header is the
   .ig-page-head rule below. Change ONE value, every page moves together. */
.ig-container.ig-shop,
.ig-container.ig-checkout,
.ig-container.ig-account,
.ig-container.ig-quickbuy,
.ig-container.ig-static,
.ig-container.ig-contact,
.ig-container.ig-impresszum,
.ig-container.ig-legal,
.ig-container.ig-serial-check,
.ig-container.ig-brand-index,
.ig-container.ig-about,
.ig-container.ig-news-page {
	padding-top: 0;
}

/* Page-head — single source of truth for the top spacing of every page. */
.ig-page-head {
	padding-top: clamp(40px, 6vw, 88px);
	margin-bottom: 32px;
}

.ig-page-head h1 {
	font-size: clamp(48px, 7vw, 120px);
	line-height: 1;
	margin: 0;
}

.ig-page-head .ig-eyebrow {
	margin-bottom: 20px;
}

/* --shop is now redundant but kept as an explicit-intent hook. */
.ig-page-head--shop {}

.ig-section-head {
	align-items: end;
	display: grid;
	gap: 16px;
	grid-template-columns: minmax(0, 1fr) auto;
	margin-bottom: 32px;
}

.ig-section-head h2 {
	margin: 0;
}

.ig-section-head .ig-button {
	min-height: 44px;
	padding: 0 18px;
}

.ig-category-grid {
	display: grid;
	gap: 0;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.ig-category-tile {
	align-items: end;
	aspect-ratio: 4 / 5;
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	color: var(--ig-ink);
	display: flex;
	font-family: var(--ig-font-display);
	font-size: clamp(20px, 2vw, 28px);
	font-weight: 800;
	letter-spacing: -0.02em;
	margin: 0 -1.5px -1.5px 0;
	overflow: hidden;
	padding: 18px;
	position: relative;
	text-transform: uppercase;
	transition: background 120ms ease, color 120ms ease;
}

.ig-category-tile__img {
	height: 100%;
	left: 0;
	object-fit: cover;
	position: absolute;
	top: 0;
	transition: transform 360ms ease, filter 240ms ease, opacity 240ms ease;
	width: 100%;
	z-index: 0;
}

.ig-category-tile.has-image::after {
	background: linear-gradient(180deg, rgba(10,10,10,0) 35%, rgba(10,10,10,0.78) 100%);
	content: "";
	inset: 0;
	position: absolute;
	z-index: 1;
}

.ig-category-tile.has-image span {
	align-items: flex-end;
	color: var(--ig-paper);
	display: flex;
	inset: 0;
	padding: 18px;
	position: absolute;
	transition: color 360ms ease;
	z-index: 2;
}

.ig-category-tile.has-image span::before {
	background: linear-gradient(180deg, rgba(232,255,0,0) 25%, rgba(232,255,0,0.92) 100%);
	content: "";
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transition: opacity 360ms ease;
	z-index: -1;
}

.ig-category-tile::before {
	background: var(--ig-paper);
	border-bottom: var(--ig-stroke) solid var(--ig-line);
	border-right: var(--ig-stroke) solid var(--ig-line);
	content: attr(data-index);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	left: 0;
	letter-spacing: 0.08em;
	padding: 6px 10px;
	position: absolute;
	top: 0;
	z-index: 2;
}

.ig-category-tile:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-category-tile.has-image:hover .ig-category-tile__img {
	transform: scale(1.06);
	filter: saturate(1.15);
}

.ig-category-tile.has-image:hover span::before {
	opacity: 1;
}

.ig-category-tile.has-image:hover span {
	color: var(--ig-accent-ink);
}

/* ==========================================================================
   Product grid
   ========================================================================== */

.ig-product-grid {
	display: grid;
	gap: 0;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.ig-product-card {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	gap: 16px;
	margin: 0 -1.5px -1.5px 0;
	padding: 22px;
	position: relative;
	transition: transform 120ms ease;
}

.ig-product-card__media-wrap {
	position: relative;
}

.ig-product-card__media {
	aspect-ratio: 4 / 3;
	background: transparent;
	border: var(--ig-stroke) solid var(--ig-line);
	display: block;
	overflow: hidden;
	position: relative;
}

.ig-product-card__media img {
	height: 100%;
	object-fit: contain;
	transition: transform 220ms ease;
	width: 100%;
}

.ig-product-card:hover .ig-product-card__media img {
	transform: scale(1.04);
}

.ig-product-card__placeholder {
	display: block;
	height: 100%;
	object-fit: contain;
	width: 100%;
}

.ig-product-card__sku {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ig-product-card h3 {
	font-size: 18px;
	letter-spacing: -0.01em;
	line-height: 1.15;
	margin: 0;
	text-transform: none;
}

.ig-product-card__price {
	align-items: baseline;
	display: flex;
	flex-wrap: wrap;
	font-family: var(--ig-font-display);
	font-size: 26px;
	font-weight: 800;
	gap: 8px;
	margin: 0;
}

.ig-product-card__price small {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ig-product-card__strike {
	color: var(--ig-muted);
	font-size: 0.6em;
	font-weight: 600;
	margin-right: 8px;
	text-decoration-thickness: 2px;
}

.ig-product-card__pricetag {
	background: var(--ig-ink);
	color: var(--ig-paper);
	display: inline-block;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.1em;
	margin-bottom: 4px;
	padding: 3px 7px;
	text-transform: uppercase;
}

.ig-product-card__amount {
	display: inline-block;
}

.ig-product-card__amount.is-muted {
	color: var(--ig-muted);
}

.ig-product-card__price--empty {
	color: var(--ig-muted);
	font-size: 14px;
	min-height: 56px;
}

.ig-product-card__stock {
	border: var(--ig-stroke) solid var(--ig-line);
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 800;
	left: 10px;
	letter-spacing: 0.08em;
	line-height: 1;
	padding: 5px 8px;
	position: absolute;
	text-transform: uppercase;
	top: 10px;
	z-index: 2;
}

.ig-product-card__stock.is-stock-in   { background: #15803D; color: #fff; }
.ig-product-card__stock.is-stock-low  { background: #f5b800; color: #0a0a0a; }
.ig-product-card__stock.is-stock-last { background: #f5b800; color: #0a0a0a; }
.ig-product-card__stock.is-stock-oos  { background: #e11d48; color: #fff; }

.ig-product-card__sale {
	background: #f5b800;
	border: var(--ig-stroke) solid var(--ig-line);
	color: #0a0a0a;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1;
	padding: 5px 8px;
	position: absolute;
	right: 10px;
	text-transform: uppercase;
	top: 10px;
	z-index: 2;
}

.ig-product-card__cta {
	display: flex;
	gap: 8px;
}

.ig-product-card__cta .ig-button {
	flex: 1;
	min-height: 44px;
	padding: 0 16px;
}

.ig-product-card .ig-error,
.ig-product-card .ig-notice {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	margin: 0;
	padding: 8px 10px;
}

/* ==========================================================================
   Shop layout
   ========================================================================== */

.ig-breadcrumb {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 600;
	gap: 6px;
	letter-spacing: 0.08em;
	margin-bottom: 24px;
	text-transform: uppercase;
}

.ig-breadcrumb a {
	color: var(--ig-muted);
}

.ig-breadcrumb a:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	padding: 0 4px;
}

.ig-breadcrumb span {
	color: var(--ig-ink);
}

.ig-breadcrumb span[aria-current="page"] {
	background: var(--ig-ink);
	color: var(--ig-paper);
	padding: 2px 8px;
}

.ig-breadcrumb i {
	color: var(--ig-muted);
	font-style: normal;
	font-weight: 400;
	opacity: 0.5;
}

.ig-shop {
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	padding-top: 0;
	padding-bottom: 56px;
	position: relative;
}

.ig-shop__spinner {
	background: var(--ig-accent);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	color: var(--ig-accent-ink);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	left: 50%;
	letter-spacing: 0.1em;
	padding: 10px 18px;
	position: fixed;
	text-transform: uppercase;
	top: 100px;
	transform: translateX(-50%);
	z-index: 100;
}

.ig-shop__loadmore-wrap {
	display: flex;
	justify-content: center;
	margin: clamp(28px, 4vw, 56px) 0 0;
}

.ig-shop__loadmore-wrap[hidden] { display: none; }

.ig-shop__loadmore {
	letter-spacing: 0.08em;
	min-width: 240px;
	text-transform: uppercase;
}

/* Floating filter FAB + bottom sheet (mobile only) */
.ig-shop-fab-dock,
.ig-shop-fab,
.ig-shop-sheet-backdrop,
.ig-shop__sidebar-close,
.ig-cart-fab-dock {
	display: none;
}

@media (max-width: 880px) {
	.ig-cart-fab-dock {
		align-items: center;
		bottom: 18px;
		display: flex;
		justify-content: space-between;
		left: 18px;
		pointer-events: none;
		position: fixed;
		right: 18px;
		z-index: 20;
	}
	.ig-cart-fab-dock[hidden] { display: none !important; }

	.ig-cart-fab-dock > * {
		pointer-events: auto;
	}

	/* Hide the inline checkout button + total on mobile — the sticky dock
	   replaces them. Both come back on desktop. */
	.ig-checkout form .ig-total,
	.ig-checkout form .ig-actions {
		display: none;
	}

	/* Bottom padding so the fixed dock doesn't cover the last content row. */
	.ig-checkout:has([data-cart-fab]),
	.ig-shop:has(.ig-shop-fab-dock) {
		padding-bottom: 100px;
	}

	.ig-cart-fab {
		align-items: center;
		background: var(--ig-ink);
		border: var(--ig-stroke-bold) solid var(--ig-line);
		box-shadow: 4px 4px 0 var(--ig-accent);
		color: var(--ig-paper);
		display: inline-flex;
		font-family: var(--ig-font-mono);
		font-size: 13px;
		font-weight: 800;
		letter-spacing: 0.08em;
		padding: 14px 18px;
		text-decoration: none;
		text-transform: uppercase;
		transition: background 160ms ease, color 160ms ease, transform 80ms ease, box-shadow 120ms ease;
	}

	.ig-cart-fab:hover {
		background: var(--ig-accent);
		color: var(--ig-accent-ink);
	}

	.ig-cart-fab:active {
		box-shadow: 2px 2px 0 var(--ig-accent);
		transform: translate(2px, 2px);
	}

	.ig-cart-fab-total {
		align-items: baseline;
		background: var(--ig-accent);
		border: var(--ig-stroke-bold) solid var(--ig-line);
		box-shadow: -4px 4px 0 var(--ig-ink);
		color: var(--ig-accent-ink);
		display: inline-flex;
		gap: 10px;
		padding: 10px 14px;
	}

	.ig-cart-fab-total__label {
		font-family: var(--ig-font-mono);
		font-size: 10px;
		font-weight: 700;
		letter-spacing: 0.1em;
		opacity: 0.65;
		text-transform: uppercase;
	}

	.ig-cart-fab-total strong {
		font-family: var(--ig-font-display);
		font-size: 18px;
		font-weight: 900;
		letter-spacing: -0.01em;
		line-height: 1;
		white-space: nowrap;
	}

}

@media (max-width: 880px) {
	.ig-shop-fab-dock {
		bottom: 18px;
		display: block;
		left: 18px;
		pointer-events: none;
		position: fixed;
		right: 18px;
		z-index: 20;
	}

	.ig-shop-fab {
		align-items: center;
		background: var(--ig-ink);
		border: var(--ig-stroke-bold) solid var(--ig-line);
		box-shadow: 4px 4px 0 var(--ig-accent);
		color: var(--ig-paper);
		cursor: pointer;
		display: inline-flex;
		font-family: var(--ig-font-mono);
		font-size: 13px;
		font-weight: 800;
		gap: 10px;
		letter-spacing: 0.08em;
		padding: 14px 18px;
		pointer-events: auto;
		position: relative;
		text-transform: uppercase;
		transition: background 160ms ease, color 160ms ease, transform 80ms ease;
	}

	.ig-shop-fab:hover,
	.ig-shop-fab[aria-expanded="true"] {
		background: var(--ig-accent);
		color: var(--ig-accent-ink);
	}

	.ig-shop-fab:active {
		transform: translate(2px, 2px);
	}

	.ig-shop-fab svg {
		height: 18px;
		width: 18px;
	}

	.ig-shop-fab__badge {
		background: var(--ig-accent);
		border: var(--ig-stroke) solid var(--ig-line);
		color: var(--ig-accent-ink);
		font-size: 11px;
		font-weight: 800;
		min-width: 20px;
		padding: 2px 6px;
		text-align: center;
	}

	.ig-shop-fab__badge[hidden] {
		display: none;
	}

	.ig-shop-fab:hover .ig-shop-fab__badge,
	.ig-shop-fab[aria-expanded="true"] .ig-shop-fab__badge {
		background: var(--ig-ink);
		color: var(--ig-accent);
	}

	.ig-shop-sheet-backdrop {
		background: rgba(0, 0, 0, 0.55);
		display: block;
		inset: 0;
		opacity: 0;
		pointer-events: none;
		position: fixed;
		transition: opacity 240ms ease, visibility 0s linear 240ms;
		visibility: hidden;
		z-index: 95;
	}

	.ig-shop-sheet-backdrop.is-open {
		opacity: 1;
		pointer-events: auto;
		transition: opacity 240ms ease, visibility 0s linear 0s;
		visibility: visible;
	}

	/* Sidebar becomes a bottom slide-up sheet — selectors are scoped under
	   .ig-shop so they beat the base desktop rule that comes later in the file. */
	.ig-shop .ig-shop__sidebar {
		background: var(--ig-paper);
		border: var(--ig-stroke-bold) solid var(--ig-line);
		border-bottom: 0;
		bottom: 0;
		left: 0;
		max-height: 88vh;
		max-width: none;
		overflow-y: auto;
		padding: 68px 24px 32px;
		position: fixed;
		right: 0;
		transform: translateY(100%);
		transition: transform 320ms cubic-bezier(0.4, 0, 0.2, 1);
		z-index: 96;
	}

	.ig-shop .ig-shop__sidebar > h2 {
		margin-top: 0;
	}

	.ig-shop .ig-shop__sidebar .ig-shop__filters {
		padding-top: 24px;
	}

	.ig-shop .ig-shop__sidebar .ig-shop__filter {
		padding: 0;
	}

	.ig-shop .ig-shop__sidebar.is-open {
		transform: translateY(0);
	}

	.ig-shop__sidebar-close {
		align-items: center;
		background: var(--ig-ink);
		border: var(--ig-stroke) solid var(--ig-line);
		color: var(--ig-paper);
		cursor: pointer;
		display: flex;
		height: 44px;
		justify-content: center;
		padding: 0;
		position: absolute;
		right: 16px;
		top: 16px;
		width: 44px;
		z-index: 1;
	}

	.ig-shop__sidebar-close svg {
		height: 20px;
		width: 20px;
	}

	.ig-shop__sidebar-close:hover {
		background: var(--ig-accent);
		color: var(--ig-accent-ink);
	}
}

.ig-shop__layout {
	display: grid;
	gap: 0;
	grid-template-columns: 280px minmax(0, 1fr);
}

.ig-shop__sidebar {
	border-right: var(--ig-stroke-bold) solid var(--ig-line);
	padding: 0 32px 0 0;
}

.ig-shop__sidebar h2 {
	font-size: 14px;
	letter-spacing: var(--ig-tracking-eyebrow);
	margin: 0 0 16px;
}

.ig-cat-tree,
.ig-cat-tree ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ig-cat-tree ul {
	border-left: var(--ig-stroke) solid var(--ig-line);
	margin-left: 8px;
	padding-left: 12px;
}

.ig-cat-tree a {
	color: var(--ig-ink);
	display: block;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	padding: 8px 0;
	position: relative;
	text-transform: uppercase;
}

.ig-cat-tree a:hover,
.ig-cat-tree a.is-active {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	padding-left: 6px;
}

.ig-shop__main {
	padding-left: 32px;
}

.ig-shop__filters {
	border-top: var(--ig-stroke) solid var(--ig-line);
	display: grid;
	gap: 24px;
	margin-top: 28px;
	padding-top: 24px;
}

.ig-shop__filter h2 {
	font-size: 13px;
	letter-spacing: var(--ig-tracking-eyebrow);
	margin: 0 0 10px;
}

.ig-shop__filter input[type="search"],
.ig-shop__sort {
	background: var(--ig-bone);
	border: var(--ig-stroke) solid var(--ig-line);
	border-radius: 0;
	font-family: var(--ig-font-mono);
	font-size: 16px;
	min-height: 44px;
	padding: 0 12px;
	width: 100%;
}

.ig-shop__sort {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%230a0a0a' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-position: right 12px center;
	background-repeat: no-repeat;
	background-size: 12px 8px;
	cursor: pointer;
	padding-right: 36px;
}

.ig-shop__check {
	align-items: center;
	cursor: pointer;
	display: flex;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	gap: 8px;
	padding: 4px 0;
}

.ig-shop__check input[type="checkbox"] {
	accent-color: var(--ig-accent);
	height: 16px;
	width: 16px;
}

.ig-shop__brands {
	list-style: none;
	margin: 0;
	max-height: 220px;
	overflow-y: auto;
	padding: 0 4px 0 0;
}

.ig-shop__brands::-webkit-scrollbar {
	width: 6px;
}

.ig-shop__brands::-webkit-scrollbar-thumb {
	background: var(--ig-ink);
}

.ig-shop__filter-actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ig-shop__filter-actions .ig-button {
	min-height: 44px;
	padding: 0 14px;
	width: 100%;
}

.ig-shop__reset {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.06em;
	text-align: center;
	text-decoration: underline;
	text-transform: uppercase;
}

.ig-shop__reset:hover {
	color: var(--ig-ink);
}

.ig-shop__toolbar {
	align-items: end;
	display: flex;
	justify-content: space-between;
	margin-bottom: 24px;
}

.ig-shop__toolbar h1 {
	font-size: clamp(36px, 5vw, 72px);
	margin: 0;
}

/* ==========================================================================
   Cart / Checkout
   ========================================================================== */

.ig-checkout {
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	padding-top: 0;
	padding-bottom: 56px;
}

.ig-checkout h1 {
	font-size: clamp(36px, 6vw, 90px);
	margin: 0 0 32px;
}

/* ==========================================================================
   Empty cart panel
   ========================================================================== */

.ig-empty-cart[hidden] {
	display: none;
}

.ig-empty-cart__head {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	box-shadow: 6px 6px 0 var(--ig-ink);
	margin-bottom: 48px;
	padding: 40px;
}

.ig-empty-cart__head h2 {
	font-family: var(--ig-font-display);
	font-size: clamp(32px, 5vw, 64px);
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 0.95;
	margin: 6px 0 14px;
}

.ig-empty-cart__lead {
	color: var(--ig-muted);
	font-size: 15px;
	line-height: 1.55;
	margin: 0 0 22px;
	max-width: 60ch;
}

.ig-empty-cart__head .ig-actions {
	margin-top: 4px;
}

.ig-empty-cart__grid {
	margin-top: 0;
}

@media (max-width: 720px) {
	.ig-empty-cart__head {
		box-shadow: 3px 3px 0 var(--ig-ink);
		margin-bottom: 32px;
		padding: 26px 22px;
	}
}

.ig-table {
	border: var(--ig-stroke-bold) solid var(--ig-line);
	border-collapse: collapse;
	width: 100%;
}

.ig-table th,
.ig-table td {
	border-bottom: var(--ig-stroke) solid var(--ig-line);
	padding: 14px;
	text-align: left;
	vertical-align: middle;
}

.ig-table th {
	background: var(--ig-ink);
	color: var(--ig-paper);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Kosár tábla: meta sor (SKU + max-figyelmeztetés) — abszolút pozícióban
   a név alatt, így a tartalma SOSE nyújtja meg a sor magasságát. Akár
   van „Max N db raktáron" üzenet, akár nincs, a sor egységes marad. */
.ig-table[data-cart-table] tr[data-cart-row] > td:nth-child(1) {
	position: relative;
	padding-bottom: 28px;        /* ← helyet hagyunk a meta sornak */
}

.ig-cart-row__meta {
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 8px;
	display: flex;
	gap: 12px;
	align-items: center;
	flex-wrap: nowrap;
	overflow: hidden;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.06em;
	line-height: 1;
	white-space: nowrap;
}

.ig-cart-row__sku {
	color: var(--ig-muted, #6B6B6B);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-overflow: ellipsis;
	overflow: hidden;
}

.ig-cart-row__max {
	background: #c02323;
	color: #fff;
	padding: 3px 8px;
	font-weight: 700;
	letter-spacing: 0.04em;
	flex-shrink: 0;
}

/* Kosár tábla: a Nettó / Bruttó oszlopok fix szélesek + jobbra zárt
   monospace szám — így a sorok NEM ugrálnak, ha tizedessé / nagyobbá
   változik a formattált ár. Az 5 oszlop: Termék, Mennyiség, Nettó,
   Bruttó, Eltávolítás. (Az oszlopindexek nth-child kompatibilisek
   thead-del és tbody-vel egyaránt.) */
.ig-table[data-cart-table] th:nth-child(3),
.ig-table[data-cart-table] th:nth-child(4),
.ig-table[data-cart-table] td:nth-child(3),
.ig-table[data-cart-table] td:nth-child(4) {
	min-width: 140px;
	width: 140px;
	text-align: right;
	font-family: var(--ig-font-mono);
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum" 1;
	white-space: nowrap;
}

.ig-table[data-cart-table] td:nth-child(3),
.ig-table[data-cart-table] td:nth-child(4) {
	font-size: 14px;
}

.ig-table input[type="number"] {
	background: var(--ig-bone);
	border: var(--ig-stroke) solid var(--ig-line);
	border-radius: 0;
	font-family: var(--ig-font-mono);
	font-weight: 700;
	min-height: 40px;
	padding: 0 10px;
	width: 88px;
}

.ig-qty {
	border: var(--ig-stroke-bold) solid var(--ig-line);
	display: inline-flex;
	align-items: stretch;
	background: var(--ig-paper);
}

.ig-qty__btn {
	background: var(--ig-paper);
	border: 0;
	border-right: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-ink);
	cursor: pointer;
	font-family: var(--ig-font-display);
	font-size: 18px;
	font-weight: 900;
	line-height: 1;
	min-height: 44px;
	padding: 0;
	touch-action: manipulation;
	transition: background 120ms ease, color 120ms ease;
	user-select: none;
	-webkit-user-select: none;
	-webkit-tap-highlight-color: transparent;
	width: 44px;
}

.ig-qty__btn:last-child {
	border-right: 0;
}

.ig-qty__btn:hover {
	background: var(--ig-accent);
}

.ig-qty__btn:disabled,
.ig-qty__btn[disabled] {
	background: var(--ig-paper);
	color: var(--ig-muted);
	cursor: not-allowed;
	opacity: 0.35;
	pointer-events: none;
}

.ig-cart-row__remove-cell {
	text-align: right;
	width: 1%;
	white-space: nowrap;
}

.ig-cart-row__remove {
	align-items: center;
	background: var(--ig-danger);
	border: 0;
	border-radius: 999px;
	box-shadow: 0 0 0 2px var(--ig-line);
	color: var(--ig-paper);
	cursor: pointer;
	display: inline-flex;
	height: 32px;
	justify-content: center;
	padding: 0;
	touch-action: manipulation;
	transition: transform 120ms ease, box-shadow 120ms ease, background 120ms ease;
	user-select: none;
	-webkit-user-select: none;
	-webkit-tap-highlight-color: transparent;
	width: 32px;
}

.ig-cart-row__remove svg {
	height: 16px;
	width: 16px;
}

.ig-cart-row__remove:hover,
.ig-cart-row__remove:focus-visible {
	background: var(--ig-ink);
	box-shadow: 0 0 0 2px var(--ig-danger);
	outline: none;
	transform: scale(1.08);
}

.ig-table input.ig-qty__input,
.ig-qty__input {
	background: var(--ig-paper);
	border: 0;
	border-right: var(--ig-stroke) solid var(--ig-line);
	border-radius: 0;
	color: var(--ig-ink);
	font-family: var(--ig-font-display);
	font-size: 18px;
	font-weight: 800;
	-moz-appearance: textfield;
	min-height: 44px;
	padding: 0;
	text-align: center;
	width: 56px;
}

.ig-qty__input::-webkit-outer-spin-button,
.ig-qty__input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.ig-qty__input:focus {
	background: var(--ig-bone);
	outline: 0;
}

.ig-total {
	font-family: var(--ig-font-display);
	font-size: clamp(24px, 3vw, 44px);
	font-weight: 900;
	margin: 24px 0 0;
	text-align: right;
}

.ig-form-grid {
	display: grid;
	gap: 0;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ig-fieldset {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	gap: 14px;
	margin: 0 -1.5px -1.5px 0;
	padding: 24px;
}

.ig-fieldset legend {
	background: var(--ig-ink);
	color: var(--ig-paper);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: var(--ig-tracking-eyebrow);
	margin: 0 0 4px;
	padding: 4px 10px;
	text-transform: uppercase;
}

.ig-fieldset label {
	display: grid;
	gap: 6px;
}

.ig-fieldset label > span {
	color: var(--ig-ink);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ig-fieldset input[type="text"],
.ig-fieldset input[type="email"],
.ig-fieldset input[type="tel"],
.ig-fieldset input:not([type]),
.ig-fieldset select {
	background: var(--ig-bone);
	border: var(--ig-stroke) solid var(--ig-line);
	border-radius: 0;
	font-family: var(--ig-font-mono);
	font-size: 16px;
	min-height: 44px;
	padding: 0 12px;
	width: 100%;
}

.ig-fieldset label.ig-span-2 {
	grid-column: span 2;
}

/* Cégadatok toggle a számlázási címben — sárga sáv checkboxxal. */
.ig-billing-toggle {
	align-items: center;
	background: var(--ig-bone);
	border: var(--ig-stroke) solid var(--ig-line);
	cursor: pointer;
	display: flex !important;
	gap: 12px;
	grid-column: span 2;
	padding: 12px 14px;
	transition: background 0.15s ease;
}

.ig-billing-toggle:hover {
	background: var(--ig-accent);
}

.ig-billing-toggle input[type="checkbox"] {
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	accent-color: var(--ig-ink);
	cursor: pointer;
}

.ig-billing-toggle > span {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Cégadatok panel — animált nyit/csuk a CSS Grid 0fr → 1fr trükkel.
   Akkor sem ugrik a layout, ha a böngésző nem támogatja az animációt. */
.ig-billing-company {
	display: grid;
	grid-template-rows: 0fr;
	overflow: hidden;
	transition: grid-template-rows 0.32s ease, opacity 0.25s ease, margin-top 0.32s ease;
	opacity: 0;
	margin-top: 0;
}

.ig-billing-company.is-open {
	grid-template-rows: 1fr;
	opacity: 1;
}

.ig-billing-company__inner {
	min-height: 0;
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 640px) {
	.ig-billing-company__inner {
		grid-template-columns: 1fr;
	}
}

.ig-shipping-toggle {
	background: var(--ig-bone);
	border: var(--ig-stroke) solid var(--ig-line);
	grid-column: span 2;
	padding: 18px 22px;
}

.ig-shipping-toggle label {
	align-items: center;
	cursor: pointer;
	display: flex;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
	gap: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.ig-shipping-toggle input[type="checkbox"] {
	accent-color: var(--ig-accent);
	height: 20px;
	width: 20px;
}

.ig-shipping-block {
	grid-column: span 2;
}

.ig-shipping-block[hidden] {
	display: none;
}

.ig-error,
.ig-notice {
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	border-radius: 0;
	font-family: var(--ig-font-mono);
	margin: 0 0 18px;
	padding: 14px 18px;
}

.ig-error {
	background: var(--ig-danger);
	border-color: var(--ig-danger);
	color: var(--ig-paper);
}

.ig-notice strong {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	padding: 0 6px;
}

/* ==========================================================================
   Single product
   ========================================================================== */

/* ==========================================================================
   Single product page (new)
   ========================================================================== */

.ig-product-page {
	padding-top: 32px;
	padding-bottom: 96px;
}

.ig-product-page__head {
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	margin-bottom: 40px;
	padding-bottom: 32px;
}

.ig-product-page__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 18px;
}

.ig-product-page__brand {
	background: var(--ig-ink);
	color: var(--ig-paper);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.12em;
	padding: 6px 10px;
	text-transform: uppercase;
}

.ig-product-page__cat {
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-ink);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.08em;
	padding: 6px 10px;
	text-transform: uppercase;
	transition: background 120ms ease, color 120ms ease;
}

.ig-product-page__cat:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-product-page__head h1 {
	font-size: clamp(34px, 5vw, 64px);
	line-height: 1;
	margin: 0 0 14px;
}

.ig-product-page__sku {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 13px;
	letter-spacing: 0.04em;
	margin: 0 0 18px;
	text-transform: uppercase;
}

.ig-product-page__sku strong {
	color: var(--ig-ink);
	font-weight: 700;
}

.ig-product-page__lead {
	font-family: var(--ig-font-display);
	font-size: clamp(16px, 1.4vw, 20px);
	font-weight: 500;
	line-height: 1.4;
	margin: 0;
	max-width: 60ch;
}

.ig-product-page__main {
	display: grid;
	gap: 0;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
}

.ig-product-page__media {
	border: var(--ig-stroke-bold) solid var(--ig-line);
	border-right: 0;
	padding: 24px;
}

.ig-product-page__hero {
	aspect-ratio: 4 / 3;
	background: var(--ig-paper);
	display: flex;
	margin-bottom: 16px;
	overflow: hidden;
}

.ig-product-page__hero img {
	height: 100%;
	object-fit: contain;
	width: 100%;
}

.ig-product-page__hero-zoom {
	background: transparent;
	border: 0;
	cursor: zoom-in;
	display: block;
	height: 100%;
	padding: 0;
	position: relative;
	width: 100%;
}

.ig-product-page__hero-icon {
	align-items: center;
	background: var(--ig-ink);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	bottom: 12px;
	color: var(--ig-paper);
	display: inline-flex;
	height: 40px;
	justify-content: center;
	pointer-events: none;
	position: absolute;
	right: 12px;
	transition: background 160ms ease, color 160ms ease;
	width: 40px;
}

.ig-product-page__hero-icon svg {
	height: 22px;
	width: 22px;
}

.ig-product-page__hero-zoom:hover .ig-product-page__hero-icon {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

/* ==========================================================================
   Image lightbox
   ========================================================================== */

.ig-lightbox {
	background: rgba(8, 8, 8, 0.97);
	bottom: 0;
	display: flex;
	left: 0;
	opacity: 0;
	position: fixed;
	right: 0;
	top: 0;
	transition: opacity 220ms ease;
	z-index: 10000;
}

.ig-lightbox[hidden] { display: none; }

.ig-lightbox.is-open {
	opacity: 1;
}

.ig-lightbox__close,
.ig-lightbox__nav {
	align-items: center;
	background: transparent;
	border: 0;
	color: var(--ig-paper);
	cursor: pointer;
	display: inline-flex;
	height: 56px;
	justify-content: center;
	padding: 0;
	position: absolute;
	transition: background 160ms ease, color 160ms ease;
	width: 56px;
	z-index: 2;
}

.ig-lightbox__close {
	right: 16px;
	top: 16px;
}

.ig-lightbox__close svg,
.ig-lightbox__nav svg {
	height: 28px;
	width: 28px;
}

.ig-lightbox__close:hover,
.ig-lightbox__nav:hover {
	background: rgba(255, 255, 255, 0.12);
	color: var(--ig-accent);
}

.ig-lightbox__nav {
	top: 50%;
	transform: translateY(-50%);
}

.ig-lightbox__nav--prev { left: 16px; }
.ig-lightbox__nav--next { right: 16px; }

.ig-lightbox__nav[hidden] { display: none; }

.ig-lightbox__stage {
	align-items: center;
	display: flex;
	flex: 1;
	justify-content: center;
	padding: 64px 16px;
	touch-action: pinch-zoom;
}

.ig-lightbox__stage img {
	background: var(--ig-paper);
	max-height: 100%;
	max-width: 100%;
	object-fit: contain;
	user-select: none;
	-webkit-user-drag: none;
}

.ig-lightbox__counter {
	bottom: 18px;
	color: rgba(255, 255, 255, 0.65);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	left: 50%;
	letter-spacing: 0.12em;
	position: absolute;
	text-transform: uppercase;
	transform: translateX(-50%);
}

@media (max-width: 640px) {
	.ig-lightbox__nav { display: none; }
	.ig-lightbox__stage { padding: 48px 8px; }
}

.ig-product-page__hero .ig-product-card__placeholder {
	color: var(--ig-muted);
	font-family: var(--ig-font-display);
	font-size: 80px;
	font-weight: 900;
	margin: auto;
}

.ig-product-page__thumbs {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	list-style: none;
	margin: 0;
	padding: 0;
}

.ig-product-page__thumbs button {
	aspect-ratio: 1;
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	cursor: pointer;
	display: flex;
	overflow: hidden;
	padding: 0;
	transition: border-color 160ms ease, transform 160ms ease;
	width: 100%;
}

.ig-product-page__thumbs button:hover {
	transform: translateY(-2px);
}

.ig-product-page__thumbs button.is-active {
	border: var(--ig-stroke-bold) solid var(--ig-accent-ink);
	box-shadow: inset 0 0 0 3px var(--ig-accent);
}

.ig-product-page__thumbs img {
	height: 100%;
	object-fit: contain;
	width: 100%;
}

.ig-product-page__thumbs button.ig-thumb--video {
	background: #0a0a0a;
	position: relative;
}

.ig-product-page__thumbs button.ig-thumb--video img {
	object-fit: cover;
	opacity: 0.7;
}

.ig-product-page__thumbs button.ig-thumb--video .ig-thumb--video-bg {
	background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);
	display: block;
	height: 100%;
	width: 100%;
}

.ig-thumb__play {
	align-items: center;
	background: var(--ig-accent);
	border: 2px solid #0a0a0a;
	color: #fff;
	display: flex;
	font-size: 14px;
	font-weight: 800;
	height: 28px;
	justify-content: center;
	left: 50%;
	padding-left: 3px;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 28px;
}

/* Video iframe inside the hero slot */
.ig-product-page__video-frame {
	background: #0a0a0a;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}

.ig-product-page__video-frame[hidden] {
	display: none;
}

.ig-product-page__video-frame iframe {
	border: 0;
	display: block;
	height: 100%;
	width: 100%;
}

/* The hero slot must be position:relative for the video frame overlay */
.ig-product-page__hero {
	position: relative;
}

/* Spotlight: when the video is playing, lift the hero above the page-wide
   overlay so the iframe stands out. The overlay itself fades in over 0.5s. */
.ig-product-page__hero.is-video {
	box-shadow: 0 0 0 4px var(--ig-accent), 0 24px 80px rgba(0, 0, 0, 0.55);
	z-index: 81;
}

.ig-video-overlay {
	background: rgba(10, 10, 10, 0.78);
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: fixed;
	transition: opacity 500ms ease;
	z-index: 80;
}

.ig-video-overlay.is-on {
	opacity: 1;
	pointer-events: auto;
}

html.ig-video-playing {
	overflow: hidden;
}

/* ===================================================================== */
/* Product documents (manuals, datasheets, etc.)                          */
/* ===================================================================== */

.ig-product-page__docs {
	border-top: var(--ig-stroke-bold) solid var(--ig-line);
	margin-top: 48px;
	padding-top: 32px;
}

.ig-product-page__docs-head h2 {
	font-family: var(--ig-font-display);
	font-size: clamp(28px, 4vw, 44px);
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 1;
	margin: 4px 0 24px;
}

.ig-docs-list {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

.ig-doc-card {
	align-items: stretch;
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	box-shadow: 4px 4px 0 var(--ig-ink);
	color: var(--ig-ink);
	display: grid;
	gap: 0;
	grid-template-columns: 72px 1fr auto;
	min-height: 88px;
	text-decoration: none;
	transition: box-shadow 140ms ease, transform 140ms ease;
}

.ig-doc-card:hover,
.ig-doc-card:focus-visible {
	box-shadow: 8px 8px 0 var(--ig-ink);
	outline: 0;
	transform: translate(-2px, -2px);
}

.ig-doc-card__icon {
	align-items: center;
	background: var(--ig-ink);
	border-right: var(--ig-stroke-bold) solid var(--ig-line);
	color: var(--ig-paper);
	display: flex;
	flex-direction: column;
	font-family: var(--ig-font-mono);
	gap: 4px;
	justify-content: center;
	padding: 10px 6px;
}

.ig-doc-card__icon svg {
	display: block;
	height: 28px;
	width: 22px;
}

.ig-doc-card__ext {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: 0.06em;
	line-height: 1;
	padding: 3px 6px;
}

.ig-doc-card__body {
	align-self: center;
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	padding: 14px 18px;
}

.ig-doc-card__title {
	color: var(--ig-ink);
	font-family: var(--ig-font-display);
	font-size: 16px;
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.25;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ig-doc-card__meta {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ig-doc-card__cta {
	align-items: center;
	background: var(--ig-accent);
	border-left: var(--ig-stroke-bold) solid var(--ig-line);
	color: var(--ig-accent-ink);
	display: flex;
	flex-direction: column;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 800;
	gap: 4px;
	justify-content: center;
	letter-spacing: 0.08em;
	min-width: 92px;
	padding: 12px 14px;
	text-align: center;
	text-transform: uppercase;
	transition: background 140ms ease, color 140ms ease;
}

.ig-doc-card__cta svg {
	display: block;
	height: 22px;
	width: 22px;
}

.ig-doc-card:hover .ig-doc-card__cta,
.ig-doc-card:focus-visible .ig-doc-card__cta {
	background: var(--ig-ink);
	color: var(--ig-accent);
}

@media (max-width: 480px) {
	.ig-doc-card {
		grid-template-columns: 56px 1fr auto;
		min-height: 72px;
	}
	.ig-doc-card__cta {
		min-width: 72px;
		padding: 10px 8px;
	}
	.ig-doc-card__cta span:not(:only-child) {
		display: none;
	}
}

/* ===================================================================== */
/* Admin: product documents repeater                                       */
/* ===================================================================== */

.inv-docs {
	display: grid;
	gap: 10px;
}

.inv-doc-row {
	background: #fff;
	border: 2px solid #0a0a0a;
	display: grid;
	gap: 10px;
	padding: 12px 14px;
}

.inv-doc-row__file {
	align-items: center;
	display: flex;
	gap: 12px;
}

.inv-doc-row__name {
	flex: 1;
	font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
	font-size: 13px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.inv-doc-row__title {
	display: grid;
	gap: 4px;
}

.inv-doc-row__title > span {
	color: #555;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.inv-doc-row__title input {
	border: 2px solid #0a0a0a;
	border-radius: 0;
	box-shadow: none;
	padding: 6px 10px;
	width: 100%;
}

.ig-product-page__buy {
	background: var(--ig-bone);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	padding: 28px;
}

.ig-product-page__buybox {
	display: grid;
	gap: 12px;
	position: sticky;
	top: 96px;
}

.ig-product-page__discount-tag {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	display: inline-block;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.12em;
	margin: 0;
	padding: 4px 10px;
	text-transform: uppercase;
	width: max-content;
}

.ig-product-page__original {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 16px;
	margin: 0;
}

.ig-product-page__original del {
	text-decoration-thickness: 2px;
}

.ig-product-page__price {
	font-family: var(--ig-font-display);
	font-size: clamp(34px, 4vw, 56px);
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 1;
	margin: 0;
}

.ig-product-page__priceinfo {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.06em;
	margin: 0 0 4px;
	text-transform: uppercase;
}

.ig-product-page__vatchip {
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-ink);
	margin-left: 6px;
	padding: 1px 6px;
}

.ig-product-page__stock {
	align-items: center;
	display: flex;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
	gap: 8px;
	letter-spacing: 0.04em;
	margin: 4px 0;
	text-transform: uppercase;
}

.ig-product-page__dot {
	border-radius: 50%;
	display: inline-block;
	height: 10px;
	width: 10px;
}

.ig-product-page__stock.is-stock-in   { color: var(--ig-ok); }
.ig-product-page__stock.is-stock-in   .ig-product-page__dot { background: var(--ig-ok); }
.ig-product-page__stock.is-stock-low  { color: #b78600; }
.ig-product-page__stock.is-stock-low  .ig-product-page__dot { background: #f5b800; }
.ig-product-page__stock.is-stock-last { background: #f5b800; color: var(--ig-ink); padding: 6px 10px; }
.ig-product-page__stock.is-stock-last .ig-product-page__dot { background: var(--ig-ink); }
.ig-product-page__stock.is-stock-oos  { color: var(--ig-danger); }
.ig-product-page__stock.is-stock-oos  .ig-product-page__dot { background: var(--ig-danger); }

.ig-product-page__form {
	align-items: stretch;
	display: grid;
	gap: 10px;
	grid-template-columns: auto 1fr;
}

.ig-qty--large {
	background: var(--ig-paper);
}

.ig-qty--large .ig-qty__btn,
.ig-qty--large .ig-qty__input {
	min-height: 52px;
}

.ig-qty--large .ig-qty__btn {
	width: 52px;
}

.ig-product-page__cart {
	min-height: 52px;
	width: 100%;
}

.ig-product-page__notify {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.04em;
	margin: 0;
	text-transform: uppercase;
}

.ig-product-page__perks {
	border-top: var(--ig-stroke) solid var(--ig-line);
	display: grid;
	gap: 8px;
	list-style: none;
	margin: 16px 0 0;
	padding: 16px 0 0;
}

.ig-product-page__perks li {
	align-items: center;
	color: var(--ig-ink);
	display: flex;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	gap: 10px;
	letter-spacing: 0.02em;
}

.ig-product-page__perks li span {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	display: inline-flex;
	flex: 0 0 auto;
	font-size: 12px;
	font-weight: 800;
	height: 22px;
	justify-content: center;
	align-items: center;
	width: 22px;
}

.ig-product-page__details {
	border: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	gap: 0;
	grid-template-columns: 1fr;
	margin-top: 0;
}

.ig-product-page__description {
	padding: 32px;
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
}

.ig-product-page__description:last-child {
	border-bottom: 0;
}

.ig-product-page__description h2,
.ig-product-page__attrs h2 {
	font-size: 14px;
	letter-spacing: var(--ig-tracking-eyebrow);
	margin: 0 0 18px;
}

.ig-product-page__description p {
	font-size: 16px;
	line-height: 1.6;
	max-width: 64ch;
}

.ig-product-page__attrs {
	padding: 32px;
}

.ig-product-page__attrs .ig-spec-grid {
	margin-top: 0;
}

.ig-product-page__related {
	margin-top: 64px;
}

@media (max-width: 1080px) {
	.ig-product-page__main {
		grid-template-columns: 1fr;
	}

	.ig-product-page__media {
		border-right: var(--ig-stroke-bold) solid var(--ig-line);
		border-bottom: 0;
	}

	.ig-product-page__buy {
		border-top: 0;
	}

	.ig-product-page__buybox {
		position: static;
	}

	.ig-product-page__description {
		padding: 24px 20px;
	}

	.ig-product-page__attrs {
		padding: 24px 20px;
	}
}

.ig-product-single {
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	gap: 0;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
}

.ig-product-single__media {
	background: var(--ig-bone);
	border-right: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	gap: 12px;
	padding: 32px;
}

.ig-product-single__hero {
	aspect-ratio: 4 / 3;
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	display: flex;
	overflow: hidden;
}

.ig-product-single__hero img {
	height: 100%;
	object-fit: contain;
	width: 100%;
}

.ig-product-single__thumbs {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(5, minmax(0, 1fr));
}

.ig-product-single__thumbs a {
	aspect-ratio: 1;
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	display: flex;
}

.ig-product-single__thumbs img {
	height: 100%;
	object-fit: contain;
	width: 100%;
}

.ig-product-single__body {
	padding: 40px var(--ig-gutter-x);
}

.ig-product-single__body h1 {
	font-size: clamp(32px, 4vw, 60px);
	margin: 8px 0 16px;
}

.ig-product-single__brand {
	background: var(--ig-ink);
	color: var(--ig-paper);
	display: inline-block;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.12em;
	margin-bottom: 18px;
	padding: 4px 8px;
	text-transform: uppercase;
}

.ig-buy-box {
	align-items: center;
	border: var(--ig-stroke-bold) solid var(--ig-line);
	display: flex;
	gap: 0;
	margin: 24px 0;
}

.ig-buy-box input {
	border: 0;
	border-right: var(--ig-stroke) solid var(--ig-line);
	font-family: var(--ig-font-mono);
	font-size: 16px;
	font-weight: 700;
	min-height: 56px;
	padding: 0 14px;
	width: 90px;
}

.ig-buy-box .ig-button {
	border: 0;
	flex: 1;
	min-height: 56px;
}

.ig-price--large {
	font-family: var(--ig-font-display);
	font-size: clamp(40px, 4vw, 64px);
	font-weight: 900;
	letter-spacing: -0.02em;
	margin: 0;
}

.ig-price--large small {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Product specification list — 1 attribute per row, label left / value right */
.ig-spec-grid {
	display: flex;
	flex-direction: column;
	border: var(--ig-stroke-bold) solid var(--ig-line);
	margin: 32px 0 0;
	padding: 0;
	background: var(--ig-paper);
}

.ig-spec {
	display: grid;
	grid-template-columns: minmax(180px, 0.35fr) minmax(0, 1fr);
	align-items: stretch;
	background: var(--ig-paper);
	margin: 0;
	border-bottom: var(--ig-stroke) solid var(--ig-line);
	transition: background-color 0.15s ease;
}

.ig-spec:last-child {
	border-bottom: 0;
}

.ig-spec:hover {
	background: var(--ig-bone);
}

.ig-spec dt {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ig-ink);
	font-weight: 700;
	padding: 14px 18px;
	background: var(--ig-bone);
	border-right: var(--ig-stroke) solid var(--ig-line);
	display: flex;
	align-items: center;
}

.ig-spec dd {
	margin: 0;
	font-family: var(--ig-font-mono);
	font-size: 14px;
	line-height: 1.45;
	color: var(--ig-ink);
	font-weight: 500;
	word-break: break-word;
	padding: 14px 18px;
	display: flex;
	align-items: center;
}

@media (max-width: 640px) {
	.ig-spec {
		grid-template-columns: 1fr;
	}

	.ig-spec dt {
		border-right: 0;
		border-bottom: var(--ig-stroke) solid var(--ig-line);
		padding: 10px 14px;
	}

	.ig-spec dd {
		padding: 12px 14px;
		font-size: 14px;
	}
}

/* ==========================================================================
   Checkout
   ========================================================================== */

.ig-checkout {
	padding-top: clamp(40px, 5vw, 80px);
	padding-bottom: clamp(56px, 7vw, 112px);
}

.ig-checkout__success {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	margin: 24px 0 0;
	padding: clamp(28px, 4vw, 56px);
}

.ig-checkout__success h2 {
	font-family: var(--ig-font-display);
	font-size: clamp(28px, 4vw, 48px);
	font-weight: 900;
	letter-spacing: -0.02em;
	margin: 8px 0 20px;
	text-transform: uppercase;
}

.ig-checkout__success code {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	font-weight: 700;
	padding: 2px 8px;
}

.ig-checkout__layout {
	display: grid;
	gap: clamp(24px, 3vw, 48px);
	grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
	margin-top: clamp(24px, 3vw, 40px);
}

.ig-checkout__main {
	display: grid;
	gap: clamp(20px, 2.5vw, 36px);
	min-width: 0;
}

.ig-checkout__step {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	padding: clamp(20px, 2.5vw, 32px);
}

.ig-checkout__step-head {
	align-items: baseline;
	display: flex;
	gap: 14px;
	margin-bottom: 18px;
}

.ig-checkout__step-num {
	background: var(--ig-ink);
	color: var(--ig-paper);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.06em;
	padding: 4px 8px;
}

.ig-checkout__step h2 {
	font-family: var(--ig-font-display);
	font-size: clamp(20px, 2vw, 28px);
	font-weight: 900;
	letter-spacing: -0.01em;
	margin: 0;
	text-transform: uppercase;
}

.ig-checkout__notes summary {
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	padding: 12px 14px;
	background: #f3f3f1;
	border: 2px dashed var(--ig-line);
	text-transform: uppercase;
	transition: background 0.15s;
}
.ig-checkout__notes summary:hover { background: #E8FF00; }
.ig-checkout__notes[open] summary { background: #E8FF00; }
.ig-checkout__notes-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	margin-top: 14px;
}
.ig-checkout__notes-field { display: flex; flex-direction: column; gap: 4px; }
.ig-checkout__notes-field--full { grid-column: 1 / -1; }
.ig-checkout__notes-field span { font-weight: 700; font-size: 14px; }
.ig-checkout__notes-field small { color: #6B6B6B; font-size: 11px; }
.ig-checkout__notes-field input,
.ig-checkout__notes-field textarea {
	border: 2px solid var(--ig-line);
	background: var(--ig-paper);
	padding: 8px 10px;
	font: inherit;
	width: 100%;
}
@media (max-width: 640px) {
	.ig-checkout__notes-grid { grid-template-columns: 1fr; }
}
.ig-account-order__notes {
	margin-top: 18px;
	padding: 14px 16px;
	border: 2px solid var(--ig-line);
	background: #fafafa;
}
.ig-account-order__notes h3 {
	margin: 0 0 10px;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #6B6B6B;
}
.ig-account-order__notes-list {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 6px 14px;
	margin: 0;
}
.ig-account-order__notes-list dt {
	font-weight: 700;
	color: #444;
}
.ig-account-order__notes-list dd { margin: 0; }

.ig-product-page__relations { margin-top: 56px; }
.ig-rel-group { margin-top: 24px; }
.ig-rel-group__title {
	display: flex; align-items: center; gap: 12px;
	font-family: var(--ig-font-display); font-weight: 700;
	font-size: 18px; margin: 0 0 16px;
}
.ig-rel-group__badge {
	font-family: var(--ig-font-mono); font-size: 10px;
	letter-spacing: .08em; text-transform: uppercase;
	padding: 3px 8px; border: 2px solid var(--ig-line); color: var(--ig-ink);
}
.ig-rel-group--requires .ig-rel-group__badge { color: #fff; background: #b91c1c !important; border-color: #b91c1c; }

.ig-eta-list {
	list-style: none;
	margin: 14px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.ig-eta-line {
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--ig-ink);
}
.ig-eta-line__icon {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--ig-accent);
	color: var(--ig-accent-ink, var(--ig-ink));
	border: 2px solid var(--ig-ink);
}
.ig-eta-line__icon svg { width: 16px; height: 16px; display: block; }
.ig-eta-line__text {
	display: flex;
	flex-direction: column;
	gap: 1px;
	line-height: 1.2;
	min-width: 0;
}
.ig-eta-line__eyebrow {
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #6B6B6B;
	font-weight: 700;
}
.ig-eta-line__when {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.005em;
	color: var(--ig-ink);
}

.ig-tracking { margin: 24px 0; border: 3px solid var(--ig-line); background: var(--ig-paper); }
.ig-tracking__head { padding: 14px 18px; border-bottom: 2px solid var(--ig-line); }
.ig-tracking__head .ig-eyebrow { margin: 0 0 4px; }
.ig-tracking__title { margin: 0 0 4px; font-size: 20px; }
.ig-tracking__meta { margin: 0; color: var(--ig-muted, #6B6B6B); font-family: var(--ig-font-mono); font-size: 12px; }
.ig-tracking__map { background: #ddd; }
.ig-tracking__foot { display: flex; align-items: center; justify-content: space-between; padding: 12px 18px; border-top: 2px solid var(--ig-line); background: #f3f3f1; gap: 12px; flex-wrap: wrap; }
.ig-tracking__num code { background: var(--ig-paper); border: 1px solid var(--ig-line); padding: 2px 8px; font-family: var(--ig-font-mono); }

/* =========================================================================
   PROJECT WIZARD — mobile-first, site-width, slide transitions, no scroll-jump
   ========================================================================= */
.ig-page-head--wizard { background: var(--ig-paper); }
.ig-wiz-wrap { padding-top: 20px; padding-bottom: 80px; }
.ig-wiz {
	background: var(--ig-paper);
	border: 3px solid var(--ig-line);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

/* Sticky top progress + back */
.ig-wiz__top {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px clamp(16px, 3vw, 28px);
	border-bottom: 2px solid var(--ig-line);
	background: var(--ig-paper);
	position: sticky;
	top: 0;
	z-index: 5;
}
.ig-wiz__back {
	width: 44px; height: 44px;
	border: 2px solid var(--ig-line);
	background: var(--ig-paper);
	font-size: 20px;
	font-weight: 700;
	cursor: pointer;
	flex-shrink: 0;
	transition: background .15s;
}
.ig-wiz__back:hover { background: #E8FF00; }
.ig-wiz__back[hidden] { display: none; }
.ig-wiz__progress { flex: 1; display: flex; align-items: center; gap: 14px; }
.ig-wiz__progress-track {
	flex: 1;
	height: 8px;
	background: #f3f3f1;
	border: 2px solid var(--ig-line);
	overflow: hidden;
}
.ig-wiz__progress-fill {
	width: 16.66%; /* 1/6 */
	height: 100%;
	background: #E8FF00;
	transition: width .4s cubic-bezier(.4, 0, .2, 1);
}
.ig-wiz__progress-text {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
	color: #6B6B6B;
	min-width: 50px;
	text-align: right;
}
.ig-wiz__progress-text strong { color: var(--ig-ink); font-size: 18px; }

/* Viewport — keeps the wizard at a fixed-height feel, no page scroll-jump */
.ig-wiz__viewport {
	position: relative;
	min-height: 460px;
	overflow: hidden;
}
.ig-wiz__track { position: relative; }
.ig-wiz__step {
	position: absolute;
	inset: 0;
	padding: clamp(20px, 3vw, 36px) clamp(18px, 3.5vw, 40px);
	display: none;
	opacity: 0;
	transform: translateX(0);
}
.ig-wiz__step.is-active {
	display: flex;
	flex-direction: column;
	opacity: 1;
	animation: ig-wiz-fade-in .35s ease both;
}
.ig-wiz__step.is-entering-right { animation: ig-wiz-slide-in-right .35s cubic-bezier(.2, .8, .2, 1) both; }
.ig-wiz__step.is-entering-left  { animation: ig-wiz-slide-in-left  .35s cubic-bezier(.2, .8, .2, 1) both; }
.ig-wiz__step.is-leaving-left   { animation: ig-wiz-slide-out-left .25s ease-in both; }
.ig-wiz__step.is-leaving-right  { animation: ig-wiz-slide-out-right .25s ease-in both; }
.ig-wiz__step.is-shake          { animation: ig-wiz-shake .35s; }

@keyframes ig-wiz-fade-in       { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ig-wiz-slide-in-right{ from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: translateX(0); } }
@keyframes ig-wiz-slide-in-left { from { opacity: 0; transform: translateX(-40px); } to { opacity: 1; transform: translateX(0); } }
@keyframes ig-wiz-slide-out-left { from { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(-40px); } }
@keyframes ig-wiz-slide-out-right { from { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(40px); } }
@keyframes ig-wiz-shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-8px); } 75% { transform: translateX(8px); } }

.ig-wiz__step-head { margin-bottom: 22px; }
.ig-wiz__step-num {
	margin: 0 0 4px;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: .14em;
	color: #6B6B6B;
	text-transform: uppercase;
}
.ig-wiz__step-title {
	margin: 0 0 6px;
	font-family: var(--ig-font-display);
	font-size: clamp(22px, 3vw, 32px);
	font-weight: 900;
	letter-spacing: -0.015em;
	line-height: 1.1;
}
.ig-wiz__step-hint {
	margin: 0;
	color: #6B6B6B;
	font-size: 14px;
	max-width: 56ch;
}

/* Options grid — mobile-first single col → up to 5 on desktop */
.ig-wiz__opts {
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}
@media (min-width: 540px) {
	.ig-wiz__opts { grid-template-columns: 1fr 1fr; gap: 12px; }
	.ig-wiz__opts--wide { grid-template-columns: 1fr 1fr 1fr; }
}
@media (min-width: 880px) {
	.ig-wiz__opts--medium { grid-template-columns: 1fr 1fr 1fr; }
	.ig-wiz__opts--wide   { grid-template-columns: repeat(5, 1fr); }
}

/* Single option — big, touch-friendly */
.ig-wiz__opt {
	display: grid;
	grid-template-columns: 44px 1fr 22px;
	align-items: center;
	gap: 12px;
	padding: 16px 18px;
	background: var(--ig-paper);
	border: 2px solid var(--ig-line);
	cursor: pointer;
	user-select: none;
	min-height: 64px;
	transition: background .18s ease, transform .12s ease, box-shadow .18s ease;
	position: relative;
	font-weight: 600;
}
.ig-wiz__opt input { position: absolute; opacity: 0; pointer-events: none; }
.ig-wiz__opt-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: #f3f3f1;
	border: 2px solid var(--ig-line);
	border-radius: 50%;
	flex-shrink: 0;
	color: var(--ig-ink);
	transition: background .15s, transform .25s ease, color .15s;
}
.ig-wiz__opt-icon svg {
	width: 22px;
	height: 22px;
	display: block;
}
.ig-wiz__opt-text { display: flex; flex-direction: column; min-width: 0; gap: 2px; }
.ig-wiz__opt-label { font-size: 15px; font-weight: 700; letter-spacing: -0.005em; }
.ig-wiz__opt-sub   { font-size: 12px; color: #6B6B6B; font-family: var(--ig-font-mono); }
.ig-wiz__opt-check {
	width: 22px; height: 22px;
	border: 2px solid var(--ig-line);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 800;
	color: transparent;
	background: var(--ig-paper);
	transition: background .18s, color .18s;
	flex-shrink: 0;
}
.ig-wiz__opt:hover {
	background: #fafad9;
	transform: translateY(-1px);
	box-shadow: 4px 4px 0 0 var(--ig-line);
}
.ig-wiz__opt:has(input:checked) {
	background: #E8FF00;
	box-shadow: inset 0 0 0 3px var(--ig-line);
	transform: translateY(-1px);
}
.ig-wiz__opt:has(input:checked) .ig-wiz__opt-icon {
	background: var(--ig-paper);
	transform: scale(1.08) rotate(-4deg);
}
.ig-wiz__opt:has(input:checked) .ig-wiz__opt-check {
	background: var(--ig-ink);
	color: #E8FF00;
}
.ig-wiz__opt:has(input:checked) .ig-wiz__opt-sub { color: #444; }

/* Bottom nav */
.ig-wiz__nav {
	display: flex;
	gap: 10px;
	padding: 16px clamp(18px, 3vw, 28px);
	border-top: 2px solid var(--ig-line);
	background: #fafafa;
	flex-wrap: wrap;
	align-items: center;
}
.ig-wiz__nav .ig-button { min-width: 130px; }
.ig-wiz__nav [data-wiz-skip] {
	margin-right: auto;
	background: transparent;
	color: #6B6B6B;
	border-color: #ccc;
	font-size: 13px;
	min-width: 0;
	padding: 8px 14px;
}
.ig-wiz__nav [data-wiz-skip]:hover { color: var(--ig-ink); border-color: var(--ig-line); background: var(--ig-paper); }
.ig-wiz__nav [data-wiz-skip][hidden] { display: none; }
.ig-wiz__nav [data-wiz-next] { margin-left: auto; }
/* Erős override a [hidden] attribútumra — máskülönben a .ig-button explicit
   display: inline-block-ja továbbra is láthatóvá teszi a gombot, és pl. az
   utolsó lépésen mind a Tovább, mind a Csomag generálása megjelenne. */
.ig-wiz__nav [hidden] { display: none !important; }
.ig-wiz__submit {
	display: inline-flex !important;
	align-items: center;
	gap: 10px;
	margin-left: auto;
}
.ig-wiz__submit[hidden] { display: none !important; }
.ig-wiz__submit svg {
	width: 20px;
	height: 20px;
	color: currentColor;
	flex-shrink: 0;
	animation: ig-wiz-twinkle 2s ease-in-out infinite;
}
.ig-wiz__submit:hover svg {
	animation: ig-wiz-spin .6s ease-out;
}
@keyframes ig-wiz-twinkle {
	0%, 100% { transform: rotate(-6deg) scale(1);   opacity: 1; }
	50%      { transform: rotate(6deg)  scale(1.1); opacity: 0.85; }
}
@keyframes ig-wiz-spin {
	0%   { transform: rotate(-6deg); }
	50%  { transform: rotate(360deg) scale(1.2); }
	100% { transform: rotate(354deg); }
}

/* Loading screen */
.ig-wiz__loading {
	text-align: center;
	padding: clamp(40px, 8vw, 80px) 20px;
	background: var(--ig-paper);
	border: 3px solid var(--ig-line);
	margin-top: 20px;
}
.ig-spin {
	width: 64px; height: 64px;
	border: 6px solid var(--ig-line);
	border-top-color: transparent;
	border-radius: 50%;
	animation: ig-spin 1s linear infinite;
	margin: 0 auto 24px;
}
@keyframes ig-spin { to { transform: rotate(360deg); } }
.ig-wiz__loading-title { font-size: 18px; font-weight: 800; margin: 0 0 6px; }
.ig-wiz__loading-sub   { color: #6B6B6B; font-family: var(--ig-font-mono); font-size: 12px; margin: 0 0 24px; }
.ig-wiz__loading-steps {
	list-style: none; padding: 0; margin: 0 auto;
	max-width: 360px;
	display: flex; flex-direction: column; gap: 6px;
	text-align: left;
}
.ig-wiz__loading-steps li {
	padding: 8px 14px;
	background: #f3f3f1;
	border-left: 4px solid #ccc;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	color: #888;
	transition: background .3s, color .3s, border-color .3s;
}
.ig-wiz__loading-steps li.is-on   { background: #E8FF00; color: var(--ig-ink); border-left-color: var(--ig-ink); animation: ig-pulse 1.5s ease-in-out infinite; }
.ig-wiz__loading-steps li.is-done { background: var(--ig-paper); color: var(--ig-ink); border-left-color: #86efac; animation: none; }
.ig-wiz__loading-steps li.is-done::after { content: ' ✓'; color: #059669; font-weight: 800; }
@keyframes ig-pulse { 0%,100% { opacity: 1; } 50% { opacity: .65; } }

/* Result */
.ig-wiz__result { margin-top: 20px; }
.ig-wiz__error { padding: 18px 22px; background: #fee; border: 2px solid #b91c1c; color: #7f1d1d; font-weight: 600; }
.ig-wiz-result {
	background: var(--ig-paper);
	border: 3px solid var(--ig-line);
}
.ig-wiz-result__hero {
	background: #E8FF00;
	padding: clamp(20px, 4vw, 36px);
	border-bottom: 3px solid var(--ig-line);
}
.ig-wiz-result__title {
	margin: 6px 0 10px;
	font-family: var(--ig-font-display);
	font-size: clamp(24px, 4vw, 36px);
	font-weight: 900;
	letter-spacing: -0.02em;
}
.ig-wiz-result__intro { margin: 0; font-size: 15px; line-height: 1.55; max-width: 70ch; }
.ig-wiz-result__warning {
	padding: 14px 18px;
	background: #fff7cc;
	border-top: 2px solid var(--ig-line);
	border-bottom: 2px solid var(--ig-line);
}
.ig-wiz-result__warning strong {
	display: block;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	margin-bottom: 4px;
}
.ig-wiz-result__warning p { margin: 0; font-size: 14px; line-height: 1.5; }
.ig-wiz-result__items {
	list-style: none;
	padding: clamp(16px, 3vw, 28px);
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.ig-wiz-result__item {
	display: grid;
	grid-template-columns: 36px 96px 1fr;
	gap: 16px;
	padding: 14px;
	border: 2px solid var(--ig-line);
	background: var(--ig-paper);
	align-items: start;
}
.ig-wiz-result__idx {
	font-family: var(--ig-font-mono);
	font-weight: 800;
	font-size: 13px;
	color: #6B6B6B;
	padding-top: 4px;
}
.ig-wiz-result__thumb img {
	width: 96px; height: 96px; object-fit: cover;
	border: 1px solid var(--ig-line);
	display: block;
}
.ig-wiz-result__body { min-width: 0; }
.ig-wiz-result__name { margin: 0 0 6px; font-size: 17px; font-weight: 800; }
.ig-wiz-result__name a { color: var(--ig-ink); text-decoration: none; }
.ig-wiz-result__name a:hover { background: #E8FF00; }
.ig-wiz-result__why { margin: 0 0 8px; font-size: 13px; line-height: 1.45; color: #333; }
.ig-wiz-result__why-label { display: block; font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .14em; color: #6B6B6B; margin-bottom: 2px; }
.ig-wiz-result__pricing {
	margin: 0; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap;
	font-family: var(--ig-font-mono); font-size: 13px;
}
.ig-wiz-result__pricing .ig-wiz-result__times,
.ig-wiz-result__pricing .ig-wiz-result__eq { color: #6B6B6B; }
.ig-wiz-result__qty  { font-weight: 800; padding: 2px 8px; background: var(--ig-ink); color: var(--ig-paper); }
.ig-wiz-result__line { font-size: 14px; font-weight: 900; }

.ig-wiz-result__total {
	display: flex; justify-content: space-between; align-items: center;
	padding: 18px clamp(18px, 3vw, 28px);
	background: var(--ig-ink); color: var(--ig-paper);
}
.ig-wiz-result__total-label { font-family: var(--ig-font-mono); font-size: 13px; letter-spacing: .1em; }
.ig-wiz-result__total-amount { font-size: clamp(22px, 3.5vw, 30px); font-weight: 900; letter-spacing: -0.01em; }
.ig-wiz-result__cta {
	display: flex; gap: 10px; flex-wrap: wrap;
	padding: 16px clamp(18px, 3vw, 28px);
	background: #fafafa;
	border-top: 2px solid var(--ig-line);
}
.ig-wiz-result__addall { font-size: 16px !important; padding: 12px 22px !important; }
.ig-wiz-result__cta .ig-button {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}
.ig-wiz-result__cta-icon {
	width: 20px;
	height: 20px;
	color: currentColor;
	flex-shrink: 0;
	transition: transform .25s ease;
}
.ig-wiz-result__cta .ig-button:hover .ig-wiz-result__cta-icon {
	transform: translateX(-2px) scale(1.1);
}
.ig-wiz-result__cta .ig-button.ig-button--accent:hover .ig-wiz-result__cta-icon {
	animation: ig-wiz-cart-bounce .55s ease;
}
@keyframes ig-wiz-cart-bounce {
	0%, 100% { transform: translateY(0); }
	30%      { transform: translateY(-4px) rotate(-6deg); }
	60%      { transform: translateY(0) rotate(4deg); }
}
.ig-wiz-result__cta-arrow {
	margin-left: 4px;
	font-weight: 800;
	transition: transform .2s ease;
}
.ig-wiz-result__cta .ig-button:hover .ig-wiz-result__cta-arrow {
	transform: translateX(4px);
}

/* MOBILE: optimized layout */
@media (max-width: 540px) {
	.ig-wiz__viewport { min-height: 540px; }
	.ig-wiz__step { padding: 18px 16px; }
	.ig-wiz__step-title { font-size: 22px; }
	.ig-wiz__opt { grid-template-columns: 40px 1fr 20px; padding: 14px 14px; min-height: 60px; }
	.ig-wiz__opt-icon { width: 40px; height: 40px; font-size: 22px; }
	.ig-wiz__opt-label { font-size: 14px; }
	.ig-wiz__opt-sub   { font-size: 11px; }
	.ig-wiz__nav { padding: 14px 16px; }
	.ig-wiz__nav .ig-button { min-width: 0; flex: 1; }
	.ig-wiz__nav [data-wiz-next] { flex: 2; }
	.ig-wiz__nav [data-wiz-skip] { flex: 0 0 auto; }
	.ig-wiz__progress-text { font-size: 11px; }
	.ig-wiz__progress-text strong { font-size: 16px; }
	.ig-wiz-result__item { grid-template-columns: 24px 64px 1fr; gap: 10px; }
	.ig-wiz-result__thumb img { width: 64px; height: 64px; }
	.ig-wiz-result__name { font-size: 15px; }
	.ig-wiz-result__cta .ig-button { width: 100%; }
}

/* =========================================================================
   TELJESÍTMÉNY-KALKULÁTOR
   ========================================================================= */
.ig-calc-wrap { padding-top: 20px; padding-bottom: 80px; }
.ig-calc-tabs { display: flex; gap: 0; margin-bottom: -3px; flex-wrap: wrap; }
.ig-calc-tab {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 14px 22px; background: #f3f3f1;
	border: 3px solid var(--ig-line); border-bottom: 0;
	font-family: var(--ig-font-mono); font-size: 13px; font-weight: 700;
	letter-spacing: .04em; text-transform: uppercase; cursor: pointer;
	margin-right: -3px; position: relative;
}
.ig-calc-tab svg { width: 18px; height: 18px; }
.ig-calc-tab.is-active { background: var(--ig-accent); z-index: 2; }
.ig-calc-panel { display: none; }
.ig-calc-panel.is-active { display: block; }
.ig-calc-card {
	background: var(--ig-paper); border: 3px solid var(--ig-line);
	padding: clamp(20px, 3vw, 34px);
}
.ig-calc-card__title { margin: 0 0 6px; font-size: clamp(20px, 2.4vw, 28px); font-weight: 900; letter-spacing: -.01em; }
.ig-calc-card__hint  { margin: 0 0 22px; color: #6B6B6B; font-size: 14px; max-width: 68ch; }
.ig-calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ig-calc-field { display: flex; flex-direction: column; gap: 5px; }
.ig-calc-field > span { font-weight: 700; font-size: 14px; }
.ig-calc-field small { color: #6B6B6B; font-size: 11px; }
.ig-calc-field select,
.ig-calc-input { border: 2px solid var(--ig-line); background: var(--ig-paper); font: inherit; }
.ig-calc-field select { padding: 10px 12px; }
.ig-calc-input { display: flex; align-items: center; }
.ig-calc-input input { border: 0; background: transparent; padding: 10px 12px; font: inherit; width: 100%; -moz-appearance: textfield; }
.ig-calc-input i { font-style: normal; font-family: var(--ig-font-mono); font-weight: 700; padding: 0 12px; color: #6B6B6B; border-left: 2px solid #e5e5e5; align-self: stretch; display: flex; align-items: center; }
.ig-calc-check { display: flex; align-items: center; gap: 10px; margin-top: 18px; cursor: pointer; font-weight: 600; }
.ig-calc-check input { width: 20px; height: 20px; accent-color: var(--ig-ink); }

.ig-calc-verdict { margin-top: 24px; border: 3px solid var(--ig-line); }
.ig-calc-verdict__head { padding: 12px 18px; font-family: var(--ig-font-mono); font-weight: 800; letter-spacing: .08em; font-size: 14px; }
.ig-calc-verdict__head.is-ok   { background: #86efac; }
.ig-calc-verdict__head.is-warn { background: var(--ig-accent); }
.ig-calc-verdict__head.is-bad  { background: #fca5a5; }
.ig-calc-verdict__list { list-style: none; margin: 0; padding: 0; }
.ig-calc-verdict__list .vrow { display: grid; grid-template-columns: 32px 1fr; gap: 12px; padding: 14px 18px; border-top: 1px solid #eee; align-items: start; }
.ig-calc-verdict__list .vdot { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 800; border: 2px solid var(--ig-line); }
.ig-calc-verdict__list .vrow--ok   .vdot { background: #86efac; }
.ig-calc-verdict__list .vrow--warn .vdot { background: var(--ig-accent); }
.ig-calc-verdict__list .vrow--bad  .vdot { background: #fca5a5; }
.ig-calc-verdict__list strong { display: block; font-size: 15px; margin-bottom: 2px; }
.ig-calc-verdict__list p { margin: 0; font-size: 13px; line-height: 1.5; color: #333; }

.ig-calc-presets { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 18px; }
.ig-calc-presets__label { font-family: var(--ig-font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #6B6B6B; width: 100%; }
.ig-calc-preset { padding: 7px 12px; background: #f3f3f1; border: 2px solid var(--ig-line); font-size: 12px; cursor: pointer; transition: background .15s; }
.ig-calc-preset:hover { background: var(--ig-accent); }
.ig-calc-preset strong { font-family: var(--ig-font-mono); }

.ig-calc-rows { display: flex; flex-direction: column; gap: 8px; }
.ig-calc-row { display: grid; grid-template-columns: 1fr 120px 130px 40px; gap: 8px; align-items: center; }
.ig-calc-row__name { border: 2px solid var(--ig-line); padding: 9px 12px; font: inherit; }
.ig-calc-row__w { }
.ig-calc-row__qtybox { display: flex; border: 2px solid var(--ig-line); }
.ig-calc-row__qbtn { width: 32px; background: #f3f3f1; border: 0; font-size: 18px; font-weight: 700; cursor: pointer; }
.ig-calc-row__qbtn:hover { background: var(--ig-accent); }
.ig-calc-row__qty { width: 100%; border: 0; border-left: 2px solid var(--ig-line); border-right: 2px solid var(--ig-line); text-align: center; font: inherit; -moz-appearance: textfield; }
.ig-calc-row__del { width: 40px; height: 40px; background: var(--ig-paper); border: 2px solid #b91c1c; color: #b91c1c; font-weight: 700; cursor: pointer; }
.ig-calc-row__del:hover { background: #b91c1c; color: #fff; }
.ig-calc-addrow { display: inline-flex !important; align-items: center; gap: 8px; margin-top: 14px; }
.ig-calc-addrow svg { width: 16px; height: 16px; }

.ig-calc-power-result { margin-top: 24px; border: 3px solid var(--ig-line); }
.ig-calc-power-result__head { display: grid; grid-template-columns: repeat(3, 1fr); }
.ig-calc-power-result__head .prnum { padding: 18px; text-align: center; border-right: 2px solid var(--ig-line); }
.ig-calc-power-result__head .prnum:last-child { border-right: 0; }
.ig-calc-power-result__head .prnum span { display: block; font-size: clamp(24px, 4vw, 38px); font-weight: 900; letter-spacing: -.02em; line-height: 1; }
.ig-calc-power-result__head .prnum i { font-style: normal; font-family: var(--ig-font-mono); font-size: 11px; color: #6B6B6B; text-transform: uppercase; letter-spacing: .06em; }
.ig-calc-power-result__head .prnum--accent { background: var(--ig-accent); }
.ig-calc-power-result__head.is-warn { background: #fffbe6; }
.ig-calc-power-result__head.is-bad  { background: #fff1f1; }
.ig-calc-power-result__note { margin: 0; padding: 14px 18px; border-top: 2px solid var(--ig-line); font-size: 14px; line-height: 1.5; }
.ig-calc-power-result__fine { margin: 0; padding: 8px 18px 14px; font-family: var(--ig-font-mono); font-size: 11px; color: #6B6B6B; }
.ig-calc-disclaimer { margin: 22px 0 0; font-size: 12px; color: #6B6B6B; font-style: italic; }

@media (max-width: 600px) {
	.ig-calc-grid { grid-template-columns: 1fr; }
	.ig-calc-row { grid-template-columns: 1fr 1fr; grid-template-areas: "name name" "w qty" "del del"; }
	.ig-calc-row__name { grid-area: name; }
	.ig-calc-row__w { grid-area: w; }
	.ig-calc-row__qtybox { grid-area: qty; }
	.ig-calc-row__del { grid-area: del; width: 100%; }
	.ig-calc-power-result__head { grid-template-columns: 1fr; }
	.ig-calc-power-result__head .prnum { border-right: 0; border-bottom: 2px solid var(--ig-line); }
	.ig-calc-tab { flex: 1; justify-content: center; padding: 12px 10px; font-size: 11px; }
	.ig-calc-tab span { display: none; }
	.ig-calc-tab svg { width: 22px; height: 22px; }
}

/* =========================================================================
   SZÍNPAD-TERVEZŐ
   ========================================================================= */
.ig-stage-wrap { padding-top: 20px; padding-bottom: 80px; }
.ig-stage-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }
.ig-stage-toolbar .ig-button { font-size: 13px; padding: 9px 14px; }
.ig-stage-toolbar__spacer { flex: 1; }
.ig-stage-saved { font-family: var(--ig-font-mono); font-size: 12px; color: #059669; font-weight: 700; }
.ig-stage-layout { display: grid; grid-template-columns: 240px 1fr; gap: 16px; align-items: start; }
.ig-stage-palette { border: 3px solid var(--ig-line); background: var(--ig-paper); max-height: 640px; overflow-y: auto; }
.ig-stage-palette__group { border-bottom: 2px solid var(--ig-line); padding: 12px 14px; }
.ig-stage-palette__group:last-child { border-bottom: 0; }
.ig-stage-palette__title { margin: 0 0 10px; font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #6B6B6B; }
.ig-stage-palette__items { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ig-stage-pi { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 9px 4px; background: #f3f3f1; border: 2px solid var(--ig-line); cursor: pointer; transition: background .12s, transform .1s; text-align: center; }
.ig-stage-pi:hover { background: var(--ig-accent); transform: translateY(-1px); }
.ig-stage-pi__icon svg { width: 26px; height: 26px; }
.ig-stage-pi__label { font-size: 10px; font-weight: 600; line-height: 1.15; }
/* csoport-színek a paletta ikonjain */
.ig-stage-pi--hang .ig-stage-pi__icon    { color: #0a0a0a; }
.ig-stage-pi--mik .ig-stage-pi__icon     { color: #2563eb; }
.ig-stage-pi--eloadok .ig-stage-pi__icon { color: #b45309; }
.ig-stage-pi--feny .ig-stage-pi__icon    { color: #7c3aed; }
.ig-stage-pi--egyeb .ig-stage-pi__icon   { color: #6B6B6B; }

.ig-stage-canvas-wrap { min-width: 0; }
.ig-stage-canvas {
	position: relative; width: 100%; aspect-ratio: 16 / 10;
	background: var(--ig-paper);
	background-image: linear-gradient(#0000000d 1px, transparent 1px), linear-gradient(90deg, #0000000d 1px, transparent 1px);
	background-size: 5% 5%;
	border: 3px solid var(--ig-line);
	overflow: hidden; touch-action: none;
}
.ig-stage-canvas__back { position: absolute; top: 6px; left: 50%; transform: translateX(-50%); font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .14em; color: #bbb; pointer-events: none; }
.ig-stage-canvas__front { position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%); font-family: var(--ig-font-mono); font-size: 11px; letter-spacing: .12em; font-weight: 700; color: #0a0a0a; background: var(--ig-accent); padding: 2px 10px; pointer-events: none; }
.ig-stage-canvas__empty { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 60%; text-align: center; color: #aaa; font-size: 13px; pointer-events: none; margin: 0; }

.ig-stage-item { position: absolute; width: 78px; display: flex; flex-direction: column; align-items: center; gap: 2px; cursor: grab; user-select: none; touch-action: none; }
.ig-stage-item:active { cursor: grabbing; }
.ig-stage-item__rot { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: var(--ig-paper); border: 2px solid var(--ig-line); }
.ig-stage-item__icon svg { width: 30px; height: 30px; display: block; }
.ig-stage-item__label { font-size: 10px; font-weight: 700; text-align: center; line-height: 1.1; background: var(--ig-paper); padding: 1px 4px; border: 1px solid #ddd; max-width: 78px; }
.ig-stage-item--hang .ig-stage-item__icon    { color: #0a0a0a; }
.ig-stage-item--mik .ig-stage-item__icon     { color: #2563eb; }
.ig-stage-item--eloadok .ig-stage-item__icon { color: #b45309; }
.ig-stage-item--feny .ig-stage-item__icon    { color: #7c3aed; }
.ig-stage-item--egyeb .ig-stage-item__icon   { color: #6B6B6B; }
.ig-stage-item.is-selected .ig-stage-item__rot { border-color: var(--ig-accent); box-shadow: 0 0 0 3px var(--ig-accent); }
.ig-stage-item__tools { display: none; position: absolute; top: -14px; right: -14px; gap: 2px; }
.ig-stage-item.is-selected .ig-stage-item__tools { display: flex; }
.ig-stage-item__tool { width: 24px; height: 24px; border: 2px solid var(--ig-line); background: var(--ig-paper); font-size: 12px; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.ig-stage-item__tool:hover { background: var(--ig-accent); }
.ig-stage-item__tool--del:hover { background: #b91c1c; color: #fff; border-color: #b91c1c; }
.ig-stage-hint { margin: 10px 0 0; font-size: 12px; color: #6B6B6B; font-family: var(--ig-font-mono); }

@media (max-width: 780px) {
	.ig-stage-layout { grid-template-columns: 1fr; }
	.ig-stage-palette { max-height: none; order: 2; }
	.ig-stage-palette__items { grid-template-columns: repeat(4, 1fr); }
	.ig-stage-canvas-wrap { order: 1; }
}
@media (max-width: 480px) {
	.ig-stage-palette__items { grid-template-columns: repeat(3, 1fr); }
	.ig-stage-toolbar .ig-button { flex: 1; min-width: 0; font-size: 12px; padding: 9px 8px; }
}

/* Nyomtatás: csak a vászon látszik */
@media print {
	body * { visibility: hidden; }
	.ig-stage-canvas, .ig-stage-canvas * { visibility: visible; }
	.ig-stage-canvas { position: absolute; left: 0; top: 0; width: 100%; border-width: 2px; }
	[data-stage-noprint], .ig-stage-item__tools { display: none !important; }
}

/* =========================================================================
   JÁTÉKOK
   ========================================================================= */
.ig-games-hub { padding-top: 20px; padding-bottom: 80px; }
.ig-games-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ig-game-card {
	display: flex; flex-direction: column; gap: 6px;
	padding: clamp(22px, 3vw, 34px);
	background: var(--ig-paper); border: 3px solid var(--ig-line);
	color: var(--ig-ink); text-decoration: none;
	transition: transform .15s, box-shadow .15s, background .15s;
	position: relative; overflow: hidden;
}
.ig-game-card:hover { transform: translate(-2px,-2px); box-shadow: 6px 6px 0 0 var(--ig-line); background: #fafad9; }
.ig-game-card__icon { width: 56px; height: 56px; }
.ig-game-card__icon svg { width: 56px; height: 56px; }
.ig-game-card__tag { font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: #6B6B6B; margin-top: 6px; }
.ig-game-card__title { margin: 2px 0 4px; font-size: clamp(20px, 2.4vw, 26px); font-weight: 900; letter-spacing: -.01em; }
.ig-game-card__desc { margin: 0; font-size: 13px; color: #444; line-height: 1.5; flex: 1; }
.ig-game-card__cta { font-family: var(--ig-font-mono); font-weight: 700; font-size: 13px; margin-top: 10px; }
.ig-game-card:hover .ig-game-card__cta { color: #0a0a0a; }
.ig-game-card--gerjedes:hover { background: #fff0f0; }
.ig-game-card--beatpad:hover  { background: #f0f4ff; }
.ig-game-card--furgon:hover   { background: #fff8e6; }
.ig-game-card--decibel:hover  { background: #f0fff4; }

.ig-page-head--games { background: var(--ig-paper); }
.ig-games-back { margin: 4px 0 0; }
.ig-games-back a { font-family: var(--ig-font-mono); font-size: 13px; }
.ig-game-stage { padding-top: 24px; padding-bottom: 80px; }

/* --- Reflex --- */
.ig-rfx { max-width: 720px; margin: 0 auto; }
.ig-rfx__hud { display: flex; gap: 0; margin-bottom: 14px; }
.ig-rfx__stat { flex: 1; border: 3px solid var(--ig-line); margin-right: -3px; padding: 12px 16px; text-align: center; background: var(--ig-paper); }
.ig-rfx__stat span { display: block; font-size: clamp(22px, 3vw, 32px); font-weight: 900; line-height: 1; }
.ig-rfx__stat i { font-style: normal; font-family: var(--ig-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: #6B6B6B; }
.ig-rfx__stat--accent { background: var(--ig-accent); }
.ig-rfx__arena { position: relative; height: 420px; border: 3px solid var(--ig-line); background: #0a0a0a; overflow: hidden; }
.ig-rfx__msg { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 12px; padding: 24px; color: #fff; }
.ig-rfx__big { font-size: clamp(22px, 3vw, 30px); font-weight: 900; margin: 0; }
.ig-rfx__small { color: rgba(255,255,255,.7); margin: 0; max-width: 44ch; font-size: 14px; }
.ig-rfx__target {
	position: absolute; width: 150px; height: 64px;
	background: #b91c1c; color: #fff; border: 3px solid #fff;
	font-family: var(--ig-font-mono); font-weight: 900; font-size: 18px; letter-spacing: .04em;
	cursor: pointer; animation: ig-rfx-pulse .5s infinite alternate;
}
@keyframes ig-rfx-pulse { from { box-shadow: 0 0 0 0 rgba(185,28,28,.6); } to { box-shadow: 0 0 0 12px rgba(185,28,28,0); } }
.ig-rfx__flash { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-family: var(--ig-font-mono); font-size: 40px; font-weight: 900; color: var(--ig-accent); pointer-events: none; }
.ig-rfx__flash--bad { color: #fca5a5; font-size: 22px; }
.ig-rfx__result { margin-top: 16px; border: 3px solid var(--ig-line); padding: 22px; text-align: center; background: var(--ig-paper); }
.ig-rfx__result-head { font-family: var(--ig-font-mono); font-weight: 800; letter-spacing: .1em; }
.ig-rfx__result-head.is-record { color: #b45309; }
.ig-rfx__avg { font-size: clamp(40px, 8vw, 64px); font-weight: 900; line-height: 1; margin: 8px 0; }
.ig-rfx__avg small { font-size: 16px; font-weight: 600; color: #6B6B6B; }
.ig-rfx__rank { margin: 4px 0 14px; font-size: 15px; }
.ig-rfx__times { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; margin-bottom: 16px; }
.ig-rfx__times span { font-family: var(--ig-font-mono); font-size: 12px; padding: 4px 8px; background: #f3f3f1; border: 1px solid var(--ig-line); }
.ig-rfx__cta { display: flex; gap: 8px; justify-content: center; }

/* --- Beatpad --- */
.ig-bp { max-width: 720px; margin: 0 auto; }
.ig-bp__bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.ig-bp__btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border: 2px solid var(--ig-line); background: var(--ig-paper); font-family: var(--ig-font-mono); font-size: 12px; font-weight: 700; cursor: pointer; text-transform: uppercase; }
.ig-bp__btn:hover:not(:disabled) { background: var(--ig-accent); }
.ig-bp__btn:disabled { opacity: .4; cursor: not-allowed; }
.ig-bp__btn.is-on { background: #b91c1c; color: #fff; border-color: #b91c1c; }
.ig-bp__dot { width: 10px; height: 10px; border-radius: 50%; background: currentColor; display: inline-block; }
.ig-bp__hint { font-size: 12px; color: #6B6B6B; margin-left: auto; }
.ig-bp__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.ig-bp__pad {
	aspect-ratio: 1; border: 3px solid var(--ig-line); background: #0a0a0a; color: #fff;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
	cursor: pointer; position: relative; transition: transform .05s; user-select: none;
}
.ig-bp__pad:nth-child(4n+1) { background: #161616; }
.ig-bp__pad-key { font-family: var(--ig-font-mono); font-size: 11px; color: var(--ig-accent); border: 1px solid rgba(232,255,0,.4); padding: 1px 5px; }
.ig-bp__pad-label { font-family: var(--ig-font-mono); font-size: 11px; letter-spacing: .04em; }
.ig-bp__pad.is-hit { background: var(--ig-accent); color: #0a0a0a; transform: scale(.94); }
.ig-bp__pad.is-hit .ig-bp__pad-key { color: #0a0a0a; border-color: #0a0a0a; }

/* --- Van / Tetris --- */
.ig-van { max-width: 480px; margin: 0 auto; }
.ig-van__top { display: flex; gap: 14px; align-items: flex-start; justify-content: center; }
.ig-van__playfield { position: relative; border: 3px solid var(--ig-line); width: min(300px, 64vw); background: var(--ig-paper); flex-shrink: 0; }
.ig-van__roof { display: block; background: #0a0a0a; color: var(--ig-accent); font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .16em; text-align: center; padding: 5px; }
.ig-van__playfield canvas { display: block; width: 100%; height: auto; }
.ig-van__side { display: flex; flex-direction: column; gap: 10px; width: 130px; flex-shrink: 0; }
.ig-van__next { border: 3px solid var(--ig-line); background: var(--ig-paper); padding: 8px; text-align: center; }
.ig-van__next-label { display: block; font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: #6B6B6B; margin-bottom: 4px; }
.ig-van__next canvas { display: block; width: 100%; height: auto; }
.ig-van__stat { border: 3px solid var(--ig-line); padding: 10px; text-align: center; background: var(--ig-paper); }
.ig-van__stat span { display: block; font-size: 26px; font-weight: 900; line-height: 1; }
.ig-van__stat i { font-style: normal; font-family: var(--ig-font-mono); font-size: 10px; text-transform: uppercase; color: #6B6B6B; }
.ig-van__stat--accent { background: var(--ig-accent); }
.ig-van__overlay { position: absolute; inset: 0; background: rgba(10,10,10,.9); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 10px; padding: 20px; }
.ig-van__big { font-size: 24px; font-weight: 900; margin: 0; }
.ig-van__small { font-size: 13px; color: rgba(255,255,255,.7); margin: 0; max-width: 30ch; }
.ig-van__coupon { background: var(--ig-accent); color: #0a0a0a; padding: 8px 12px; font-size: 13px; font-weight: 700; }
.ig-van__coupon code { font-family: var(--ig-font-mono); }
.ig-van__controls { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; max-width: 340px; margin: 16px auto 0; }
.ig-van__ctrl { padding: 16px 0; border: 2px solid var(--ig-line); background: var(--ig-paper); font-size: 20px; font-weight: 700; cursor: pointer; }
.ig-van__ctrl:hover { background: var(--ig-accent); }
.ig-van__ctrl--drop { grid-column: 1 / -1; font-family: var(--ig-font-mono); font-size: 15px; }

/* --- Decibel --- */
.ig-db { max-width: 560px; margin: 0 auto; text-align: center; }
.ig-db__meterwrap { display: flex; gap: 14px; align-items: flex-end; justify-content: center; margin-bottom: 20px; }
.ig-db__meter { width: 80px; height: 280px; border: 3px solid var(--ig-line); background: #0a0a0a; display: flex; align-items: flex-end; overflow: hidden; }
.ig-db__fill { width: 100%; height: 0%; background: #86efac; transition: height .08s linear; }
.ig-db__scale { display: flex; flex-direction: column-reverse; justify-content: space-between; height: 280px; font-family: var(--ig-font-mono); font-size: 11px; color: #6B6B6B; }
.ig-db__readout { display: flex; flex-direction: column; justify-content: center; }
.ig-db__readout span { font-size: clamp(40px, 9vw, 72px); font-weight: 900; line-height: 1; }
.ig-db__readout i { font-style: normal; font-family: var(--ig-font-mono); font-size: 11px; color: #6B6B6B; text-transform: uppercase; }
.ig-db__panel { border: 3px solid var(--ig-line); padding: 24px; background: var(--ig-paper); }
.ig-db__big { font-size: clamp(20px, 3vw, 28px); font-weight: 900; margin: 0 0 6px; }
.ig-db__small { font-size: 14px; color: #444; margin: 0 0 16px; }
.ig-db__note { font-size: 11px; color: #6B6B6B; font-style: italic; margin: 14px 0 0; }
.ig-db__best { margin-top: 14px; font-family: var(--ig-font-mono); font-size: 13px; }
.ig-db__result { margin-top: 16px; border: 3px solid var(--ig-line); padding: 22px; background: var(--ig-paper); }
.ig-db__result-head { font-family: var(--ig-font-mono); font-weight: 800; letter-spacing: .1em; }
.ig-db__result-head.is-record { color: #b45309; }
.ig-db__peak { font-size: clamp(40px, 9vw, 64px); font-weight: 900; line-height: 1; margin: 8px 0; }
.ig-db__peak small { font-size: 18px; color: #6B6B6B; }
.ig-db__rank { margin: 4px 0 14px; font-size: 15px; }
.ig-db__cta { display: flex; gap: 8px; justify-content: center; }

/* --- Beatmatch ritmus-játék --- */
.ig-bm { max-width: 460px; margin: 0 auto; }
.ig-bm__select-title { text-align: center; font-size: 20px; font-weight: 900; margin: 0 0 16px; }
.ig-bm__tracks { display: flex; flex-direction: column; gap: 10px; }
.ig-bm__track { display: flex; flex-direction: column; gap: 3px; padding: 16px 18px; border: 3px solid var(--ig-line); background: var(--ig-paper); cursor: pointer; text-align: left; transition: background .12s, transform .1s; }
.ig-bm__track:hover { background: var(--ig-accent); transform: translateX(3px); }
.ig-bm__track-stars { font-family: var(--ig-font-mono); letter-spacing: .1em; color: #b45309; }
.ig-bm__track-name { font-size: 18px; font-weight: 900; }
.ig-bm__track-bpm { font-family: var(--ig-font-mono); font-size: 11px; color: #6B6B6B; text-transform: uppercase; letter-spacing: .06em; }
.ig-bm__help { margin: 16px 0 0; font-size: 12px; color: #6B6B6B; text-align: center; }

.ig-bm__hud { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ig-bm__hud-cell { border: 3px solid var(--ig-line); background: var(--ig-paper); padding: 8px 12px; text-align: center; min-width: 80px; }
.ig-bm__hud-cell span { display: block; font-size: 22px; font-weight: 900; line-height: 1; }
.ig-bm__hud-cell i { font-style: normal; font-family: var(--ig-font-mono); font-size: 9px; text-transform: uppercase; color: #6B6B6B; }
.ig-bm__life { flex: 1; height: 22px; border: 3px solid var(--ig-line); background: #0a0a0a; overflow: hidden; }
.ig-bm__life-fill { height: 100%; width: 100%; background: #86efac; transition: width .15s, background .2s; }

.ig-bm__stage { position: relative; border: 3px solid var(--ig-line); width: min(400px, 88vw); margin: 0 auto; }
.ig-bm__stage canvas { display: block; width: 100%; height: auto; }
.ig-bm__combo { position: absolute; top: 18%; left: 50%; transform: translateX(-50%); font-family: var(--ig-font-display); font-size: 44px; font-weight: 900; color: rgba(232,255,0,.9); pointer-events: none; text-shadow: 0 2px 0 #000; }
.ig-bm__judge { position: absolute; top: 56%; left: 50%; transform: translate(-50%,-50%) scale(.6); font-family: var(--ig-font-display); font-size: 30px; font-weight: 900; opacity: 0; transition: opacity .1s, transform .1s; pointer-events: none; text-shadow: 0 2px 0 #000; }
.ig-bm__judge.is-show { opacity: 1; transform: translate(-50%,-50%) scale(1); }
.ig-bm__judge--p { color: #E8FF00; }
.ig-bm__judge--g { color: #86efac; }
.ig-bm__count { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--ig-font-display); font-size: 72px; font-weight: 900; color: #fff; background: rgba(10,10,10,.5); pointer-events: none; }
.ig-bm__count--show { animation: ig-bm-count .7s ease; }
@keyframes ig-bm-count { 0% { transform: scale(1.6); opacity: 0; } 30% { opacity: 1; } 100% { transform: scale(.8); opacity: 0; } }

.ig-bm__lanes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; width: min(400px, 88vw); margin: 10px auto 0; }
.ig-bm__lane-btn { padding: 18px 0; border: 3px solid var(--ig-line); background: var(--ig-paper); font-family: var(--ig-font-mono); font-size: 20px; font-weight: 800; cursor: pointer; touch-action: manipulation; }
.ig-bm__lane-btn:nth-child(1) { border-bottom: 6px solid #E8FF00; }
.ig-bm__lane-btn:nth-child(2) { border-bottom: 6px solid #2563eb; }
.ig-bm__lane-btn:nth-child(3) { border-bottom: 6px solid #7c3aed; }
.ig-bm__lane-btn:nth-child(4) { border-bottom: 6px solid #b91c1c; }
.ig-bm__lane-btn.is-hit { background: var(--ig-accent); transform: translateY(2px); }
.ig-bm__gamebar { text-align: center; margin-top: 12px; }

.ig-bm__result { text-align: center; border: 3px solid var(--ig-line); background: var(--ig-paper); padding: 28px 22px; max-width: 460px; margin: 0 auto; }
.ig-bm__res-grade { font-family: var(--ig-font-display); font-size: 88px; font-weight: 900; line-height: 1; }
.ig-bm__res-grade--ok { color: #b45309; }
.ig-bm__res-grade--f { color: #b91c1c; }
.ig-bm__res-title { font-size: 18px; font-weight: 800; margin: 0 0 16px; }
.ig-bm__res-stats { display: flex; justify-content: center; gap: 0; margin-bottom: 12px; }
.ig-bm__res-stats div { flex: 1; border: 3px solid var(--ig-line); margin-right: -3px; padding: 10px; }
.ig-bm__res-stats span { display: block; font-size: 24px; font-weight: 900; line-height: 1; }
.ig-bm__res-stats i { font-style: normal; font-family: var(--ig-font-mono); font-size: 9px; text-transform: uppercase; color: #6B6B6B; }
.ig-bm__res-break { display: flex; justify-content: center; gap: 14px; font-family: var(--ig-font-mono); font-size: 12px; font-weight: 700; margin-bottom: 8px; }
.ig-bm__res-break .p { color: #b45309; }
.ig-bm__res-break .g { color: #059669; }
.ig-bm__res-break .m { color: #b91c1c; }
.ig-bm__res-cta { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-top: 6px; }

@media (max-width: 640px) {
	.ig-bm__hud-cell { min-width: 64px; padding: 7px 8px; }
	.ig-bm__hud-cell span { font-size: 18px; }
	.ig-bm__res-grade { font-size: 64px; }
	.ig-bm__res-cta { flex-direction: column; }
	.ig-bm__res-cta .ig-button { width: 100%; }
	.ig-bm__lane-btn { padding: 22px 0; }
}

/* --- FOH Hangmérnök --- */
.ig-foh { max-width: 560px; margin: 0 auto; position: relative; }
.ig-foh__hud { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.ig-foh__stat { border: 3px solid var(--ig-line); background: var(--ig-paper); padding: 8px 12px; text-align: center; min-width: 78px; }
.ig-foh__stat span { display: block; font-size: 22px; font-weight: 900; line-height: 1; }
.ig-foh__stat i { font-style: normal; font-family: var(--ig-font-mono); font-size: 9px; text-transform: uppercase; color: #6B6B6B; }
.ig-foh__health { flex: 1; position: relative; height: 40px; border: 3px solid var(--ig-line); background: #0a0a0a; overflow: hidden; }
.ig-foh__health-fill { height: 100%; width: 100%; background: #86efac; transition: width .15s linear, background .25s; }
.ig-foh__health-label { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--ig-font-mono); font-weight: 800; font-size: 12px; color: #0a0a0a; mix-blend-mode: difference; color: #fff; }
.ig-foh__console { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.ig-foh__ch { position: relative; aspect-ratio: 3/4; border: 3px solid var(--ig-line); background: var(--ig-paper); display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 10px 6px; cursor: pointer; touch-action: manipulation; overflow: hidden; }
.ig-foh__ch-led { width: 12px; height: 12px; border-radius: 50%; background: #cfcfcf; border: 2px solid var(--ig-line); }
.ig-foh__ch-prob { font-family: var(--ig-font-mono); font-size: 11px; font-weight: 800; text-align: center; line-height: 1.1; min-height: 26px; }
.ig-foh__ch-fader { width: 8px; flex: 1; background: #e5e5e5; border: 2px solid var(--ig-line); position: relative; margin: 6px 0; }
.ig-foh__ch-knob { position: absolute; left: -6px; right: -6px; height: 14px; background: var(--ig-line); top: 40%; }
.ig-foh__ch-name { font-family: var(--ig-font-mono); font-size: 10px; color: #6B6B6B; }
.ig-foh__ch.has-problem { animation: ig-foh-pulse .5s infinite alternate; }
.ig-foh__ch.has-problem .ig-foh__ch-led { background: #b91c1c; }
.ig-foh__ch.prob-fb { background: #fde2e2; } .ig-foh__ch.prob-fb .ig-foh__ch-prob { color:#b91c1c; }
.ig-foh__ch.prob-cl { background: #fff3d6; } .ig-foh__ch.prob-cl .ig-foh__ch-prob { color:#b45309; }
.ig-foh__ch.prob-mu { background: #e6e9ff; } .ig-foh__ch.prob-mu .ig-foh__ch-prob { color:#2563eb; }
.ig-foh__ch.prob-ba { background: #e6fff0; } .ig-foh__ch.prob-ba .ig-foh__ch-prob { color:#059669; }
.ig-foh__ch.is-fixed { background: #E8FF00; }
.ig-foh__ch.is-fixed .ig-foh__ch-prob { color: #0a0a0a; }
@keyframes ig-foh-pulse { from { box-shadow: inset 0 0 0 0 rgba(185,28,28,.0); } to { box-shadow: inset 0 0 0 4px rgba(185,28,28,.5); } }
.ig-foh__overlay { position: absolute; inset: 0; background: rgba(10,10,10,.92); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 12px; padding: 28px; z-index: 5; }
.ig-foh__big { font-size: 26px; font-weight: 900; margin: 0; }
.ig-foh__small { font-size: 13px; color: rgba(255,255,255,.7); margin: 0; max-width: 44ch; line-height: 1.5; }
.ig-foh__result { border: 3px solid var(--ig-line); background: var(--ig-paper); padding: 26px 22px; text-align: center; }
.ig-foh__res-head { font-family: var(--ig-font-mono); font-weight: 800; letter-spacing: .1em; color: #b91c1c; }
.ig-foh__res-score { font-size: clamp(40px,8vw,60px); font-weight: 900; line-height: 1; margin: 8px 0; }
.ig-foh__res-score small { font-size: 16px; color: #6B6B6B; }
.ig-foh__res-sub { margin: 0 0 14px; color: #444; }
.ig-foh__res-cta { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }

/* --- Rendezvény Tycoon — stabil, fix méretű layout (semmi nem méreteződik át) --- */
.ig-tyc { max-width: 100%; }
.ig-tyc, .ig-tyc input, .ig-tyc button { font-variant-numeric: tabular-nums; } /* azonos szélességű számjegyek → nincs ugrálás */
.ig-tyc__hud { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-bottom: 14px; }
.ig-tyc__stat { border: 3px solid var(--ig-line); margin-right: -3px; padding: 14px 10px; text-align: center; background: var(--ig-paper); overflow: hidden; }
.ig-tyc__stat:last-child { margin-right: 0; }
.ig-tyc__stat span { display: block; font-size: clamp(15px,1.8vw,22px); font-weight: 900; line-height: 1.05; white-space: nowrap; }
.ig-tyc__stat i { display: block; font-style: normal; font-family: var(--ig-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; color: #6B6B6B; margin-top: 5px; }
.ig-tyc__stat--cash { background: var(--ig-accent); }
.ig-tyc__stat--cash span.is-pop { animation: ig-tyc-pop .5s ease; }
.ig-tyc__stat--cash span.is-debt { color: #b91c1c; }
.ig-tyc__stat--opex span { color: #b91c1c; }
@keyframes ig-tyc-pop { 0% { transform: scale(1); } 35% { transform: scale(1.12); } 100% { transform: scale(1); } }

/* Piaci esemény-sáv — fix magasság, nincs ugrálás */
.ig-tyc__event { display: flex; align-items: center; justify-content: center; text-align: center; min-height: 42px; padding: 8px 14px; margin-bottom: 14px; border: 3px solid var(--ig-line); font-family: var(--ig-font-mono); font-size: 12px; font-weight: 800; letter-spacing: .03em; }
.ig-tyc__event--idle { background: #f2f2f2; color: #6B6B6B; font-weight: 600; letter-spacing: 0; }
.ig-tyc__event.is-good { background: #d6f5e1; color: #047a47; border-color: #047a47; }
.ig-tyc__event.is-bad  { background: #fde2e2; color: #b91c1c; border-color: #b91c1c; }
.ig-tyc__event--paused { background: #0a0a0a; color: var(--ig-accent); border-color: #0a0a0a; }

/* Szünet vezérlő */
.ig-tyc__controls { display: flex; justify-content: flex-end; margin-bottom: 14px; }
.ig-tyc__pause { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 18px; font-size: 12px; }
.ig-tyc.is-paused .ig-tyc__cols { opacity: .4; pointer-events: none; filter: grayscale(.4); transition: opacity .15s ease; }

.ig-tyc__cols { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; align-items: start; }
.ig-tyc__panel { border: 3px solid var(--ig-line); background: var(--ig-paper); padding: 14px; min-width: 0; }
.ig-tyc__panel-title { margin: 0 0 12px; font-size: 14px; font-family: var(--ig-font-mono); text-transform: uppercase; letter-spacing: .06em; }
.ig-tyc__panel-title small { color: #6B6B6B; font-weight: 400; text-transform: none; letter-spacing: 0; }
.ig-tyc__empty { color: #6B6B6B; font-style: italic; font-size: 13px; margin: 0; }
.ig-tyc__flash { background: #fff3d6; border: 2px solid #b45309; color: #b45309; padding: 8px 10px; font-size: 12px; margin: 0 0 10px; }

/* Bejövő bulik — fix magasságú kártyák, fix gombszélesség */
.ig-tyc__gigs { display: flex; flex-direction: column; gap: 8px; }
.ig-tyc__gig { display: flex; align-items: stretch; gap: 10px; border: 2px solid var(--ig-line); padding: 10px; min-height: 92px; }
.ig-tyc__gig.is-premium { border-color: #b45309; background: #fffaf0; }
.ig-tyc__gig-main { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 5px; }
.ig-tyc__gig-main strong { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ig-tyc__gig-meta { display: block; font-family: var(--ig-font-mono); font-size: 11px; color: #6B6B6B; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ig-tyc__gig-reqs { display: flex; flex-wrap: wrap; gap: 4px; }
.ig-tyc__gig-req, .ig-tyc__gig-q { font-family: var(--ig-font-mono); font-size: 10px; font-weight: 800; letter-spacing: .02em; padding: 1px 6px; border: 1px solid var(--ig-line); white-space: nowrap; }
.ig-tyc__gig-req.is-ok   { background: #d6f5e1; color: #047a47; border-color: #047a47; }
.ig-tyc__gig-req.is-need { background: #fde2e2; color: #b91c1c; border-color: #b91c1c; }
.ig-tyc__gig-q.is-kivalo { background: var(--ig-accent); color: #0a0a0a; border-color: #0a0a0a; }
.ig-tyc__gig-q.is-profi  { background: #dbeafe; color: #1e40af; border-color: #1e40af; }
.ig-tyc__gig-q.is-stabil { background: #eee; color: #555; }
.ig-tyc__gig-q.is-off { opacity: .4; }
.ig-tyc__gig-side { display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 6px; flex-shrink: 0; width: 124px; }
.ig-tyc__gig-btn { width: 100%; min-height: 34px; padding: 0 6px; font-size: 11px; letter-spacing: .02em; white-space: nowrap; overflow: hidden; flex-shrink: 0; }
.ig-tyc__gig-skip { width: 100%; min-height: 26px; padding: 0 6px; font-size: 10px; letter-spacing: .02em; white-space: nowrap; flex-shrink: 0; }

/* Futó munkák — fix magasság + görgetés, fix kártyaméret */
.ig-tyc__active { max-height: 432px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding-right: 2px; }
.ig-tyc__job { border: 2px solid var(--ig-line); padding: 9px 10px; flex-shrink: 0; }
.ig-tyc__job-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; margin-bottom: 6px; }
.ig-tyc__job-top strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.ig-tyc__job-top span { font-family: var(--ig-font-mono); font-weight: 700; flex-shrink: 0; }
.ig-tyc__job-bar { height: 10px; background: #e5e5e5; border: 1px solid var(--ig-line); }
.ig-tyc__job-bar div { height: 100%; background: #86efac; transition: width 1s linear; }
.ig-tyc__job-left { font-family: var(--ig-font-mono); font-size: 10px; color: #6B6B6B; text-align: right; margin-top: 4px; }
.ig-tyc__job.is-kivalo { border-left: 5px solid var(--ig-accent); }
.ig-tyc__job.is-profi  { border-left: 5px solid #1e40af; }
.ig-tyc__job.is-stabil { border-left: 5px solid #999; }

/* Fejlesztések — fix sor-magasság, fix gombszélesség (ár-változás nem mozdít) */
.ig-tyc__upgrades { max-height: 384px; overflow-y: auto; }
.ig-tyc__up { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #eee; min-height: 56px; }
.ig-tyc__up:last-of-type { border-bottom: 0; }
.ig-tyc__up-info { flex: 1; min-width: 0; }
.ig-tyc__up-info strong { display: block; font-size: 13px; margin-bottom: 4px; }
.ig-tyc__up-info span { display: inline-block; font-family: var(--ig-font-mono); font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ig-ink); background: #e8e8e8; border: 1px solid var(--ig-line); padding: 1px 7px; }
.ig-tyc__up-btn { font-family: var(--ig-font-mono); font-size: 11px; letter-spacing: .02em; min-height: 44px; padding: 0 8px; white-space: nowrap; overflow: hidden; flex-shrink: 0; width: 128px; }
.ig-tyc__reset { width: 100%; margin-top: 14px; font-size: 12px; }

/* Ranglista beküldő sáv + lista (teljes szélességben a játék alatt) */
.ig-tyc__lbbar { margin-top: 16px; border: 3px solid var(--ig-line); background: var(--ig-paper); padding: 14px 16px; }
.ig-tyc__lbbar-top { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ig-tyc__lbbar-info { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 200px; }
.ig-tyc__lbbar-eyebrow { display: flex; align-items: center; gap: 7px; font-weight: 900; font-size: 15px; }
.ig-tyc__lbbar-hint { font-size: 12px; color: #6B6B6B; }
.ig-tyc__lbbar-form { display: flex; gap: 8px; }
.ig-tyc__lbbar-name { border: 2px solid var(--ig-line); padding: 9px 12px; font: inherit; width: 200px; }
.ig-tyc__lbbar-btn { white-space: nowrap; }
.ig-tyc__lbbar-rank { font-family: var(--ig-font-mono); font-weight: 800; font-size: 13px; background: var(--ig-accent); padding: 6px 10px; border: 2px solid var(--ig-line); }
.ig-tyc__lbbar-list { margin-top: 14px; border-top: 2px solid var(--ig-line); padding-top: 12px; }
.ig-tyc__lbbar-list .ig-lb__ol { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 28px; margin: 0; padding: 0; list-style: none; }
.ig-tyc__lbbar-list .ig-lb__row { padding: 9px 2px; }
.ig-tyc__lbbar-list .ig-lb__empty { padding: 4px 0; color: #6B6B6B; font-style: italic; font-size: 13px; margin: 0; text-align: left; }
@media (max-width: 640px) { .ig-tyc__lbbar-list .ig-lb__ol { grid-template-columns: 1fr; } }

/* inline ranglista az eredmény-blokkban */
.ig-lb-result__head { font-family: var(--ig-font-mono); font-weight: 800; letter-spacing: .06em; font-size: 13px; margin-bottom: 8px; text-align: left; }
.ig-lb-inline { margin-top: 10px; border: 2px solid var(--ig-line); }
.ig-lb-inline .ig-lb__ol { max-height: 280px; overflow-y: auto; }

@media (max-width: 760px) {
	.ig-tyc__cols { grid-template-columns: 1fr; }
	.ig-tyc__lbbar-form { width: 100%; }
	.ig-tyc__lbbar-name { flex: 1; width: auto; }
}
@media (max-width: 560px) {
	.ig-tyc__hud { grid-template-columns: 1fr 1fr; }
	.ig-tyc__stat { margin-right: 0; margin-bottom: -3px; }
	.ig-tyc__stat:nth-child(odd) { margin-right: -3px; }
}
@media (max-width: 420px) {
	.ig-tyc__stat span { font-size: 16px; }
	.ig-tyc__stat i { font-size: 9px; }
	.ig-tyc__event { font-size: 11px; }
}
@media (max-width: 640px) {
	.ig-foh__console { grid-template-columns: repeat(4, 1fr); gap: 5px; }
	.ig-foh__ch { padding: 8px 3px; }
	.ig-foh__ch-prob { font-size: 9px; min-height: 22px; }
	.ig-foh__stat { min-width: 60px; padding: 7px 8px; }
	.ig-foh__stat span { font-size: 18px; }
	.ig-foh__res-cta { flex-direction: column; }
	.ig-foh__res-cta .ig-button { width: 100%; }
}

/* --- Zajszintmérő (decibel-mérő) — mobil-first --- */
.ig-spl-wrap { padding-top: 22px; padding-bottom: 48px; }
.ig-spl { max-width: 520px; margin: 0 auto; }
.ig-spl__readout { position: relative; border: 3px solid var(--ig-line); background: var(--ig-paper); text-align: center; padding: 26px 16px 18px; transition: background .2s ease; }
.ig-spl__value { display: inline-block; font-size: clamp(76px, 27vw, 150px); font-weight: 900; line-height: .88; font-variant-numeric: tabular-nums; }
.ig-spl__unit { font-family: var(--ig-font-mono); font-size: 20px; font-weight: 800; margin-left: 4px; vertical-align: top; color: #6B6B6B; }
.ig-spl__zone { display: block; margin-top: 12px; font-family: var(--ig-font-mono); font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: #6B6B6B; }
.ig-spl__readout.is-quiet    { background: #d1fae5; } .ig-spl__readout.is-quiet .ig-spl__zone    { color: #047a47; }
.ig-spl__readout.is-normal   { background: #ecfdf5; } .ig-spl__readout.is-normal .ig-spl__zone   { color: #047a47; }
.ig-spl__readout.is-loud     { background: #fef9c3; } .ig-spl__readout.is-loud .ig-spl__zone     { color: #a16207; }
.ig-spl__readout.is-veryloud { background: #ffedd5; } .ig-spl__readout.is-veryloud .ig-spl__zone { color: #c2410c; }
.ig-spl__readout.is-harmful  { background: #fee2e2; } .ig-spl__readout.is-harmful .ig-spl__value { color: #b91c1c; } .ig-spl__readout.is-harmful .ig-spl__zone { color: #b91c1c; }

.ig-spl__gauge { position: relative; height: 26px; border: 3px solid var(--ig-line); border-top: 0; background: #f2f2f2; overflow: hidden; }
.ig-spl__gauge-fill { height: 100%; width: 0; background: #34d399; transition: width .12s linear; }
.ig-spl__gauge-fill.is-loud { background: var(--ig-accent); }
.ig-spl__gauge-fill.is-veryloud { background: #f59e0b; }
.ig-spl__gauge-fill.is-harmful { background: #dc2626; }
.ig-spl__gauge-min, .ig-spl__gauge-max { position: absolute; bottom: 3px; font-family: var(--ig-font-mono); font-size: 9px; font-weight: 800; color: #0a0a0a; background: rgba(255,255,255,.72); padding: 0 4px; }
.ig-spl__gauge-min { left: 4px; } .ig-spl__gauge-max { right: 4px; }

.ig-spl__stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 14px 0 18px; }
.ig-spl__stat { border: 2px solid var(--ig-line); margin-right: -2px; padding: 12px 6px; text-align: center; }
.ig-spl__stat:last-child { margin-right: 0; }
.ig-spl__stat span { display: block; font-size: 26px; font-weight: 900; line-height: 1; font-variant-numeric: tabular-nums; }
.ig-spl__stat i { display: block; margin-top: 5px; font-style: normal; font-family: var(--ig-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: #6B6B6B; }
.ig-spl__stat--avg { background: var(--ig-accent); }
.ig-spl__stat--avg i { color: #0a0a0a; }

.ig-spl__controls { display: flex; gap: 10px; }
.ig-spl__toggle { flex: 2; }
.ig-spl__resetbtn { flex: 1; }
.ig-spl__toggle.is-on { background: #dc2626; color: #fff; border-color: #dc2626; }

.ig-spl__cal { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 16px 0; border: 2px solid var(--ig-line); padding: 12px 14px; }
.ig-spl__cal-label { font-family: var(--ig-font-mono); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.ig-spl__cal-btn { width: 44px; height: 44px; border: 2px solid var(--ig-line); background: var(--ig-paper); font-size: 22px; font-weight: 900; line-height: 1; cursor: pointer; flex-shrink: 0; }
.ig-spl__cal-btn:active { background: var(--ig-accent); }
.ig-spl__cal-val { font-family: var(--ig-font-mono); font-weight: 800; min-width: 58px; text-align: center; font-variant-numeric: tabular-nums; }
.ig-spl__cal-hint { flex-basis: 100%; font-size: 11px; color: #6B6B6B; }

.ig-spl__legend { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 7px; }
.ig-spl__legend li { font-size: 13px; color: #333; display: flex; gap: 10px; }
.ig-spl__legend b { font-family: var(--ig-font-mono); flex-shrink: 0; min-width: 56px; }
.ig-spl__note { margin-top: 16px; font-size: 12px; color: #6B6B6B; font-style: italic; line-height: 1.5; }

/* --- Konvoj — felülnézetes furgon-vezetés --- */
.ig-knv { --knv-accent: #E8FF00; max-width: 760px; margin: 0 auto; }
.ig-knv__hud { display: flex; align-items: stretch; gap: 0; margin-bottom: 0; }
.ig-knv__level { flex: 1; min-width: 0; display: flex; align-items: center; padding: 10px 14px; border: 3px solid var(--ig-line); background: var(--knv-accent); font-family: var(--ig-font-mono); font-weight: 900; font-size: 14px; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ig-knv__stat { border: 3px solid var(--ig-line); border-left: 0; padding: 8px 12px; text-align: center; background: var(--ig-paper); min-width: 70px; }
.ig-knv__stat span { display: block; font-size: 20px; font-weight: 900; line-height: 1; font-variant-numeric: tabular-nums; }
.ig-knv__stat i { font-style: normal; font-family: var(--ig-font-mono); font-size: 9px; text-transform: uppercase; letter-spacing: .04em; color: #6B6B6B; }
.ig-knv__stat--time.is-low span { color: #dc2626; }
.ig-knv__stat--gear.is-done span { color: #15803d; }
.ig-knv__stat--score { background: var(--ig-accent); }

.ig-knv__stage { position: relative; border: 3px solid var(--ig-line); border-top: 0; line-height: 0; background: #e9e6df; }
.ig-knv__canvas { display: block; width: 100%; height: auto; touch-action: none; }
.ig-knv--3d .ig-knv__stage { background: #161a28; }
.ig-knv--3d .ig-knv__canvas { background: #161a28; }
.ig-knv__radar { position: absolute; right: 12px; bottom: 12px; width: 112px; height: 112px; border-radius: 50%; z-index: 4; pointer-events: none; box-shadow: 0 4px 18px rgba(0,0,0,0.45), inset 0 0 0 1px rgba(255,255,255,0.08); }
@media (max-width: 640px){ .ig-knv__radar { width: 84px; height: 84px; right: 8px; bottom: 8px; } }
.ig-knv__banner { position: absolute; top: 10px; left: 50%; transform: translateX(-50%); background: #0a0a0a; color: var(--knv-accent); font-family: var(--ig-font-mono); font-weight: 800; font-size: 13px; letter-spacing: .04em; padding: 7px 14px; white-space: nowrap; line-height: 1.1; z-index: 3; }
.ig-knv__overlay, .ig-knv__result { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 12px; padding: 24px; background: rgba(245,242,236,.94); z-index: 4; line-height: 1.4; }
.ig-knv__overlay[hidden], .ig-knv__result[hidden], .ig-knv__banner[hidden] { display: none !important; }
.ig-knv__big { font-size: clamp(22px, 4vw, 34px); font-weight: 900; margin: 0; }
.ig-knv__small { max-width: 540px; margin: 0; font-size: 14px; color: #333; }
.ig-knv__keys { margin: 0; font-family: var(--ig-font-mono); font-size: 11px; color: #6B6B6B; }
.ig-knv__res-head { font-family: var(--ig-font-mono); font-weight: 900; font-size: 20px; letter-spacing: .04em; }
.ig-knv__res-head.is-win { background: var(--ig-accent); padding: 4px 12px; }
.ig-knv__res-score { font-size: 44px; font-weight: 900; line-height: 1; }
.ig-knv__res-score small { font-size: 16px; color: #6B6B6B; }
.ig-knv__res-sub { margin: 0; font-size: 13px; color: #333; max-width: 460px; }
.ig-knv__res-cta { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.ig-knv .ig-lb-result { width: 100%; max-width: 380px; }

.ig-knv__pad { display: flex; justify-content: space-between; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
.ig-knv__pad-steer, .ig-knv__pad-drive { display: flex; gap: 8px; }
.ig-knv__btn { width: 74px; height: 62px; border: 3px solid var(--ig-line); background: var(--ig-paper); font-family: var(--ig-font-mono); font-weight: 900; font-size: 22px; cursor: pointer; user-select: none; touch-action: none; -webkit-tap-highlight-color: transparent; }
.ig-knv__btn--gas { background: var(--ig-accent); width: 92px; font-size: 15px; }
.ig-knv__btn--brake { font-size: 13px; width: 66px; }
.ig-knv__btn--drift { font-size: 13px; width: 66px; border-color: #0a0a0a; box-shadow: inset 0 0 0 2px var(--knv-accent); }
.ig-knv__btn--door { font-size: 12px; width: 66px; background: #12141c; color: #fff; border-color: var(--knv-accent); }
.ig-knv__btn.is-on { background: #0a0a0a; color: var(--knv-accent); }
@media (max-width: 520px) {
	.ig-knv__hud { flex-wrap: wrap; }
	.ig-knv__level { flex-basis: 100%; border-bottom: 0; }
	.ig-knv__stat { flex: 1; border-left: 3px solid var(--ig-line); border-right: 0; min-width: 0; }
	.ig-knv__stat:last-child { border-right: 3px solid var(--ig-line); }
	.ig-knv__pad-steer, .ig-knv__pad-drive { gap: 6px; }
	.ig-knv__btn { width: 56px; height: 60px; font-size: 18px; }
	.ig-knv__btn--gas { width: 74px; font-size: 13px; }
	.ig-knv__btn--brake, .ig-knv__btn--drift, .ig-knv__btn--door { width: 52px; font-size: 10px; }
}

/* --- Játék + ranglista egymás mellett --- */
.ig-game-layout { display: grid; grid-template-columns: 1fr 340px; gap: 20px; align-items: start; }
.ig-game-layout__main { min-width: 0; }
/* a játékok belső középre-igazítása felülírva, hadd töltsék ki az oszlopot */
.ig-game-layout__main .ig-rfx,
.ig-game-layout__main .ig-db,
.ig-game-layout__main .ig-van,
.ig-game-layout__main .ig-foh,
.ig-game-layout__main .ig-tyc,
.ig-game-layout__main .ig-knv,
.ig-game-layout__main .ig-bm { max-width: none; margin: 0; }
.ig-game-layout__side { position: sticky; top: 16px; }

/* --- Ranglista (leaderboard) --- */
.ig-lb { margin: 0; border: 3px solid var(--ig-line); background: var(--ig-paper); }
.ig-lb__title { margin: 0; padding: 14px 18px; border-bottom: 3px solid var(--ig-line); background: var(--ig-accent); font-size: 16px; font-weight: 900; letter-spacing: -.01em; }
.ig-lb__empty { padding: 22px 18px; margin: 0; text-align: center; color: #6B6B6B; font-style: italic; font-size: 14px; }
.ig-lb__ol { list-style: none; margin: 0; padding: 0; }
.ig-lb__row { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 10px; padding: 10px 18px; border-bottom: 1px solid #eee; }
.ig-lb__row:last-child { border-bottom: 0; }
.ig-lb__pos { font-family: var(--ig-font-mono); font-weight: 800; font-size: 15px; color: #6B6B6B; }
.ig-lb__row.is-top .ig-lb__pos { color: #0a0a0a; }
.ig-lb__row:nth-child(1) .ig-lb__pos::before { content: '🥇 '; }
.ig-lb__row:nth-child(2) .ig-lb__pos::before { content: '🥈 '; }
.ig-lb__row:nth-child(3) .ig-lb__pos::before { content: '🥉 '; }
.ig-lb__row:nth-child(-n+3) .ig-lb__pos { content: ''; }
.ig-lb__name { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ig-lb__score { font-family: var(--ig-font-mono); font-weight: 800; }
.ig-lb__score i { font-style: normal; font-size: 11px; color: #6B6B6B; font-weight: 400; }
.ig-lb__row.is-me { background: var(--ig-accent); }
.ig-lb__row.is-me .ig-lb__pos { color: #0a0a0a; }

/* Eredmény-űrlap (név beküldés) */
.ig-lb-result { margin: 14px 0; }
.ig-lb-form { display: flex; gap: 8px; }
.ig-lb-form__name { flex: 1; border: 2px solid var(--ig-line); padding: 9px 12px; font: inherit; }
.ig-lb-form__btn { white-space: nowrap; }
.ig-lb-form__rank { margin: 8px 0 0; font-family: var(--ig-font-mono); font-weight: 800; font-size: 14px; }
.ig-lb-result--dark .ig-lb-form__name { background: #0a0a0a; color: #fff; border-color: #fff; }
.ig-lb-result--dark .ig-lb-form__rank { color: var(--ig-accent); }
.ig-van__overcta { display: flex; gap: 8px; justify-content: center; }

/* Keskenyebb képernyőn a ranglista a játék alá kerül */
@media (max-width: 900px) {
	.ig-game-layout { grid-template-columns: 1fr; }
	.ig-game-layout__side { position: static; }
	.ig-game-layout__main .ig-rfx,
	.ig-game-layout__main .ig-db,
	.ig-game-layout__main .ig-van,
	.ig-game-layout__main .ig-foh,
	.ig-game-layout__main .ig-bm { margin: 0 auto; }
}
/* Gyors koppintás mobilon — nincs dupla-koppintásos zoom késleltetés */
.ig-bp__pad, .ig-rfx__arena, .ig-rfx__target, .ig-van__ctrl,
.ig-rfx__cta .ig-button, .ig-db__panel .ig-button { touch-action: manipulation; }

/* Érintős eszközök: a billentyű-utalások feleslegesek */
@media (hover: none), (pointer: coarse) {
	.ig-bp__pad-key { display: none; }
	.ig-bp__hint { display: none; }
}

@media (max-width: 640px) {
	.ig-game-stage { padding-top: 16px; padding-bottom: 64px; }

	/* --- Hub kártyák --- */
	.ig-games-grid { grid-template-columns: 1fr; gap: 12px; }
	.ig-game-card { padding: 20px; }
	.ig-game-card__icon, .ig-game-card__icon svg { width: 44px; height: 44px; }

	/* --- Reflex --- */
	.ig-rfx__hud { flex-wrap: nowrap; }
	.ig-rfx__stat { padding: 10px 6px; }
	.ig-rfx__stat span { font-size: 20px; }
	.ig-rfx__stat i { font-size: 9px; }
	.ig-rfx__arena { height: 56vh; min-height: 300px; }
	.ig-rfx__target { width: 120px; height: 56px; font-size: 15px; }
	.ig-rfx__big { font-size: 22px; }
	.ig-rfx__avg { font-size: 52px; }
	.ig-rfx__cta { flex-direction: column; }
	.ig-rfx__cta .ig-button { width: 100%; }

	/* --- Beatpad --- */
	.ig-bp__bar { gap: 6px; }
	.ig-bp__bar .ig-bp__btn { flex: 1; justify-content: center; min-width: 0; padding: 11px 8px; }
	.ig-bp__grid { gap: 6px; }
	.ig-bp__pad { border-width: 2px; gap: 0; }
	.ig-bp__pad-label { font-size: 9px; padding: 0 2px; }

	/* --- Van / Tetris --- */
	.ig-van__top { flex-direction: column; align-items: center; }
	.ig-van__playfield { width: min(320px, 88vw); }
	.ig-van__side { flex-direction: row; width: min(320px, 88vw); gap: 6px; }
	.ig-van__side .ig-van__stat { flex: 1; padding: 8px 4px; }
	.ig-van__side .ig-van__stat span { font-size: 20px; }
	.ig-van__next { flex: 1; padding: 6px; }
	.ig-van__controls { gap: 5px; max-width: min(320px, 88vw); }
	.ig-van__ctrl { padding: 16px 0; font-size: 20px; }
	.ig-van__ctrl--drop { padding: 14px 0; }
	.ig-van__overcta { flex-direction: column; }
	.ig-van__overcta .ig-button { width: 100%; }

	/* --- Decibel --- */
	.ig-db__meterwrap { gap: 10px; }
	.ig-db__meter { width: 64px; height: 220px; }
	.ig-db__scale { height: 220px; }
	.ig-db__readout span { font-size: 48px; }
	.ig-db__panel { padding: 20px 16px; }
	.ig-db__cta { flex-direction: column; }
	.ig-db__cta .ig-button { width: 100%; }

	/* --- Ranglista --- */
	.ig-lb-form { flex-direction: column; }
	.ig-lb-form__btn { width: 100%; }
	.ig-lb__row { grid-template-columns: 36px 1fr auto; padding: 9px 14px; }
}

.ig-checkout__shipping-toggle {
	align-items: center;
	cursor: pointer;
	display: flex;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	gap: 10px;
	letter-spacing: 0.06em;
	margin-bottom: 12px;
	text-transform: uppercase;
}

.ig-checkout__shipping-toggle input {
	accent-color: var(--ig-ink);
	height: 18px;
	width: 18px;
}

.ig-method-list {
	display: grid;
	gap: 8px;
}

.ig-method-card {
	align-items: center;
	background: #fafafa;
	border: var(--ig-stroke) solid var(--ig-line);
	cursor: pointer;
	display: grid;
	gap: 16px;
	grid-template-columns: 22px minmax(0, 1fr) auto;
	padding: 14px 18px;
	transition: background 140ms ease, transform 140ms ease, box-shadow 140ms ease;
}

.ig-method-card[hidden] {
	display: none !important;
}

.ig-method-card:hover {
	background: #fff;
}

.ig-method-card:has(input:checked) {
	background: var(--ig-paper);
	box-shadow: 4px 4px 0 var(--ig-ink);
	transform: translate(-2px, -2px);
}

.ig-method-card input[type="radio"] {
	accent-color: var(--ig-ink);
	height: 18px;
	margin-top: 2px;
	width: 18px;
}

.ig-method-card__body {
	display: block;
	min-width: 0;
}

.ig-method-card__title {
	display: block;
	font-family: var(--ig-font-display);
	font-size: 16px;
	font-weight: 800;
	letter-spacing: -0.01em;
}

.ig-method-card__note {
	color: var(--ig-muted);
	display: block;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.04em;
	line-height: 1.45;
	margin-top: 4px;
}

.ig-method-card__auto {
	color: var(--ig-muted);
	display: block;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-style: italic;
	letter-spacing: 0.02em;
	line-height: 1.45;
	margin-top: 6px;
	opacity: 0.85;
}

.ig-method-card__auto::before {
	color: var(--ig-accent-ink);
	content: "ⓘ ";
	font-style: normal;
	margin-right: 2px;
}

.ig-method-card__price {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	white-space: nowrap;
}

.ig-checkout__summary {
	min-width: 0;
}

.ig-checkout__summary-inner {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	padding: clamp(20px, 2.5vw, 32px);
	position: sticky;
	/* A sticky site-header ~72-80px magas — annyival lejjebb fixáljuk, hogy
	   ne legyen levágva a tetejéből semmi scroll közben. */
	top: 96px;
	max-height: calc(100vh - 110px);
	overflow-y: auto;
}

.ig-checkout__items {
	display: grid;
	gap: 8px;
	list-style: none;
	margin: 0 0 16px;
	padding: 0 0 16px;
	border-bottom: 1.5px dashed var(--ig-line);
}

.ig-checkout__items li {
	display: grid;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	gap: 6px;
	letter-spacing: 0.02em;
	line-height: 1.5;
}

.ig-checkout__items-top {
	display: flex;
	gap: 12px;
	justify-content: space-between;
}

.ig-checkout__items-name em {
	color: var(--ig-muted);
	font-style: normal;
}

.ig-checkout__items-price {
	font-weight: 800;
	white-space: nowrap;
}

.ig-checkout__items-stepper {
	align-items: center;
	display: inline-flex;
	gap: 2px;
}

.ig-checkout__items-btn {
	background: var(--ig-paper);
	border: 1.5px solid var(--ig-line);
	color: var(--ig-ink);
	cursor: pointer;
	font-family: var(--ig-font-display);
	font-size: 13px;
	font-weight: 900;
	height: 24px;
	line-height: 1;
	padding: 0;
	touch-action: manipulation;
	transition: background 120ms ease, color 120ms ease;
	-webkit-user-select: none;
	user-select: none;
	width: 24px;
}

.ig-checkout__items-btn:hover {
	background: var(--ig-accent);
}

.ig-checkout__items-btn:disabled {
	background: var(--ig-paper);
	color: var(--ig-muted);
	cursor: not-allowed;
	opacity: 0.35;
	pointer-events: none;
}

.ig-checkout__items-qty {
	background: var(--ig-paper);
	border-bottom: 1.5px solid var(--ig-line);
	border-top: 1.5px solid var(--ig-line);
	color: var(--ig-ink);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--ig-font-display);
	font-size: 13px;
	font-weight: 800;
	height: 24px;
	min-width: 28px;
	padding: 0 6px;
}

.ig-checkout__items-unit {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.06em;
	margin-left: 4px;
	text-transform: uppercase;
}

.ig-checkout__totals {
	display: grid;
	gap: 6px;
	grid-template-columns: 1fr auto;
	margin: 0 0 16px;
	padding: 0 0 16px;
	border-bottom: 1.5px dashed var(--ig-line);
}

.ig-checkout__totals dt {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.ig-checkout__totals dd {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
	margin: 0;
	text-align: right;
}

.ig-checkout__grand {
	align-items: baseline;
	display: flex;
	justify-content: space-between;
	margin: 0 0 20px;
}

.ig-checkout__grand span {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ig-checkout__grand strong {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	font-family: var(--ig-font-display);
	font-size: clamp(22px, 2.5vw, 30px);
	font-weight: 900;
	letter-spacing: -0.01em;
	padding: 4px 10px;
}

.ig-checkout__submit {
	display: block;
	text-align: center;
	width: 100%;
}

.ig-checkout__submit:disabled {
	opacity: 0.45;
	cursor: not-allowed;
	background: var(--ig-ink);
	color: var(--ig-paper);
}

.ig-checkout__legal {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: 0.04em;
	line-height: 1.5;
	margin: 12px 0 0;
	text-transform: uppercase;
}

/* Consent gate — két kötelező checkbox a Rendelés gomb felett. */
.ig-checkout__consent {
	display: grid;
	gap: 10px;
	margin: 18px 0 14px;
	padding: 14px 16px;
	border: 2px solid var(--ig-ink);
	background: var(--ig-paper);
}

.ig-checkout__consent-row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 13px;
	line-height: 1.45;
	cursor: pointer;
}

.ig-checkout__consent-row input[type="checkbox"] {
	flex-shrink: 0;
	margin-top: 2px;
	width: 20px;
	height: 20px;
	accent-color: var(--ig-ink);
	cursor: pointer;
}

.ig-checkout__consent-row span {
	color: var(--ig-ink);
}

.ig-checkout__consent-row a {
	color: var(--ig-ink);
	font-weight: 700;
	text-decoration: underline;
	text-decoration-color: var(--ig-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.ig-checkout__consent-row a:hover {
	background: var(--ig-accent);
}

.invgroup-allow-list {
	display: grid;
	gap: 2px;
	max-width: 220px;
}

.invgroup-allow-list label {
	align-items: center;
	display: flex;
	font-family: monospace;
	font-size: 11px;
	gap: 6px;
}

@media (max-width: 880px) {
	.ig-checkout__layout {
		grid-template-columns: 1fr;
	}
	.ig-checkout__summary-inner {
		position: static;
	}
}

/* ==========================================================================
   404 + nice-try (login cloak)
   ========================================================================== */

.ig-404,
.ig-nice__wrap {
	padding-top: clamp(48px, 7vw, 112px);
	padding-bottom: clamp(56px, 7vw, 112px);
}

.ig-404__head,
.ig-nice__head {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	margin-bottom: clamp(32px, 5vw, 64px);
	padding: clamp(28px, 4vw, 64px);
	position: relative;
}

.ig-404__title {
	align-items: center;
	display: flex;
	gap: clamp(8px, 1.5vw, 22px);
	font-family: var(--ig-font-display);
	font-size: clamp(120px, 22vw, 320px);
	font-weight: 900;
	letter-spacing: -0.06em;
	line-height: 0.9;
	margin: 16px 0 24px;
	text-transform: uppercase;
}

.ig-404__zero {
	background: var(--ig-accent);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	border-radius: 50%;
	display: inline-block;
	height: 0.85em;
	margin: 0 0.05em;
	position: relative;
	width: 0.85em;
}

.ig-404__zero::before,
.ig-404__zero::after {
	background: var(--ig-ink);
	content: "";
	height: 0.18em;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 0.55em;
}
.ig-404__zero::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.ig-404__lead,
.ig-nice__lead {
	font-family: var(--ig-font-display);
	font-size: clamp(18px, 1.6vw, 24px);
	font-weight: 500;
	line-height: 1.4;
	margin: 0 0 24px;
	max-width: 60ch;
}

.ig-404__search {
	border-top: 1.5px dashed var(--ig-line);
	margin-top: clamp(24px, 3vw, 40px);
	padding-top: clamp(20px, 2.5vw, 32px);
}

.ig-404__search .ig-eyebrow {
	display: block;
	margin-bottom: 10px;
}

.ig-404__search-row {
	display: grid;
	gap: 8px;
	grid-template-columns: minmax(0, 1fr) auto;
}

.ig-404__search-row input {
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	font-family: var(--ig-font-mono);
	font-size: 16px;
	letter-spacing: 0.04em;
	padding: 12px 14px;
}

.ig-404__products,
.ig-nice__products {
	margin-top: clamp(28px, 4vw, 56px);
}

@media (max-width: 540px) {
	.ig-404__search-row { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Order detail (account → Rendelés → részletek)
   ========================================================================== */

.ig-order-detail__head {
	background: var(--ig-bone, #f6f6f3);
	border: var(--ig-stroke) solid var(--ig-line);
	margin: 16px 0 20px;
	padding: 18px 20px;
}

.ig-order-detail__title {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0 0 14px;
}

.ig-order-detail__id {
	background: var(--ig-ink);
	color: var(--ig-paper);
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	padding: 5px 10px;
}

.ig-order-detail__meta {
	display: grid;
	gap: 8px 28px;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	margin: 0;
}

.ig-order-detail__meta > div {
	min-width: 0;
}

.ig-order-detail__meta dt {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.1em;
	margin: 0 0 2px;
	text-transform: uppercase;
}

.ig-order-detail__meta dd {
	font-family: var(--ig-font-display);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0;
	word-break: break-word;
}

.ig-order-detail__cta {
	align-items: center;
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0 0 24px;
	padding: 16px 20px;
}

.ig-order-detail__tracking-no {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	word-break: break-all;
}

.ig-order-detail__items {
	display: grid;
	gap: 0;
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
}

.ig-order-detail__items > li {
	align-items: center;
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	display: grid;
	gap: 12px 16px;
	grid-template-columns: minmax(0, 1fr) auto auto;
	margin: 0 0 -1px;
	padding: 12px 16px;
}

.ig-order-detail__item-body {
	min-width: 0;
}

.ig-order-detail__item-name {
	display: block;
	font-family: var(--ig-font-display);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.3;
}

.ig-order-detail__item-sku {
	color: var(--ig-muted);
	display: block;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.06em;
	margin-top: 2px;
	text-transform: uppercase;
}

.ig-order-detail__item-qty {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	white-space: nowrap;
}

.ig-order-detail__item-price {
	font-family: var(--ig-font-display);
	font-size: 15px;
	font-weight: 800;
	letter-spacing: -0.01em;
	white-space: nowrap;
}

.ig-order-detail__totals {
	display: grid;
	gap: 4px 14px;
	grid-template-columns: minmax(0, 1fr) auto;
	margin: 0 0 12px;
}

.ig-order-detail__totals dt {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.ig-order-detail__totals dd {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
	margin: 0;
	text-align: right;
}

.ig-order-detail__grand {
	align-items: center;
	border-top: 2px solid var(--ig-ink);
	display: flex;
	justify-content: space-between;
	margin: 0 0 28px;
	padding-top: 12px;
}

.ig-order-detail__grand span {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ig-order-detail__grand strong {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	font-family: var(--ig-font-display);
	font-size: clamp(20px, 2.2vw, 28px);
	font-weight: 900;
	letter-spacing: -0.01em;
	padding: 4px 12px;
}

.ig-order-detail__addresses {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ig-order-detail__addresses > div {
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	padding: 16px 18px;
}

.ig-order-detail__addresses h3 {
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	margin: 0 0 10px;
	text-transform: uppercase;
}

.ig-order-detail__addresses address {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-style: normal;
	letter-spacing: 0.02em;
	line-height: 1.6;
}

@media (max-width: 640px) {
	.ig-order-detail__items > li {
		grid-template-areas:
			"body  price"
			"qty   price";
		grid-template-columns: minmax(0, 1fr) auto;
	}
	.ig-order-detail__item-body  { grid-area: body; }
	.ig-order-detail__item-qty   { grid-area: qty; }
	.ig-order-detail__item-price {
		align-self: center;
		font-size: 17px;
		grid-area: price;
	}
	.ig-order-detail__addresses {
		grid-template-columns: 1fr;
	}
	.ig-order-detail__cta {
		flex-direction: column;
		align-items: stretch;
	}
	.ig-order-detail__cta .ig-button {
		width: 100%;
		justify-content: center;
		text-align: center;
	}
}

/* ==========================================================================
   Orders list (account → Áttekintés + Rendelések)
   ========================================================================== */

.ig-orders-list {
	display: grid;
	gap: 0;
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
}

.ig-orders-list__item {
	margin: 0 0 -1.5px;
}

.ig-orders-list__link {
	align-items: center;
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-ink);
	display: grid;
	gap: 14px 18px;
	grid-template-columns: minmax(0, 1fr) auto 24px;
	padding: 14px 18px;
	text-decoration: none;
	transition: background 140ms ease, transform 140ms ease, box-shadow 140ms ease;
}

.ig-orders-list__link:hover,
.ig-orders-list__link:focus-visible {
	background: var(--ig-bone, #f6f6f3);
	box-shadow: 4px 4px 0 var(--ig-ink);
	outline: none;
	transform: translate(-2px, -2px);
}

.ig-orders-list__head {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	min-width: 0;
}

.ig-orders-list__id {
	background: var(--ig-ink);
	color: var(--ig-paper);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	padding: 4px 8px;
}

.ig-orders-list__meta {
	align-items: baseline;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	justify-content: flex-end;
	text-align: right;
}

.ig-orders-list__meta time {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.ig-orders-list__amount {
	font-family: var(--ig-font-display);
	font-size: clamp(16px, 1.4vw, 20px);
	font-weight: 900;
	letter-spacing: -0.01em;
}

.ig-orders-list__arrow {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 16px;
	font-weight: 700;
	text-align: right;
	transition: color 140ms ease, transform 140ms ease;
}

.ig-orders-list__link:hover .ig-orders-list__arrow {
	color: var(--ig-ink);
	transform: translateX(4px);
}

@media (max-width: 540px) {
	.ig-orders-list__link {
		gap: 8px 12px;
		grid-template-columns: minmax(0, 1fr) auto;
		padding: 12px 14px;
	}
	.ig-orders-list__head {
		grid-column: 1 / -1;
	}
	.ig-orders-list__meta {
		justify-content: space-between;
		text-align: left;
		width: 100%;
	}
	.ig-orders-list__arrow {
		display: none;
	}
}

/* ==========================================================================
   Order status badge
   ========================================================================== */

.ig-status-badge {
	background: #eee;
	border: 1.5px solid var(--ig-ink);
	color: var(--ig-ink);
	display: inline-block;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1;
	padding: 6px 10px;
	text-transform: uppercase;
	vertical-align: middle;
	white-space: nowrap;
}

.ig-status-badge.is-status-blue   { background: #e6f0ff; border-color: #2a5fc3; color: #1d3f87; }
.ig-status-badge.is-status-yellow { background: var(--ig-accent); border-color: var(--ig-ink); color: var(--ig-accent-ink); }
.ig-status-badge.is-status-green  { background: #d8f5dd; border-color: #1f7a37; color: #1f5a2a; }
.ig-status-badge.is-status-red    { background: #ffe5e5; border-color: #c02323; color: #8a1818; }
.ig-status-badge.is-status-grey   { background: #ececec; border-color: #555; color: #333; }

/* ==========================================================================
   About page
   ========================================================================== */

.ig-about {
	display: block;
}

/* Top padding lives ONLY on .ig-page-head — see comment there. The intro
   section just keeps a bottom divider + bottom breathing room. */
.ig-about__intro {
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	padding: 0 0 clamp(48px, 6vw, 96px);
}

.ig-about__body {
	display: grid;
	gap: clamp(16px, 2vw, 24px);
	margin-top: clamp(24px, 3vw, 40px);
	max-width: 72ch;
}

.ig-about__lead {
	font-family: var(--ig-font-display);
	font-size: clamp(18px, 1.5vw, 22px);
	font-weight: 500;
	line-height: 1.45;
	margin: 0;
}

.ig-about__lead a {
	color: var(--ig-ink);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.ig-about__lead a:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	text-decoration: none;
}

.ig-about__lead strong {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	font-weight: 800;
	padding: 0 0.18em;
}

.ig-about__signature {
	border-left: 6px solid var(--ig-ink);
	margin-top: clamp(28px, 4vw, 48px);
	padding: 4px 0 4px 20px;
	position: relative;
}

.ig-about__sig-mark {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.16em;
	left: -34px;
	position: absolute;
	top: 6px;
}

.ig-about__sig-name {
	font-family: var(--ig-font-display);
	font-size: clamp(20px, 1.6vw, 24px);
	font-weight: 800;
	letter-spacing: -0.01em;
	margin: 0;
}

.ig-about__sig-title {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.12em;
	margin: 4px 0 0;
	text-transform: uppercase;
}

.ig-about__sig-co {
	font-family: var(--ig-font-display);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.08em;
	margin: 6px 0 0;
}

.ig-about__why {
	background: var(--ig-paper-soft, #f3f3f1);
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	padding: clamp(56px, 8vw, 120px) 0;
}

.ig-about__cards {
	display: grid;
	gap: 0;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin-top: clamp(32px, 4vw, 56px);
}

.ig-about__card {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	margin: 0 -1.5px -1.5px 0;
	padding: clamp(28px, 3.2vw, 44px);
	position: relative;
	transition: background 180ms ease, color 180ms ease, transform 180ms ease;
}

.ig-about__card::before {
	background: var(--ig-paper);
	border-bottom: var(--ig-stroke) solid var(--ig-line);
	border-right: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-muted);
	content: attr(data-index);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.1em;
	left: 0;
	padding: 6px 10px;
	position: absolute;
	top: 0;
}

.ig-about__card-icon {
	color: var(--ig-ink);
	display: block;
	margin: 16px 0 28px;
	transition: color 180ms ease;
	width: 56px;
}

.ig-about__card-icon svg {
	display: block;
	height: 56px;
	width: 56px;
}

.ig-about__card h3 {
	font-family: var(--ig-font-display);
	font-size: clamp(22px, 2.2vw, 30px);
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 1.1;
	margin: 0 0 14px;
	text-transform: uppercase;
}

.ig-about__card p {
	color: var(--ig-muted);
	font-size: 15px;
	line-height: 1.5;
	margin: 0;
	max-width: 32ch;
}

.ig-about__card:hover {
	background: var(--ig-ink);
	color: var(--ig-paper);
}

.ig-about__card:hover::before {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-about__card:hover .ig-about__card-icon {
	color: var(--ig-accent);
}

.ig-about__card:hover p {
	color: rgba(255, 255, 255, 0.78);
}

/* Section spacing: top from the nested .ig-page-head, bottom on the
   section itself so the next block has breathing room. */
.ig-about__milestone {
	padding: 0 0 clamp(64px, 9vw, 140px);
	text-align: center;
}

.ig-about__milestone .ig-page-head {
	align-items: center;
	display: flex;
	flex-direction: column;
}

.ig-about__milestone-h2 {
	font-size: clamp(40px, 6vw, 88px);
	font-weight: 900;
	letter-spacing: -0.03em;
	line-height: 1.05;
	margin: 0;
	text-transform: uppercase;
}

.ig-about__num {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	display: inline-block;
	padding: 0 0.12em;
}

.ig-about__milestone .ig-about__lead {
	margin: clamp(24px, 3vw, 40px) auto 0;
	max-width: 64ch;
	text-align: center;
}

.ig-about__milestone .ig-actions {
	display: flex;
	justify-content: center;
	margin-top: clamp(28px, 4vw, 48px);
}

@media (max-width: 880px) {
	.ig-about__cards {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   Static pages (about/contact/legal)
   ========================================================================== */

.ig-static {
	padding-top: 0;
	padding-bottom: 96px;
}

.ig-static h1 {
	font-size: clamp(48px, 7vw, 120px);
	margin: 0 0 32px;
}

.ig-static p,
.ig-static li {
	font-size: clamp(16px, 1.1vw, 18px);
	max-width: 64ch;
}

.ig-static__lead {
	font-family: var(--ig-font-display);
	font-size: clamp(20px, 1.8vw, 26px);
	font-weight: 500;
	line-height: 1.35;
	margin-bottom: 48px;
	max-width: 56ch;
}

.ig-static h2 {
	font-size: clamp(28px, 3vw, 44px);
	margin: 48px 0 16px;
}

.ig-contact {
	padding-top: 0;
	padding-bottom: clamp(48px, 6vw, 96px);
}

/* Contact layout: 1.1fr (info) + 1fr (form), gridded brutalist columns */
.ig-contact-layout {
	border-top: var(--ig-stroke-bold) solid var(--ig-line);
	display: grid;
	gap: 0;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	margin-top: 24px;
}

.ig-contact-layout__info {
	border-right: var(--ig-stroke-bold) solid var(--ig-line);
	padding: 40px 48px 40px 0;
}

.ig-contact-layout__info p:first-child {
	margin-top: 0;
}

.ig-contact__info-title {
	font-family: var(--ig-font-display);
	font-size: clamp(20px, 1.8vw, 26px);
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.2;
	margin: 0 0 28px;
	max-width: 24ch;
	text-transform: none;
}

.ig-contact__rows {
	display: grid;
	gap: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ig-contact__row {
	align-items: flex-start;
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	display: grid;
	gap: 18px;
	grid-template-columns: 64px minmax(0, 1fr);
	margin: 0 0 -1px 0;
	padding: 18px 20px;
	transition: background 160ms ease, color 160ms ease;
}

.ig-contact__row:hover {
	background: var(--ig-ink);
	color: var(--ig-paper);
}

.ig-contact__row-icon {
	align-items: center;
	border: var(--ig-stroke) solid currentColor;
	color: var(--ig-ink);
	display: inline-flex;
	height: 56px;
	justify-content: center;
	width: 56px;
}

.ig-contact__row:hover .ig-contact__row-icon {
	color: var(--ig-accent);
}

.ig-contact__row-icon svg {
	display: block;
	height: 28px;
	width: 28px;
}

.ig-contact__row-body {
	min-width: 0;
}

.ig-contact__row-label {
	font-family: var(--ig-font-display);
	font-size: clamp(18px, 1.4vw, 22px);
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.1;
	margin: 4px 0 6px;
	text-transform: uppercase;
}

.ig-contact__row-value {
	font-family: var(--ig-font-mono);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.02em;
	margin: 0;
}

.ig-contact__row-value a {
	color: inherit;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.ig-contact__row:hover .ig-contact__row-value a {
	color: var(--ig-accent);
}

.ig-contact-layout__form {
	padding: 40px 0 40px 48px;
}

.ig-contact-layout__form h2 {
	font-size: clamp(24px, 2.6vw, 36px);
	margin: 0 0 24px;
}

.ig-contact-form {
	display: grid;
	gap: 24px;
}

/* HTML5 [hidden] is a `display: none` shortcut via UA stylesheet, but a
   later explicit `display: ...` rule wins. Re-assert it for every element
   inside the contact wrapper so `form.hidden = true` from JS actually
   hides the form (otherwise the form stays visible under the success
   panel after a successful submit). */
.ig-contact-form-wrap [hidden] {
	display: none !important;
}

.ig-contact-form__honeypot {
	height: 0;
	left: -9999px;
	overflow: hidden;
	position: absolute;
	width: 0;
}

.ig-contact-form__grid {
	display: grid;
	gap: 18px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ig-contact-form__grid label {
	display: grid;
	gap: 6px;
}

.ig-contact-form__grid label > span {
	color: var(--ig-ink);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.ig-contact-form__grid input,
.ig-contact-form__grid textarea {
	background: var(--ig-bone);
	border: var(--ig-stroke) solid var(--ig-line);
	border-radius: 0;
	color: var(--ig-ink);
	font-family: var(--ig-font-mono);
	font-size: 16px;
	min-height: 48px;
	padding: 12px 14px;
	width: 100%;
}

.ig-contact-form__grid input:focus,
.ig-contact-form__grid textarea:focus {
	background: var(--ig-paper);
	box-shadow: 0 0 0 3px var(--ig-accent);
	outline: 0;
}

.ig-contact-form__consent {
	align-items: flex-start;
	background: var(--ig-bone, #f6f6f3);
	border: var(--ig-stroke) solid var(--ig-line);
	display: grid;
	gap: 12px;
	grid-template-columns: 22px minmax(0, 1fr);
	margin-top: 8px;
	padding: 14px 16px;
}

.ig-contact-form__consent input[type="checkbox"] {
	accent-color: var(--ig-ink);
	height: 18px;
	margin-top: 1px;
	width: 18px;
}

.ig-contact-form__consent span {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	letter-spacing: 0.02em;
	line-height: 1.5;
}

.ig-contact-form__consent a {
	color: var(--ig-ink);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.ig-contact-form__consent a:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	text-decoration: none;
}

.ig-contact-form__grid textarea {
	font-family: var(--ig-font-body);
	font-size: 16px;
	line-height: 1.5;
	min-height: 160px;
	resize: vertical;
}

.ig-contact-form__full {
	grid-column: span 2;
}

.ig-contact-form__err {
	color: var(--ig-danger);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-style: normal;
	font-weight: 600;
}

/* AJAX submit failure — sárga vörös háttér a hibás mezőkön. */
.ig-contact-form [data-contact-field].is-invalid input,
.ig-contact-form [data-contact-field].is-invalid textarea {
	border-color: var(--ig-danger, #dc2626) !important;
	background: #fef2f2;
}

.ig-contact-form [data-contact-field].is-invalid > span {
	color: var(--ig-danger, #dc2626);
}

.ig-contact-form__general {
	display: grid;
	gap: 8px;
	margin: 0 0 14px;
	padding: 12px 14px;
	background: #fef2f2;
	border: 2px solid var(--ig-danger, #dc2626);
}
.ig-contact-form__general .ig-error {
	margin: 0;
	color: #7f1d1d;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 700;
}

/* Sikeres küldés panel — a form helyén jelenik meg, brutalist nagy. */
.ig-contact-success {
	background: #DCFCE7;
	border: 3px solid #0a0a0a;
	padding: 28px 32px;
	display: grid;
	gap: 10px;
}
.ig-contact-success .ig-eyebrow {
	margin: 0;
}
.ig-contact-success__title {
	margin: 0;
	font-family: var(--ig-font-display);
	font-size: clamp(28px, 4vw, 44px);
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 1.05;
	text-transform: uppercase;
}
.ig-contact-success__lead {
	margin: 0;
	font-size: 16px;
	line-height: 1.55;
	color: var(--ig-ink);
}

.ig-contact-form__legal {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.04em;
	line-height: 1.6;
	margin: 0;
}

.ig-contact-form .ig-notice strong {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	margin-right: 6px;
	padding: 0 6px;
}

@media (max-width: 880px) {
	.ig-contact-layout {
		grid-template-columns: 1fr;
	}
	.ig-contact-layout__info {
		border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
		border-right: 0;
		padding: 24px 0;
	}
	.ig-contact-layout__form {
		padding: 24px 0 0;
	}
	.ig-contact-form__grid {
		grid-template-columns: 1fr;
	}
	.ig-contact-form__full {
		grid-column: span 1;
	}
}

/* ==========================================================================
   Footer
   ========================================================================== */

/* ==========================================================================
   Cookie consent banner
   ========================================================================== */

.ig-consent {
	background: var(--ig-ink);
	border: 2px solid var(--ig-accent);
	bottom: 20px;
	box-shadow: 6px 6px 0 rgba(0,0,0,0.4);
	color: var(--ig-paper);
	left: 20px;
	max-width: 380px;
	opacity: 0;
	pointer-events: none;
	position: fixed;
	right: auto;
	transform: translateY(20px) scale(0.96);
	transform-origin: bottom left;
	transition: opacity 280ms ease, transform 320ms cubic-bezier(0.18, 1.1, 0.5, 1);
	width: calc(100% - 40px);
	z-index: 9999;
}

.ig-consent.is-open {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0) scale(1);
}

.ig-consent__inner {
	display: block;
	padding: 18px 18px 16px;
}

.ig-consent__main {
	min-width: 0;
}

.ig-consent__eyebrow {
	color: var(--ig-accent);
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.12em;
	margin: 0 0 4px;
}

.ig-consent__title {
	font-family: var(--ig-font-display);
	font-size: 17px;
	font-weight: 900;
	letter-spacing: -0.01em;
	line-height: 1.15;
	margin: 0 0 6px;
	text-transform: uppercase;
}

.ig-consent__desc {
	color: rgba(255, 255, 255, 0.78);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	line-height: 1.5;
	margin: 0;
}

.ig-consent__desc a {
	color: var(--ig-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.ig-consent__detail {
	border-top: 1px solid rgba(255,255,255,0);
	display: grid;
	gap: 6px;
	margin-top: 0;
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	padding-top: 0;
	transition: max-height 320ms ease, opacity 220ms ease, margin-top 320ms ease, padding-top 320ms ease, border-top-color 220ms ease;
}

.ig-consent.is-detailed .ig-consent__detail {
	border-top-color: rgba(255,255,255,0.15);
	margin-top: 12px;
	max-height: 320px;
	opacity: 1;
	padding-top: 12px;
}

.ig-consent__cat {
	align-items: flex-start;
	border: 1px solid rgba(255,255,255,0.15);
	cursor: pointer;
	display: grid;
	gap: 10px;
	grid-template-columns: 18px minmax(0, 1fr);
	padding: 8px 10px;
	transition: border-color 120ms ease;
}

.ig-consent__cat:hover {
	border-color: var(--ig-accent);
}

.ig-consent__cat input[type="checkbox"] {
	accent-color: var(--ig-accent);
	height: 14px;
	margin-top: 2px;
	width: 14px;
}

.ig-consent__cat input:disabled {
	opacity: 0.5;
}

.ig-consent__cat-body {
	display: block;
	min-width: 0;
}

.ig-consent__cat-name {
	color: var(--ig-paper);
	display: block;
	font-family: var(--ig-font-display);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.ig-consent__cat-note {
	color: rgba(255, 255, 255, 0.55);
	display: block;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: 0.03em;
	margin-top: 2px;
}

.ig-consent__actions {
	display: grid;
	gap: 6px;
	grid-template-columns: 1fr 1fr;
	margin-top: 12px;
}

.ig-consent__actions [data-consent-customize],
.ig-consent__actions [data-consent-save] {
	grid-column: 1 / -1;
}

.ig-consent__btn {
	background: transparent;
	border: 1.5px solid var(--ig-paper);
	color: var(--ig-paper);
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	min-height: 36px;
	padding: 8px 10px;
	text-transform: uppercase;
	transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
}

.ig-consent__btn--ghost {
	border-color: rgba(255,255,255,0.4);
	color: rgba(255,255,255,0.85);
}

.ig-consent__btn--ghost:hover {
	border-color: var(--ig-paper);
	color: var(--ig-paper);
}

.ig-consent__btn--dark {
	background: rgba(255,255,255,0.08);
	border-color: rgba(255,255,255,0.25);
}

.ig-consent__btn--dark:hover {
	background: var(--ig-paper);
	color: var(--ig-ink);
}

.ig-consent__btn--accent {
	background: var(--ig-accent);
	border-color: var(--ig-accent);
	color: var(--ig-accent-ink);
}

.ig-consent__btn--accent:hover {
	background: var(--ig-paper);
	border-color: var(--ig-paper);
}

@media (max-width: 540px) {
	.ig-consent {
		bottom: 12px;
		left: 12px;
		max-width: none;
		width: calc(100% - 24px);
	}
}

.ig-footer-consent {
	background: transparent;
	border: 0;
	color: rgba(255, 255, 255, 0.55);
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.04em;
	line-height: 1.4;
	padding: 0;
	text-transform: uppercase;
	transition: color 120ms ease;
}

.ig-footer-consent:hover {
	color: var(--ig-accent);
}

.ig-site-footer {
	background: var(--ig-ink);
	border-top: var(--ig-stroke-bold) solid var(--ig-line);
	color: var(--ig-paper);
	padding: 64px 0 24px;
}

.ig-site-footer__grid {
	display: grid;
	gap: 40px;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
}

.ig-site-footer__contact-list {
	display: grid;
	gap: 4px 14px;
	grid-template-columns: auto minmax(0, 1fr);
	margin: 0;
}

.ig-site-footer__contact-list dt {
	color: #9a9a9a;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	padding: 4px 0;
	text-transform: uppercase;
}

.ig-site-footer__contact-list dd {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	letter-spacing: 0.02em;
	margin: 0;
	padding: 4px 0;
	text-transform: uppercase;
}

.ig-site-footer__contact-list dd a {
	color: var(--ig-paper);
	display: inline;
	padding: 0;
	text-transform: uppercase;
}

.ig-site-footer__contact-list dd a:hover {
	color: var(--ig-accent);
}

.ig-site-footer h4 {
	color: var(--ig-paper);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: var(--ig-tracking-eyebrow);
	margin: 0 0 14px;
	text-transform: uppercase;
}

.ig-site-footer a {
	color: var(--ig-paper);
	display: block;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	letter-spacing: 0.02em;
	padding: 4px 0;
	text-transform: uppercase;
}

.ig-site-footer a:hover {
	color: var(--ig-accent);
}

/* Footer Project Wizard CTA — egy varázspálca-ikon hívja fel rá a figyelmet */
.ig-site-footer__tool-link {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	color: var(--ig-paper) !important;
	transition: color .15s, transform .15s;
}
.ig-site-footer__tool-link:hover {
	color: var(--ig-accent) !important;
	transform: translateX(2px);
}
.ig-site-footer__tool-icon {
	width: 18px;
	height: 18px;
	color: var(--ig-accent);
	flex-shrink: 0;
	transition: transform .25s ease;
}
.ig-site-footer__tool-link:hover .ig-site-footer__tool-icon {
	transform: scale(1.15) rotate(-6deg);
}

.ig-site-footer__brand {
	font-family: var(--ig-font-display);
	font-size: 28px;
	font-weight: 900;
	letter-spacing: -0.02em;
	margin-bottom: 12px;
	text-transform: uppercase;
}

.ig-site-footer__brand strong {
	color: var(--ig-accent);
}

.ig-site-footer__legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 10px 28px;
	margin-top: 40px;
	padding-top: 24px;
	border-top: var(--ig-stroke) solid rgba(255, 255, 255, 0.18);
}
.ig-site-footer__legal a {
	display: inline-block;
	padding: 0;
	color: rgba(255, 255, 255, 0.7);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	position: relative;
}
.ig-site-footer__legal a:hover {
	color: var(--ig-accent);
}
/* Vízszintes elválasztó pötty a linkek közé (kivéve az első) */
.ig-site-footer__legal a + a::before {
	content: "·";
	position: absolute;
	left: -15px;
	color: rgba(255, 255, 255, 0.3);
}

.ig-site-footer__bottom {
	align-items: center;
	border-top: var(--ig-stroke) solid rgba(255, 255, 255, 0.18);
	color: rgba(255, 255, 255, 0.55);
	display: flex;
	flex-wrap: wrap;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	gap: 16px;
	justify-content: space-between;
	letter-spacing: 0.04em;
	line-height: 1.4;
	margin-top: 28px;
	padding-top: 18px;
	text-transform: uppercase;
}

.ig-site-footer a.ig-footer-dev {
	align-items: center;
	color: rgba(255, 255, 255, 0.55);
	display: inline-flex;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	gap: 6px;
	letter-spacing: 0.04em;
	line-height: 1.4;
	padding: 0;
	text-decoration: none;
	text-transform: uppercase;
	transition: color 220ms ease;
}

.ig-site-footer .ig-footer-dev:hover {
	color: var(--ig-paper);
}

.ig-footer-dev strong {
	color: inherit;
	font-weight: 800;
	letter-spacing: 0.02em;
	transition: color 220ms ease;
}

.ig-site-footer .ig-footer-dev:hover strong {
	color: var(--ig-accent);
}

.ig-footer-dev__heart {
	display: inline-block;
	fill: transparent;
	height: 14px;
	stroke: currentColor;
	stroke-linejoin: round;
	stroke-width: 2;
	transition:
		fill 320ms cubic-bezier(0.4, 0, 0.2, 1),
		stroke 320ms ease,
		transform 360ms cubic-bezier(0.34, 1.56, 0.64, 1);
	vector-effect: non-scaling-stroke;
	width: 14px;
}

.ig-footer-dev:hover .ig-footer-dev__heart {
	animation: ig-heart-beat 700ms ease-in-out 320ms 1;
	fill: #ff2d55;
	stroke: #ff2d55;
	transform: scale(1.25);
}

@keyframes ig-heart-beat {
	0%   { transform: scale(1.25); }
	30%  { transform: scale(1.45); }
	60%  { transform: scale(1.15); }
	100% { transform: scale(1.25); }
}

/* ==========================================================================
   Cat children chip row
   ========================================================================== */

.ig-cat-children {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 28px;
}

.ig-cat-chip {
	background: var(--ig-paper);
	border: var(--ig-stroke) solid var(--ig-line);
	color: var(--ig-ink);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.08em;
	padding: 8px 14px;
	text-transform: uppercase;
}

.ig-cat-chip:hover {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}

/* ==========================================================================
   Responsive
   ========================================================================== */

/* ==========================================================================
   Tablet + phone (≤ 1080px) shared rules — sidebar padding intentionally OUT
   so the phone-only sheet styles below can win without specificity tricks.
   ========================================================================== */

@media (max-width: 1080px) {
	.ig-hero__content {
		grid-template-columns: minmax(0, 1fr) 300px;
		column-gap: 32px;
		row-gap: 0;
	}

	.ig-hero__split {
		grid-template-columns: 1fr;
	}

	.ig-hero__stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ig-hero__stats > div:nth-child(2) {
		border-right: 0;
	}

	.ig-hero__stats > div:nth-child(-n+2) {
		border-bottom: var(--ig-stroke) solid var(--ig-line);
	}

	.ig-shop__layout,
	.ig-product-single,
	.ig-form-grid {
		grid-template-columns: 1fr;
	}

	.ig-shop__main {
		padding-left: 0;
		padding-top: 24px;
	}

	.ig-product-single__media {
		border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
		border-right: 0;
	}

	.ig-site-footer__grid {
		grid-template-columns: 1fr 1fr;
	}
}

/* Tablet-only sidebar layout (only fires between 881–1080). */
@media (min-width: 881px) and (max-width: 1080px) {
	.ig-shop .ig-shop__sidebar {
		border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
		border-right: 0;
		padding: 0 0 24px;
	}
}

/* ==========================================================================
   Phone (≤ 880px) — hamburger menu kicks in
   ========================================================================== */

@media (max-width: 880px) {
	.ig-hamburger {
		display: flex;
		order: 99;
	}

	.ig-site-header__inner {
		align-items: stretch;
		min-height: 64px;
	}

	.ig-brand {
		border-right: 0;
		flex: 1 1 auto;
		font-size: 18px;
		padding: 0 20px;
	}

	/* Hide desktop nav + context in the header; they live in the drawer instead */
	.ig-site-header > .ig-site-header__inner > .ig-nav,
	.ig-site-header > .ig-site-header__inner > .ig-context {
		display: none;
	}

	.ig-cart-btn,
	.ig-cart-btn--account {
		min-height: 64px;
		min-width: 56px;
		padding: 0 16px;
	}

	.ig-cart-btn--account {
		border-left: var(--ig-stroke) solid var(--ig-line);
	}

	.ig-hero__content {
		grid-template-columns: 1fr;
		padding-top: 48px;
		padding-bottom: 32px;
	}

	.ig-dmx {
		display: none;
	}

	.ig-hero__beams {
		display: none;
	}

	.ig-hero__headline {
		font-size: clamp(40px, 12vw, 80px);
	}

	.ig-hero__split {
		gap: 24px;
	}

	.ig-hero__split .ig-actions {
		flex-direction: column;
		width: 100%;
	}

	.ig-hero__split .ig-actions .ig-button {
		justify-content: center;
		width: 100%;
	}

	.ig-account-head {
		flex-direction: column;
		align-items: flex-start;
	}

	.ig-account-tabs {
		overflow-x: auto;
	}

	.ig-account-tabs a {
		flex: 0 0 auto;
		font-size: 12px;
		padding: 14px 16px;
		white-space: nowrap;
	}

	.ig-contact-layout {
		grid-template-columns: 1fr;
	}

	.ig-contact-layout__info {
		border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
		border-right: 0;
		padding: 24px 0;
	}

	.ig-contact-layout__form {
		padding: 24px 0 0;
	}

	.ig-contact-form__grid {
		grid-template-columns: 1fr;
	}

	.ig-contact-form__full {
		grid-column: span 1;
	}
}

/* ==========================================================================
   Small phone (≤ 640px)
   ========================================================================== */

@media (max-width: 640px) {
	:root {
		--ig-gutter-x: 18px;
	}

	.ig-section-head {
		grid-template-columns: 1fr;
	}

	.ig-product-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ig-product-card {
		gap: 12px;
		padding: 12px;
	}

	.ig-product-card h3 {
		font-size: 14px;
		line-height: 1.2;
	}

	.ig-product-card__sku {
		font-size: 10px;
	}

	.ig-product-card__price {
		font-size: 20px;
	}

	.ig-product-card__price small {
		font-size: 10px;
	}

	.ig-product-card__cta .ig-button {
		font-size: 11px;
		letter-spacing: 0.06em;
		min-height: 38px;
		padding: 0 10px;
	}

	.ig-category-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ig-category-tile {
		aspect-ratio: 3 / 2;
		font-size: 18px;
	}

	.ig-table {
		border-width: var(--ig-stroke);
		display: block;
		overflow-x: auto;
	}

	/* Quick Buy table → compact cards on mobile (no SKU, no net price). */
	.ig-quickbuy__table {
		border: 0;
		display: block;
		overflow: visible;
	}
	.ig-quickbuy__table thead { display: none; }
	.ig-quickbuy__table tbody { display: block; }

	.ig-quickbuy__table tr {
		background: var(--ig-paper);
		border: var(--ig-stroke) solid var(--ig-line);
		display: grid;
		gap: 10px 14px;
		grid-template-areas:
			"name  gross"
			"qty   btn";
		grid-template-columns: minmax(0, 1fr) auto;
		margin: 0 0 -1px;
		padding: 12px 14px;
	}

	.ig-quickbuy__table td {
		border: 0;
		padding: 0;
	}

	/* SKU + Net price hidden on mobile. */
	.ig-quickbuy__table td:nth-child(1),
	.ig-quickbuy__sku,
	.ig-quickbuy__table tr > td.ig-quickbuy__col-num:first-of-type {
		display: none;
	}

	/* Name + gross row */
	.ig-quickbuy__table tr > td:nth-child(2) {
		align-self: center;
		font-size: 15px;
		grid-area: name;
		line-height: 1.35;
		min-width: 0;
	}
	.ig-quickbuy__table tr > td:nth-child(2) a {
		font-weight: 700;
		word-break: break-word;
	}

	/* The 4th td is gross (when available) — show big and right-aligned. */
	.ig-quickbuy__table tr > td:nth-child(4) {
		align-self: center;
		font-size: 16px;
		grid-area: gross;
		text-align: right;
		white-space: nowrap;
	}

	/* The "no price" message — when present (rare, td:nth-child(3) with colspan=2) — falls into the gross slot. */
	.ig-quickbuy__table tr > td:nth-child(3)[colspan] {
		display: block;
		grid-area: gross;
		text-align: right;
	}

	/* Qty input + action button row */
	.ig-quickbuy__table tr > td.ig-quickbuy__col-qty {
		align-self: center;
		grid-area: qty;
	}

	.ig-quickbuy__table tr > td:last-child {
		align-self: center;
		grid-area: btn;
		justify-self: end;
	}

	.ig-quickbuy__table tr > td.ig-quickbuy__col-qty input {
		max-width: 80px;
	}

	/* Cart table → stacked cards on mobile. */
	.ig-table[data-cart-table] {
		border: 0;
		overflow: visible;
	}
	.ig-table[data-cart-table] thead { display: none; }
	.ig-table[data-cart-table] tbody { display: block; }

	.ig-table[data-cart-table] tr[data-cart-row] {
		background: var(--ig-paper);
		border: var(--ig-stroke-bold) solid var(--ig-line);
		display: grid;
		gap: 12px 16px;
		grid-template-areas:
			"name remove"
			"qty  price";
		grid-template-columns: minmax(0, 1fr) auto;
		margin: 0 0 -1.5px;
		padding: 14px 16px;
	}

	.ig-table[data-cart-table] tr[data-cart-row] > td {
		border: 0;
		padding: 0;
	}

	.ig-table[data-cart-table] tr[data-cart-row] > td:nth-child(1) {
		grid-area: name;
		line-height: 1.35;
		padding-bottom: 0;       /* desktop reservation not needed on cards */
		position: static;
	}

	/* On mobile cards: meta drops back into flow as a normal small line. */
	.ig-cart-row__meta {
		position: static;
		margin-top: 6px;
		flex-wrap: wrap;
	}

	.ig-table[data-cart-table] tr[data-cart-row] > td:nth-child(2) {
		align-self: center;
		grid-area: qty;
	}

	.ig-table[data-cart-table] tr[data-cart-row] > td:nth-child(3) {
		display: none;
	}

	.ig-table[data-cart-table] tr[data-cart-row] > td:nth-child(4) {
		align-self: center;
		font-size: 18px;
		grid-area: price;
		text-align: right;
		/* Cancel the desktop fixed 140px width on the card layout. */
		min-width: 0;
		width: auto;
	}

	.ig-table[data-cart-table] tr[data-cart-row] > td.ig-cart-row__remove-cell {
		grid-area: remove;
		justify-self: end;
		text-align: right;
		width: auto;
	}

	.ig-checkout h1 {
		font-size: clamp(32px, 9vw, 60px);
	}

	.ig-static h1 {
		font-size: clamp(36px, 11vw, 72px);
	}

	.ig-product-single__body {
		padding: 28px 20px;
	}

	.ig-product-single__body h1 {
		font-size: clamp(26px, 7vw, 44px);
	}

	.ig-site-footer__grid {
		grid-template-columns: 1fr;
	}

	.ig-site-footer__bottom {
		flex-direction: column;
		gap: 8px;
	}

	.ig-cart-btn,
	.ig-cart-btn--account,
	.ig-hamburger {
		padding: 0 12px;
		min-width: 50px;
	}

	.ig-cart-btn svg,
	.ig-cart-btn--account svg {
		height: 22px;
		width: 22px;
	}

	.ig-account-grid,
	.ig-account-guest {
		grid-template-columns: 1fr;
	}

	.ig-account-card--wide {
		grid-column: span 1;
	}

	.ig-shop__main {
		padding-left: 0;
	}

	.ig-fieldset {
		padding: 18px;
	}

	.ig-shipping-toggle {
		padding: 14px 18px;
	}

	/* Force every multi-column form into a single column below 880px so each
	   input gets its own row on mobile. Billing + shipping stack vertically,
	   contact form fields stack, checkout address grids stack. */
	.ig-form-grid,
	.ig-contact-form__grid,
	.ig-fieldset,
	.ig-checkout__step form,
	.ig-account-card form {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.ig-form-grid > .ig-fieldset + .ig-fieldset {
		margin-top: -1.5px;
	}

	.ig-fieldset label.ig-span-2 {
		grid-column: auto;
	}

	.ig-form-grid > div[style*="grid-column"] {
		grid-column: auto !important;
	}
}

/* ===================================================================== */
/* News (Hírek)                                                           */
/* ===================================================================== */

.ig-news {
	padding: var(--ig-gutter-y) 0;
}

/* Hírek (news) cikk-típus szűrő pirulák a /hirek/ oldalon */
.ig-news-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 32px 0;
}
.ig-news-filter__pill {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	border-radius: 0;
	color: var(--ig-ink);
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	padding: 8px 14px;
	text-transform: uppercase;
	transition: background 120ms ease, color 120ms ease;
}
.ig-news-filter__pill:hover {
	background: var(--ig-bone);
}
.ig-news-filter__pill.is-active {
	background: var(--ig-ink);
	color: var(--ig-paper);
}
.ig-news-results {
	transition: opacity 150ms ease;
}

/* Inline product embeds from [ig_product] / [ig_products] inside news/page copy */
.ig-inline-product,
.ig-inline-products {
	margin: 32px 0;
}

.ig-inline-product .ig-product-card {
	max-width: 420px;
}

/* [ig_products] cikkben: rögzített 3 kártya / sor, hogy ne az auto-fit
   szabály diktálja (ami a cikk konténer szélességétől függően 2-4 közt
   ingadozik). Tabletre 2, telefonra 1. !important azért, hogy semmilyen
   szülő media query (pl. mobile-os .ig-product-grid override) ne tudja
   visszanyomni. */
.ig-inline-products,
.ig-inline-products.ig-product-grid {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 0;
}
@media (max-width: 900px) {
	.ig-inline-products,
	.ig-inline-products.ig-product-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 560px) {
	.ig-inline-products,
	.ig-inline-products.ig-product-grid {
		grid-template-columns: 1fr !important;
	}
}

/* ===================================================================== */
/* Brand archive (/marka/<slug>/)                                          */
/* ===================================================================== */

.ig-brand-archive {
	padding-top: 32px;
	padding-bottom: 64px;
}

.ig-brand-archive__head {
	margin-bottom: 32px;
}

.ig-brand-archive__head h1 {
	font-family: var(--ig-font-display);
	font-size: clamp(48px, 8vw, 120px);
	font-weight: 900;
	letter-spacing: -0.04em;
	line-height: 0.95;
	margin: 4px 0 16px;
	text-transform: uppercase;
}

.ig-brand-archive__lead {
	color: var(--ig-muted);
	font-size: 16px;
	line-height: 1.55;
	margin: 0;
	max-width: 60ch;
}

.ig-brand-archive__loadmore {
	display: flex;
	justify-content: center;
	margin-top: 32px;
}

.ig-brand-archive__loadmore[hidden] {
	display: none;
}

/* ===================================================================== */
/* Brand index (/marka/)                                                  */
/* ===================================================================== */

.ig-brand-index {
	padding-top: 0;
	padding-bottom: 80px;
}

.ig-brand-index__head h1 {
	font-family: var(--ig-font-display);
	font-size: clamp(40px, 7vw, 96px);
	font-weight: 900;
	letter-spacing: -0.03em;
	line-height: 0.95;
	margin: 4px 0 16px;
}

.ig-brand-index__lead {
	color: var(--ig-muted);
	font-size: 16px;
	line-height: 1.55;
	margin: 0 0 32px;
	max-width: 64ch;
}

.ig-brand-index__alpha {
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	border-top: var(--ig-stroke-bold) solid var(--ig-line);
	display: flex;
	flex-wrap: wrap;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	font-weight: 800;
	gap: 0;
	letter-spacing: 0.08em;
	margin-bottom: 32px;
	padding: 14px 0;
	text-transform: uppercase;
}

.ig-brand-index__alpha a {
	color: var(--ig-ink);
	display: inline-block;
	padding: 6px 10px;
	text-decoration: none;
	transition: background 100ms ease, color 100ms ease;
}

.ig-brand-index__alpha a:hover,
.ig-brand-index__alpha a:focus-visible {
	background: var(--ig-ink);
	color: var(--ig-paper);
	outline: 0;
}

.ig-brand-index__section {
	margin-bottom: 48px;
	scroll-margin-top: 80px;
}

.ig-brand-index__letter {
	border-bottom: var(--ig-stroke-bold) solid var(--ig-line);
	font-family: var(--ig-font-display);
	font-size: clamp(40px, 6vw, 72px);
	font-weight: 900;
	letter-spacing: -0.04em;
	line-height: 1;
	margin: 0 0 16px;
	padding-bottom: 4px;
}

.ig-brand-index__grid {
	display: grid;
	gap: 0;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.ig-brand-card {
	align-items: center;
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	color: var(--ig-ink);
	display: flex;
	gap: 12px;
	justify-content: space-between;
	margin: 0 -1.5px -1.5px 0;
	min-height: 92px;
	padding: 18px 20px;
	position: relative;
	text-decoration: none;
	transition: background 140ms ease, color 140ms ease, transform 140ms ease;
}

.ig-brand-card:hover,
.ig-brand-card:focus-visible {
	background: var(--ig-ink);
	color: var(--ig-paper);
	outline: 0;
	transform: translate(-2px, -2px);
	z-index: 2;
}

.ig-brand-card__name {
	font-family: var(--ig-font-display);
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.1;
}

.ig-brand-card__count {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	margin-left: auto;
	text-transform: uppercase;
}

.ig-brand-card:hover .ig-brand-card__count,
.ig-brand-card:focus-visible .ig-brand-card__count {
	color: rgba(255, 255, 255, 0.7);
}

.ig-brand-card__arrow {
	color: var(--ig-accent);
	font-family: var(--ig-font-display);
	font-size: 20px;
	font-weight: 900;
	line-height: 1;
}

@media (max-width: 720px) {
	.ig-brand-index__head h1 {
		font-size: clamp(32px, 9vw, 56px);
	}
	.ig-brand-index__grid {
		grid-template-columns: 1fr;
	}
	.ig-brand-card {
		min-height: 76px;
		padding: 16px 18px;
	}
	.ig-brand-card__name {
		font-size: 18px;
	}
}

/* ===================================================================== */
/* Public serial-number checker page                                       */
/* ===================================================================== */

.ig-serial-check {
	padding-top: 0;
	padding-bottom: 64px;
}

.ig-serial-check__lead {
	color: var(--ig-muted);
	font-size: 16px;
	line-height: 1.5;
	margin: 8px 0 0;
	max-width: 60ch;
}

.ig-serial-check__form {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	box-shadow: 6px 6px 0 var(--ig-ink);
	margin: 32px 0;
	padding: 28px;
}

.ig-serial-check__form > label.ig-eyebrow {
	color: var(--ig-ink);
	display: block;
	margin-bottom: 10px;
}

.ig-serial-check__row {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.ig-serial-check__row input {
	background: #fff;
	border: var(--ig-stroke-bold) solid var(--ig-line);
	flex: 1;
	font-family: var(--ig-font-mono);
	font-size: 18px;
	font-weight: 700;
	min-width: 240px;
	padding: 14px 16px;
}

.ig-serial-check__row input:focus {
	outline: 3px solid var(--ig-accent);
	outline-offset: -3px;
}

.ig-serial-check__result {
	margin: 24px 0;
}

.ig-serial-check__loading {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 14px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ig-serial-check__panel {
	background: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-line);
	padding: 28px;
}

.ig-serial-check__panel h2 {
	font-family: var(--ig-font-display);
	font-size: clamp(24px, 4vw, 40px);
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 1.05;
	margin: 8px 0 18px;
}

.ig-serial-check__panel.is-error,
.ig-serial-check__panel.is-notfound {
	border-color: var(--ig-line);
}

.ig-serial-check__panel.is-error h2 {
	color: #d8483b;
}

.ig-serial-check__panel.is-notfound {
	background: #f4f4f0;
}

.ig-serial-check__panel.is-found {
	box-shadow: 6px 6px 0 var(--ig-ink);
}

.ig-serial-check__panel dl {
	display: grid;
	gap: 8px 18px;
	grid-template-columns: max-content 1fr;
	margin: 0 0 18px;
}

.ig-serial-check__panel dt {
	color: var(--ig-muted);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ig-serial-check__panel dd {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	margin: 0;
}

.ig-serial-check__warranty {
	align-items: center;
	border: 2px solid var(--ig-line);
	display: flex;
	gap: 16px;
	padding: 14px 18px;
}

.ig-serial-check__warranty.is-active {
	background: #15803D;
	color: #fff;
}

.ig-serial-check__warranty.is-expired {
	background: #d8483b;
	color: #fff;
}

.ig-serial-check__warranty-icon {
	background: rgba(255, 255, 255, 0.18);
	font-family: var(--ig-font-display);
	font-size: 28px;
	font-weight: 900;
	height: 48px;
	line-height: 48px;
	text-align: center;
	width: 48px;
}

.ig-serial-check__warranty strong {
	display: block;
	font-family: var(--ig-font-mono);
	font-size: 16px;
	font-weight: 900;
	letter-spacing: 0.06em;
}

.ig-serial-check__warranty small {
	color: rgba(255, 255, 255, 0.85);
	display: block;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	margin-top: 4px;
}

.ig-serial-check__note {
	background: #f4f4f0;
	border-left: 4px solid var(--ig-accent);
	color: var(--ig-muted);
	font-size: 13px;
	line-height: 1.6;
	margin: 32px 0 0;
	padding: 16px 20px;
}

.ig-serial-check__note p {
	margin: 0 0 6px;
}

.ig-serial-check__note p:last-child {
	margin: 0;
}

/* ===================================================================== */
/* FAQ accordion on legal / shipping pages                                */
/* ===================================================================== */

.ig-faq {
	margin: 64px 0 24px;
}

.ig-faq__head {
	margin-bottom: 24px;
}

.ig-faq__head h2 {
	font-family: var(--ig-font-display);
	font-size: clamp(28px, 4vw, 48px);
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 1;
	margin: 4px 0 0;
}

.ig-faq__list {
	border-top: var(--ig-stroke-bold) solid var(--ig-line);
}

.ig-faq__item {
	border-bottom: var(--ig-stroke) solid var(--ig-line);
}

.ig-faq__item > summary {
	cursor: pointer;
	font-family: var(--ig-font-display);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.005em;
	list-style: none;
	padding: 18px 40px 18px 4px;
	position: relative;
	transition: background 120ms ease;
}

.ig-faq__item > summary::-webkit-details-marker {
	display: none;
}

.ig-faq__item > summary::after {
	color: var(--ig-accent);
	content: "+";
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	transition: transform 200ms ease;
}

.ig-faq__item[open] > summary {
	background: rgba(0, 0, 0, 0.02);
}

.ig-faq__item[open] > summary::after {
	content: "−";
}

.ig-faq__item > summary:hover {
	background: rgba(0, 0, 0, 0.04);
}

.ig-faq__answer {
	color: var(--ig-ink);
	font-size: 15px;
	line-height: 1.65;
	padding: 0 40px 22px 4px;
}

.ig-faq__answer > p:first-child {
	margin-top: 0;
}

.ig-faq__answer > p:last-child {
	margin-bottom: 0;
}

.ig-news-grid {
	display: grid;
	gap: 0;
	border: var(--ig-stroke-bold) solid var(--ig-ink);
	background: var(--ig-ink);
}

.ig-news-grid--3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ig-news-grid--hero {
	grid-template-columns: minmax(0, 1fr);
	margin-bottom: -3px;
}

.ig-news-grid--hero + .ig-news-grid--3 {
	border-top: 0;
}

.ig-news-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--ig-paper);
	color: var(--ig-ink);
	text-decoration: none;
	border-right: var(--ig-stroke-bold) solid var(--ig-ink);
	border-bottom: var(--ig-stroke-bold) solid var(--ig-ink);
	margin: 0 -1.5px -1.5px 0;
	min-height: 320px;
	transition: background-color 0.18s ease, transform 0.18s ease;
}

.ig-news-card:hover,
.ig-news-card:focus-visible {
	background: var(--ig-bone);
	outline: none;
}

.ig-news-card:hover .ig-news-card__cta,
.ig-news-card:focus-visible .ig-news-card__cta {
	color: var(--ig-accent-ink);
	background: var(--ig-accent);
}

.ig-news-card__media {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	border-bottom: var(--ig-stroke) solid var(--ig-ink);
	background: var(--ig-bone);
}

.ig-news-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}

.ig-news-card:hover .ig-news-card__media img {
	transform: scale(1.04);
}

.ig-news-card__body {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 24px;
	flex: 1 1 auto;
}

.ig-news-card__date {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ig-muted);
}

.ig-news-card__title {
	font-family: var(--ig-font-display);
	font-size: clamp(20px, 2.2vw, 28px);
	line-height: 1.05;
	margin: 0;
	letter-spacing: -0.01em;
}

.ig-news-card__excerpt {
	margin: 0;
	color: var(--ig-muted);
	font-size: 15px;
	line-height: 1.5;
}

.ig-news-card__cta {
	margin-top: auto;
	align-self: flex-start;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 8px 14px;
	border: var(--ig-stroke) solid var(--ig-ink);
	color: var(--ig-ink);
	background: transparent;
	transition: background-color 0.18s ease, color 0.18s ease;
}

/* Hero card layout (used on /hirek/ archive top + can re-use elsewhere) */
.ig-news-card--hero {
	flex-direction: row;
	min-height: 420px;
}

.ig-news-card--hero .ig-news-card__media {
	flex: 1 1 56%;
	border-right: var(--ig-stroke-bold) solid var(--ig-ink);
	border-bottom: 0;
	aspect-ratio: auto;
}

.ig-news-card--hero .ig-news-card__body {
	flex: 1 1 44%;
	gap: 18px;
	padding: clamp(28px, 4vw, 48px);
	justify-content: center;
}

.ig-news-card--hero .ig-news-card__title {
	font-size: clamp(32px, 4.5vw, 56px);
}

.ig-news-card--hero .ig-news-card__excerpt {
	font-size: 17px;
}

/* Archive page */
.ig-news-page {
	padding-bottom: var(--ig-gutter-y);
}

/* News archive head: same base look + a little extra breathing room below
   to clear the featured-news card that follows. */
.ig-page-head--news {
	padding-bottom: 32px;
}

.ig-page-head__intro {
	max-width: 720px;
	color: var(--ig-muted);
	font-size: 17px;
	line-height: 1.55;
	margin: 16px 0 0;
}

.ig-news-pagination {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 48px;
	padding-top: 32px;
	border-top: var(--ig-stroke) solid var(--ig-ink);
}

.ig-news-pagination__info {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ig-muted);
}

/* Single news */
.ig-news-single {
	padding-top: 32px;
	padding-bottom: var(--ig-gutter-y);
	max-width: 920px;
}

.ig-news-single__back {
	margin-bottom: 24px;
}

.ig-news-single__back-link {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ig-ink);
	text-decoration: none;
	border-bottom: var(--ig-stroke) solid var(--ig-ink);
	padding-bottom: 2px;
}

.ig-news-single__back-link:hover {
	background: var(--ig-accent);
}

.ig-news-single__head {
	margin-bottom: 32px;
	padding-bottom: 24px;
	border-bottom: var(--ig-stroke-bold) solid var(--ig-ink);
}

.ig-news-single__title {
	font-family: var(--ig-font-display);
	font-size: clamp(34px, 5.5vw, 68px);
	line-height: 1.02;
	letter-spacing: -0.02em;
	margin: 12px 0;
}

.ig-news-single__date {
	font-family: var(--ig-font-mono);
	font-size: 13px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ig-muted);
}

.ig-news-single__media {
	margin: 0 0 40px;
	border: var(--ig-stroke-bold) solid var(--ig-ink);
	overflow: hidden;
	/* 16:9 keret — square AI-képek és véletlen méretű feltöltések egyaránt
	   konzisztens, nem-túl-magas hero-t adnak. object-fit: cover megőrzi
	   az arányt és középre vág, nem torzít. */
	aspect-ratio: 16 / 9;
	max-height: 480px;
}

.ig-news-single__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ig-news-single__body {
	font-size: 18px;
	line-height: 1.65;
}

.ig-news-single__body p {
	margin: 0 0 1.2em;
}

.ig-news-single__body h2,
.ig-news-single__body h3 {
	font-family: var(--ig-font-display);
	letter-spacing: -0.01em;
	margin: 1.8em 0 0.6em;
}

.ig-news-single__body h2 { font-size: clamp(24px, 3vw, 36px); }
.ig-news-single__body h3 { font-size: clamp(20px, 2.4vw, 28px); }

.ig-news-single__body a {
	color: var(--ig-ink);
	border-bottom: var(--ig-stroke) solid var(--ig-ink);
	text-decoration: none;
}

.ig-news-single__body a:hover {
	background: var(--ig-accent);
}

.ig-news-single__body img {
	max-width: 100%;
	height: auto;
	border: var(--ig-stroke) solid var(--ig-ink);
}

.ig-news-single__body blockquote {
	margin: 1.5em 0;
	padding: 1em 1.5em;
	border-left: var(--ig-stroke-bold) solid var(--ig-ink);
	background: var(--ig-bone);
	font-family: var(--ig-font-display);
	font-size: 22px;
	line-height: 1.3;
}

/* Tablet */
@media (max-width: 960px) {
	.ig-news-grid--3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ig-news-card--hero {
		flex-direction: column;
		min-height: 0;
	}

	.ig-news-card--hero .ig-news-card__media {
		border-right: 0;
		border-bottom: var(--ig-stroke-bold) solid var(--ig-ink);
		aspect-ratio: 16 / 10;
	}
}

/* Mobile */
@media (max-width: 640px) {
	.ig-news-grid--3 {
		grid-template-columns: minmax(0, 1fr);
	}

	.ig-news-card {
		min-height: 0;
	}

	.ig-news-card__body {
		padding: 20px;
	}

	.ig-news-card__title {
		font-size: 22px;
	}

	.ig-news-pagination {
		flex-direction: column;
		gap: 12px;
	}

	.ig-news-single__body {
		font-size: 16px;
	}
}

/* ===================================================================== */
/* Toast (add-to-cart confirmation, bottom-right)                          */
/* ===================================================================== */

.ig-toast-stack {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 9999;
	display: flex;
	flex-direction: column;
	gap: 12px;
	pointer-events: none;
	max-width: min(420px, calc(100vw - 32px));
}

.ig-toast {
	pointer-events: auto;
	display: grid;
	grid-template-columns: 36px 1fr auto auto;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	background: var(--ig-ink);
	color: var(--ig-paper);
	border: var(--ig-stroke-bold) solid var(--ig-ink);
	box-shadow: 6px 6px 0 0 var(--ig-accent);
	font-family: var(--ig-font-mono);
	opacity: 0;
	transform: translateX(24px);
	transition: opacity 0.22s ease, transform 0.22s ease;
}

.ig-toast.is-shown {
	opacity: 1;
	transform: translateX(0);
}

.ig-toast.is-leaving {
	opacity: 0;
	transform: translateX(24px);
}

.ig-toast--error {
	background: var(--ig-danger);
	color: var(--ig-paper);
	box-shadow: 6px 6px 0 0 var(--ig-ink);
}

.ig-toast__icon {
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--ig-accent);
	color: var(--ig-ink);
	font-size: 22px;
	font-weight: 900;
	line-height: 1;
}

.ig-toast--error .ig-toast__icon {
	background: var(--ig-paper);
	color: var(--ig-danger);
}

.ig-toast__body {
	min-width: 0;
}

.ig-toast__title {
	font-family: var(--ig-font-display);
	font-size: 13px;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.1;
}

.ig-toast__meta {
	margin-top: 3px;
	font-size: 12px;
	letter-spacing: 0.02em;
	color: var(--ig-paper);
	opacity: 0.78;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ig-toast__cta {
	display: inline-block;
	padding: 6px 10px;
	background: var(--ig-accent);
	color: var(--ig-ink);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	border: var(--ig-stroke) solid var(--ig-accent);
	white-space: nowrap;
}

.ig-toast__cta:hover {
	background: var(--ig-paper);
	border-color: var(--ig-paper);
	color: var(--ig-ink);
}

.ig-toast--error .ig-toast__cta {
	background: var(--ig-paper);
	color: var(--ig-danger);
	border-color: var(--ig-paper);
}

.ig-toast__close {
	background: transparent;
	border: 0;
	color: var(--ig-paper);
	font-size: 20px;
	line-height: 1;
	padding: 4px 8px;
	cursor: pointer;
	opacity: 0.7;
}

.ig-toast__close:hover {
	opacity: 1;
}

@media (max-width: 640px) {
	.ig-toast-stack {
		right: 12px;
		bottom: 12px;
		left: 12px;
		max-width: none;
	}
	.ig-toast {
		grid-template-columns: 32px 1fr auto;
		padding: 12px 12px;
	}
	.ig-toast__icon { width: 32px; height: 32px; font-size: 18px; }
	.ig-toast__cta { display: none; }
}



/* ============================================================
   Impresszum (legal imprint) — INV-MUSIC Kft. cégadatok
   ============================================================ */

.ig-impresszum { padding-bottom: 80px; }

.ig-impresszum__lead {
	max-width: 720px;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	line-height: 1.6;
	color: var(--ig-ink-soft, #555);
	letter-spacing: 0.02em;
}

.ig-impresszum__grid {
	display: grid;
	grid-template-columns: 220px 1fr 1fr;
	gap: 22px;
	margin-top: 32px;
	align-items: start;
}

.ig-impresszum__brand {
	background: var(--ig-ink);
	color: var(--ig-paper);
	border: 3px solid var(--ig-ink);
	padding: 22px 18px;
	text-align: center;
	position: sticky;
	top: 100px;
}

.ig-impresszum__logo {
	display: block;
	width: 100%;
	max-width: 140px;
	height: auto;
	margin: 0 auto 14px;
	filter: invert(1);
}

.ig-impresszum__brand-line {
	margin: 0;
	font-family: var(--ig-font-display);
	font-weight: 900;
	font-size: 22px;
	letter-spacing: -0.02em;
}
.ig-impresszum__brand-line strong {
	background: var(--ig-accent);
	color: var(--ig-ink);
	padding: 0 5px;
}

.ig-impresszum__brand-sub {
	margin: 10px 0 0;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ig-accent);
}

.ig-impresszum__panel {
	background: var(--ig-paper);
	border: 3px solid var(--ig-ink);
	padding: 22px 24px;
}

.ig-impresszum__panel h2 {
	margin: 0 0 14px;
	font-family: var(--ig-font-display);
	font-size: 18px;
	font-weight: 900;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--ig-ink);
}

.ig-impresszum__list {
	margin: 0;
	padding: 0;
	display: grid;
	gap: 10px;
}

.ig-impresszum__row {
	display: grid;
	grid-template-columns: 180px 1fr;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px dashed rgba(10,10,10,0.15);
}
.ig-impresszum__row:last-child { border-bottom: 0; }

.ig-impresszum__row dt {
	margin: 0;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ig-ink-soft, #555);
	align-self: center;
}

.ig-impresszum__row dd {
	margin: 0;
	font-family: var(--ig-font-display);
	font-size: 14px;
	font-weight: 700;
	color: var(--ig-ink);
	word-break: break-word;
}
.ig-impresszum__row dd a {
	color: var(--ig-ink);
	text-decoration: none;
	border-bottom: 2px solid var(--ig-accent);
	transition: background 0.15s ease;
}
.ig-impresszum__row dd a:hover {
	background: var(--ig-accent);
}

.ig-impresszum__legal {
	margin-top: 28px;
	padding: 18px 20px;
	background: var(--ig-paper-soft, #f3f3f1);
	border-left: 6px solid var(--ig-accent);
	font-family: var(--ig-font-mono);
	font-size: 12px;
	line-height: 1.6;
	letter-spacing: 0.02em;
}
.ig-impresszum__legal a {
	color: var(--ig-ink);
	font-weight: 700;
	text-decoration: underline;
	text-decoration-color: var(--ig-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

@media (max-width: 900px) {
	.ig-impresszum__grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	.ig-impresszum__brand {
		position: static;
	}
	.ig-impresszum__row {
		grid-template-columns: 1fr;
		gap: 2px;
	}
	.ig-impresszum__row dt {
		font-size: 10px;
	}
}


/* ============================================================
   Legal pages — ÁSZF / Adatkezelés dinamikus virtualjog tartalom
   ============================================================ */

.ig-legal { padding-bottom: 80px; }

.ig-legal__head {
	border-bottom: 3px solid var(--ig-ink);
	padding-bottom: 18px;
	margin-bottom: 28px;
}

.ig-legal__meta {
	margin: 12px 0 0;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #6b6b6b;
}

.ig-legal__layout {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: 32px;
	align-items: start;
}

.ig-legal__toc {
	position: sticky;
	top: 100px;
	background: var(--ig-paper);
	border: 3px solid var(--ig-ink);
	padding: 18px 16px;
	max-height: calc(100vh - 120px);
	overflow-y: auto;
}

.ig-legal__toc-title {
	margin: 0 0 12px;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.16em;
	color: #6b6b6b;
	text-transform: uppercase;
}

.ig-legal__toc ol {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: legal-toc;
}

.ig-legal__toc li {
	counter-increment: legal-toc;
	margin: 0 0 6px;
	padding: 0;
}

.ig-legal__toc li a {
	display: flex;
	gap: 8px;
	padding: 6px 4px;
	font-family: var(--ig-font-display);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--ig-ink);
	text-decoration: none;
	border-bottom: 1px solid rgba(10,10,10,0.08);
	transition: background 0.15s ease, color 0.15s ease;
}

.ig-legal__toc li a::before {
	content: counter(legal-toc, decimal-leading-zero);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	color: #6b6b6b;
	flex-shrink: 0;
}

.ig-legal__toc li a:hover {
	background: var(--ig-accent);
	color: var(--ig-ink);
}

.ig-legal__content {
	background: var(--ig-paper);
	border: 3px solid var(--ig-ink);
	padding: 32px 36px;
}

.ig-legal__content h2 {
	margin: 28px 0 14px;
	padding-top: 18px;
	border-top: 3px solid var(--ig-ink);
	font-family: var(--ig-font-display);
	font-size: 22px;
	font-weight: 900;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	scroll-margin-top: 100px;
}
.ig-legal__content > h2:first-child {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.ig-legal__content h3 {
	margin: 22px 0 10px;
	font-family: var(--ig-font-display);
	font-size: 16px;
	font-weight: 800;
	letter-spacing: -0.01em;
	scroll-margin-top: 100px;
}

.ig-legal__content h4 {
	margin: 18px 0 8px;
	font-size: 14px;
	font-weight: 700;
}

.ig-legal__content p {
	margin: 0 0 12px;
	font-size: 15px;
	line-height: 1.65;
	color: #1c1c1c;
}

.ig-legal__content ul,
.ig-legal__content ol {
	margin: 0 0 14px 22px;
	padding: 0;
}

.ig-legal__content li {
	margin: 0 0 6px;
	font-size: 15px;
	line-height: 1.6;
}

.ig-legal__content a {
	color: var(--ig-ink);
	text-decoration: underline;
	text-decoration-color: var(--ig-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
	overflow-wrap: anywhere;
}

.ig-legal__content a:hover {
	background: var(--ig-accent);
}

.ig-legal__content strong,
.ig-legal__content b {
	font-weight: 800;
}

.ig-legal__content blockquote {
	margin: 14px 0;
	padding: 14px 18px;
	background: #f3f3f1;
	border-left: 6px solid var(--ig-accent);
	font-style: italic;
}

.ig-legal__content table {
	width: 100%;
	margin: 16px 0;
	border-collapse: collapse;
	font-size: 14px;
}
.ig-legal__content th,
.ig-legal__content td {
	padding: 10px 12px;
	text-align: left;
	border: 1px solid var(--ig-ink);
	vertical-align: top;
}
.ig-legal__content thead th {
	background: var(--ig-ink);
	color: var(--ig-paper);
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.ig-legal__warning {
	padding: 16px 18px;
	background: #fef9c3;
	border: 2px solid #ca8a04;
	font-family: var(--ig-font-mono);
	font-size: 13px;
	letter-spacing: 0.02em;
	color: #1c1c1c;
}

@media (max-width: 900px) {
	.ig-legal__layout {
		grid-template-columns: 1fr;
		gap: 18px;
	}
	.ig-legal__toc {
		position: static;
		max-height: none;
	}
	.ig-legal__content {
		padding: 22px 18px;
	}
	.ig-legal__content h2 { font-size: 18px; }
}

/* ===== Stock alert form (out-of-stock product page) ===== */
.ig-product-page__notify { padding: 16px; border: 3px solid #0a0a0a; background: #fff; }
.ig-stock-alert__title { margin: 0 0 6px 0; font-size: 18px; font-weight: 900; letter-spacing: -.01em; text-transform: uppercase; }
.ig-stock-alert__lead { margin: 0 0 12px 0; font-size: 13px; color: #444; }
.ig-stock-alert__form { display: flex; gap: 8px; }
.ig-stock-alert__form input[type=email] { flex: 1; padding: 10px 12px; border: 2px solid #0a0a0a; font-family: inherit; }
.ig-stock-alert__msg { margin: 8px 0 0 0; padding: 8px 10px; font-size: 13px; }
.ig-stock-alert__msg.is-ok { background: #E8FF00; }
.ig-stock-alert__msg.is-err { background: #fee; color: #a33; }

/* ===== Wishlist + compare pin row ===== */
.ig-product-page__pinrow { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 16px; }
.ig-pin-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border: 2px solid #0a0a0a; background: #fff; color: #0a0a0a; cursor: pointer; font-family: inherit; font-weight: 700; transition: background .15s, color .15s; -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent; text-decoration: none; }
.ig-pin-btn:hover { background: #f6f6f4; }
.ig-pin-btn.is-on { background: var(--ig-accent, #E8FF00); }
/* Kedvenc (wishlist) jelölés — egyértelmű PIROS, mobilon és desktopon is. */
[data-wishlist-btn].is-on { background: #ffe9eb; border-color: #e11d2a; color: #e11d2a; }
.ig-pin-btn__icon { display: inline-flex; line-height: 0; }
.ig-pin-btn__icon svg { width: 18px; height: 18px; display: block; }
[data-wishlist-btn].is-on .ig-pin-btn__icon svg { fill: #e11d2a; stroke: #e11d2a; }
.ig-pin-btn__label { font-family: var(--ig-font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.ig-pin-btn:disabled { opacity: .5; cursor: wait; }
/* Mobilon: CSAK ikonok — címke elrejtve, négyzetes, érintőbarát gombok. */
@media (max-width: 640px) {
	.ig-product-page__pinrow { gap: 10px; }
	.ig-product-page__pinrow .ig-pin-btn { width: 52px; height: 52px; padding: 0; gap: 0; justify-content: center; }
	.ig-product-page__pinrow .ig-pin-btn__label { display: none; }
	.ig-product-page__pinrow .ig-pin-btn__icon svg { width: 24px; height: 24px; }
}

/* ===== Wishlist grid in account ===== */
.ig-wishlist-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.ig-wishlist-card { display: flex; flex-direction: column; border: 3px solid #0a0a0a; background: #fff; position: relative; transition: transform .15s; }
.ig-wishlist-card:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 #0a0a0a; }
.ig-wishlist-card__link { display: block; text-decoration: none; color: inherit; flex: 1; }
.ig-wishlist-card__link img { display: block; width: 100%; aspect-ratio: 1/1; object-fit: cover; border-bottom: 2px solid #0a0a0a; }
.ig-wishlist-card__body { padding: 10px 12px; }
.ig-wishlist-card__body h3 { margin: 0 0 6px 0; font-size: 14px; font-weight: 700; letter-spacing: -.01em; line-height: 1.3; }
.ig-wishlist-card__price { margin: 0; font-weight: 900; font-size: 15px; }
.ig-wishlist-card__actions { display: flex; align-items: stretch; gap: 0; border-top: 2px solid #0a0a0a; }
.ig-wishlist-card__cart { flex: 1; border: none; border-radius: 0; padding: 10px 12px; font-family: var(--ig-font-mono); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.ig-wishlist-card__cart:disabled { opacity: .6; cursor: wait; }
.ig-wishlist-card__oos { flex: 1; padding: 10px 12px; text-align: center; font-family: var(--ig-font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #6B6B6B; background: #f6f6f4; }
.ig-wishlist-card__remove { width: 38px; background: #fff; border: none; border-left: 2px solid #0a0a0a; cursor: pointer; font-size: 20px; line-height: 1; color: #0a0a0a; }
.ig-wishlist-card__remove:hover { background: #0a0a0a; color: #fff; }
.ig-wishlist-msg { margin: 12px 0 0 0; padding: 10px 14px; border: 2px solid #0a0a0a; font-size: 13px; }
.ig-wishlist-msg.is-ok { background: #E8FF00; }
.ig-wishlist-msg.is-err { background: #fee; color: #a33; }

/* ===== Search overlay — header alól lecsapódó "blade" panel ===== */
.ig-search-toggle { border: 0; cursor: pointer; }
.ig-search-toggle[aria-expanded="true"] { background: var(--ig-accent); color: var(--ig-accent-ink); }

/* Full-width overlay below the sticky header. A sárga shadow indikálja a brutalist
   karaktert, a panel a tetejéről csapódik le. */
.ig-search-panel {
	position: fixed;
	top: 0; /* a panel a viewport tetejétől indul, de a header alóla bukkan elő */
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 20; /* a header (z-index: 30) alá — innen jön elő a panel */
	background: rgba(10, 10, 10, 0);
	pointer-events: none;
	transition: background .35s cubic-bezier(.4, 0, .2, 1);
}
.ig-search-panel[hidden] { display: none; }
.ig-search-panel.is-open {
	background: rgba(10, 10, 10, .42);
	pointer-events: auto;
}

.ig-search-panel__inner {
	background: var(--ig-paper);
	border-bottom: 6px solid var(--ig-line);
	box-shadow: 0 8px 0 0 var(--ig-accent), 0 8px 0 1px var(--ig-line);
	width: 100%;
	/* Header 80px + 88px légtér az alján → a panel max kb 75% magasság, alatta
	   látszik az oldal tartalma és a sárga shadow. A belső __results görget. */
	max-height: calc(100vh - 168px);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	transform: translate3d(0, -100%, 0);
	transition: transform .42s cubic-bezier(.22, 1.06, .36, 1);
	will-change: transform;
}
.ig-search-panel.is-open .ig-search-panel__inner {
	transform: translate3d(0, 80px, 0);
}

.ig-search-panel__form {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 20px 32px;
	border-bottom: 3px solid var(--ig-line);
	max-width: 1240px;
	margin: 0 auto;
	width: 100%;
	box-sizing: border-box;
	flex-shrink: 0;
}
.ig-search-panel__icon { width: 26px; height: 26px; flex-shrink: 0; opacity: .55; }
.ig-search-panel__form input[type=search] {
	flex: 1; min-width: 0; border: none; outline: none;
	padding: 8px 0;
	font-size: 24px; font-family: inherit;
	background: transparent; font-weight: 700;
	letter-spacing: -.01em;
}
.ig-search-panel__form input[type=search]::placeholder { color: var(--ig-muted); font-weight: 500; }
.ig-search-panel__close {
	background: var(--ig-ink); color: var(--ig-paper);
	border: 0; width: 40px; height: 40px; font-size: 24px; line-height: 1;
	cursor: pointer; flex-shrink: 0;
	transition: background .15s, color .15s;
}
.ig-search-panel__close:hover { background: var(--ig-accent); color: var(--ig-accent-ink); }

.ig-search-panel__hint {
	padding: 32px;
	font-family: var(--ig-font-mono); font-size: 12px; letter-spacing: .12em;
	text-transform: uppercase; color: var(--ig-muted); text-align: center;
	max-width: 1240px; margin: 0 auto; width: 100%; box-sizing: border-box;
	flex-shrink: 0;
}
/* Görgetésért felelős konténer — minden találat a belső grid-ben van */
.ig-search-panel__results {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
}
.ig-search-panel__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	padding: 24px 32px 32px;
	max-width: 1240px;
	margin: 0 auto;
	width: 100%;
	box-sizing: border-box;
}

/* Kártya wrapper — a link + kosár gomb külön elemek, hogy a kosár ne kövesse a linket */
.ig-search-panel__hit-wrap {
	display: flex;
	flex-direction: column;
	background: var(--ig-paper);
	border: 2px solid var(--ig-line);
	overflow: hidden;
	transition: transform .12s ease, box-shadow .12s ease;
}
.ig-search-panel__hit-wrap:hover,
.ig-search-panel__hit-wrap:focus-within {
	transform: translate(-3px, -3px);
	box-shadow: 5px 5px 0 var(--ig-line);
}

/* A kártya kattintható linkje (kép + címke + ár) */
.ig-search-panel__hit {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	flex: 1;
	transition: background .12s ease;
}
.ig-search-panel__hit:hover,
.ig-search-panel__hit.is-active {
	background: var(--ig-accent);
}
.ig-search-panel__thumb {
	width: 100%;
	aspect-ratio: 1 / 1;
	background: #f6f6f4;
	border-bottom: 2px solid var(--ig-line);
	display: block;
	overflow: hidden;
}
.ig-search-panel__thumb img {
	width: 100%; height: 100%;
	object-fit: cover; display: block;
}
.ig-search-panel__nothumb {
	width: 100%; height: 100%;
	display: flex; align-items: center; justify-content: center;
	color: var(--ig-muted); font-family: var(--ig-font-mono); font-size: 24px;
}
.ig-search-panel__body {
	padding: 12px 14px 14px;
	display: flex; flex-direction: column;
	min-width: 0; flex: 1;
}
.ig-search-panel__brand {
	display: inline-block;
	font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .12em;
	text-transform: uppercase; color: var(--ig-muted);
	margin-bottom: 4px;
}
.ig-search-panel__body strong {
	display: block;
	font-size: 14px; font-weight: 700; letter-spacing: -.005em;
	line-height: 1.3;
	/* legfeljebb 2 sor */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-bottom: 8px;
}
.ig-search-panel__price {
	display: block;
	font-size: 16px; font-weight: 900;
	margin-top: auto;
}
.ig-search-panel__empty {
	grid-column: 1 / -1;
	padding: 48px 32px;
	font-family: var(--ig-font-mono); font-size: 12px; letter-spacing: .12em;
	text-transform: uppercase; color: var(--ig-muted); text-align: center;
}

/* Kosárba gomb a találati kártyán */
.ig-search-panel__cart {
	display: block;
	width: 100%;
	border: 0;
	border-top: 2px solid var(--ig-line);
	background: var(--ig-ink);
	color: var(--ig-paper);
	padding: 10px 12px;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .12s ease, color .12s ease;
	box-sizing: border-box;
}
.ig-search-panel__cart:hover:not(:disabled):not(.is-oos) {
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
}
.ig-search-panel__cart:disabled { cursor: wait; opacity: .85; }
.ig-search-panel__cart.is-loading { background: var(--ig-muted); }
.ig-search-panel__cart.is-ok { background: var(--ig-accent); color: var(--ig-accent-ink); }
.ig-search-panel__cart.is-err { background: #c00; color: #fff; }
.ig-search-panel__cart.is-oos {
	background: #f6f6f4;
	color: var(--ig-muted);
	cursor: not-allowed;
	text-align: center;
}

.ig-search-open { overflow: hidden; }

@media (max-width: 1100px) {
	.ig-search-panel__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
	.ig-search-panel__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 16px 16px 24px; }
}
@media (max-width: 720px) {
	.ig-search-panel__inner { max-height: calc(100vh - 64px); }
	.ig-search-panel.is-open .ig-search-panel__inner { transform: translate3d(0, 64px, 0); }
	.ig-search-panel__form { padding: 14px 16px; gap: 10px; }
	.ig-search-panel__form input[type=search] { font-size: 18px; }
	.ig-search-panel__icon { width: 22px; height: 22px; }
	.ig-search-panel__body strong { font-size: 13px; }
	.ig-search-panel__price { font-size: 14px; }
}
@media (max-width: 480px) {
	.ig-search-panel__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 12px 12px 20px; }
}

@media (prefers-reduced-motion: reduce) {
	.ig-search-panel, .ig-search-panel__inner { transition: none; }
}

/* ===== Q&A on product page ===== */
.ig-product-page__qa { margin-top: 48px; padding-top: 24px; border-top: 3px solid #0a0a0a; }
.ig-qa-list { list-style: none; margin: 16px 0 32px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.ig-qa-item { border: 2px solid #0a0a0a; background: #fff; padding: 14px 16px; }
.ig-qa-item__q, .ig-qa-item__a { margin: 0 0 8px 0; padding-left: 28px; position: relative; }
.ig-qa-item__mark { position: absolute; left: 0; top: 0; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; background: #0a0a0a; color: #fff; font-family: var(--ig-font-mono); font-size: 11px; font-weight: 900; }
.ig-qa-item__mark--a { background: #E8FF00; color: #0a0a0a; }
.ig-qa-item__meta { margin: 8px 0 0 28px; font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #6B6B6B; }
.ig-qa-list__empty { padding: 20px; border: 2px dashed #0a0a0a; text-align: center; }
.ig-qa-form-wrap { background: #f6f6f4; border: 3px solid #0a0a0a; padding: 18px 20px; }
.ig-qa-form-wrap h3 { margin: 0 0 12px 0; font-size: 18px; text-transform: uppercase; }
.ig-qa-form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ig-qa-form__field { display: flex; flex-direction: column; }
.ig-qa-form__field--wide { grid-column: 1 / -1; }
.ig-qa-form__field span { font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #6B6B6B; margin-bottom: 4px; }
.ig-qa-form__field input, .ig-qa-form__field textarea { border: 2px solid #0a0a0a; padding: 8px 10px; font-family: inherit; background: #fff; }
.ig-qa-form button { grid-column: 1 / -1; justify-self: start; }
.ig-qa-form__msg { grid-column: 1 / -1; margin: 0; padding: 8px 10px; }
.ig-qa-form__msg.is-ok { background: #E8FF00; }
.ig-qa-form__msg.is-err { background: #fee; color: #a33; }
@media (max-width: 600px) { .ig-qa-form { grid-template-columns: 1fr; } }

/* ===== Reorder notice on cart ===== */
.ig-reorder-notice { padding: 14px 18px; border: 3px solid #0a0a0a; background: #E8FF00; margin-bottom: 16px; }
.ig-reorder-notice p { margin: 0 0 4px 0; }
.ig-reorder-notice p:last-child { margin-bottom: 0; }

/* ===== Compare floating widget + compare page ===== */
.ig-compare-fab { position: fixed; bottom: 24px; right: 24px; background: #0a0a0a; color: #fff; padding: 10px 16px; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; box-shadow: 4px 4px 0 #E8FF00, 4px 4px 0 1px #0a0a0a; font-family: var(--ig-font-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; z-index: 60; }
.ig-compare-fab[hidden] { display: none; }
.ig-compare-fab__icon { background: #E8FF00; color: #0a0a0a; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; font-weight: 900; }
/* ===== Compare board ===== */
.ig-compare__head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
.ig-compare__head-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.ig-compare__head-actions[hidden] { display: none; }
.ig-compare__counter { font-family: var(--ig-font-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; padding: 6px 10px; background: var(--ig-ink); color: var(--ig-paper); }

.ig-compare-empty { background: #f6f6f4; border: 3px solid #0a0a0a; padding: 48px 24px; text-align: center; }
.ig-compare-empty[hidden] { display: none; }
.ig-compare-empty__icon { font-size: 64px; font-weight: 900; margin-bottom: 12px; background: #E8FF00; display: inline-block; width: 96px; height: 96px; line-height: 96px; border: 3px solid #0a0a0a; }
.ig-compare-empty h2 { margin: 0 0 8px 0; font-size: 24px; text-transform: uppercase; letter-spacing: -.01em; }
.ig-compare-empty p { margin: 0 0 18px 0; color: var(--ig-muted); }

.ig-compare-loading { padding: 32px; font-family: var(--ig-font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ig-muted); text-align: center; }

.ig-compare-board-wrap { margin-top: 24px; }
.ig-compare-board { background: #fff; border: 3px solid #0a0a0a; box-shadow: 6px 6px 0 #E8FF00, 6px 6px 0 1px #0a0a0a; }
.ig-compare-board__scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x mandatory;
}
.ig-compare-board__grid {
	display: grid;
	/* label-col + N termék-col */
	grid-template-columns: 180px repeat(var(--ig-compare-cols, 4), minmax(220px, 1fr));
}

/* Cellák */
.ig-compare-board__cell {
	padding: 14px 16px;
	border-right: 2px solid #0a0a0a;
	border-bottom: 2px solid #ececec;
	background: #fff;
	min-width: 0;
	display: flex;
	align-items: center;
	font-size: 14px;
	scroll-snap-align: start;
}
.ig-compare-board__cell:last-child,
.ig-compare-board__grid > .ig-compare-board__cell:nth-child(calc(var(--ig-compare-cols, 4) + 1)),
.ig-compare-board__grid > .ig-compare-board__cell:nth-child(calc(var(--ig-compare-cols, 4) + 1) ~ n) { /* no-op fallback */ }
.ig-compare-board__cell--label {
	background: #f6f6f4;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #0a0a0a;
	font-weight: 700;
	position: sticky;
	left: 0;
	z-index: 2;
	border-right: 3px solid #0a0a0a;
}
.ig-compare-board__cell--label.is-diff { background: #fffae0; }
.ig-compare-board__cell.is-diff { background: #fffef2; font-weight: 700; }

/* Eyebrow a head bal felső cellán */
.ig-compare-board__eyebrow {
	margin: 0; font-family: var(--ig-font-mono); font-size: 11px;
	letter-spacing: .12em; text-transform: uppercase; color: var(--ig-muted);
}

/* Head termékkártya cella */
.ig-compare-board__cell--card,
.ig-compare-board__cell--head-label {
	background: #fff;
	border-bottom: 3px solid #0a0a0a;
	align-items: stretch;
	flex-direction: column;
	padding: 0;
}
.ig-compare-board__cell--card { position: relative; }
.ig-compare-board__remove {
	position: absolute; top: 8px; right: 8px;
	width: 30px; height: 30px;
	background: #0a0a0a; color: #fff;
	border: 0; cursor: pointer;
	font-weight: 900; font-size: 18px; line-height: 1;
	z-index: 3;
	transition: background .15s;
}
.ig-compare-board__remove:hover { background: #c00; }
.ig-compare-board__thumb {
	display: block; width: 100%; aspect-ratio: 1/1;
	background: #f6f6f4; border-bottom: 2px solid #0a0a0a;
	overflow: hidden;
}
.ig-compare-board__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ig-compare-board__nothumb { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; color: var(--ig-muted); font-family: var(--ig-font-mono); font-size: 32px; }
.ig-compare-board__cardbody { padding: 12px 14px 14px; display: flex; flex-direction: column; flex: 1; gap: 6px; }
.ig-compare-board__brand { display: inline-block; font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--ig-muted); }
.ig-compare-board__title { display: block; text-decoration: none; color: inherit; font-weight: 700; font-size: 15px; line-height: 1.3; letter-spacing: -.01em; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ig-compare-board__title:hover { color: #0a0a0a; text-decoration: underline; }
.ig-compare-board__price { margin: 4px 0; font-size: 16px; font-weight: 900; line-height: 1.2; }
.ig-compare-board__price del { display: block; font-weight: 400; font-size: 12px; color: var(--ig-muted); margin-bottom: 2px; }
.ig-compare-board__actions { margin-top: auto; padding-top: 8px; }
.ig-compare-board__cart {
	display: block; width: 100%;
	background: #0a0a0a; color: #fff;
	border: 0; padding: 10px 12px;
	font-family: var(--ig-font-mono); font-size: 11px; font-weight: 800;
	letter-spacing: .08em; text-transform: uppercase;
	cursor: pointer;
	transition: background .15s, color .15s;
	text-align: center;
}
.ig-compare-board__cart:not(.is-oos):hover { background: #E8FF00; color: #0a0a0a; }
.ig-compare-board__cart.is-ok { background: #E8FF00; color: #0a0a0a; }
.ig-compare-board__cart.is-oos { background: #f6f6f4; color: var(--ig-muted); cursor: not-allowed; }
.ig-compare-board__cart:disabled { opacity: .7; cursor: wait; }

.ig-compare-msg { margin-top: 12px; padding: 10px 14px; border: 2px solid #0a0a0a; font-size: 13px; }
.ig-compare-msg.is-ok { background: #E8FF00; }
.ig-compare-msg.is-err { background: #fee; color: #a33; }

/* MOBIL: keskenyebb label, kompaktabb termékoszlop */
@media (max-width: 720px) {
	.ig-compare__head { flex-direction: column; align-items: stretch; }
	.ig-compare__head-actions { justify-content: space-between; }
	.ig-compare-board__grid { grid-template-columns: 110px repeat(var(--ig-compare-cols, 4), 70vw); }
	.ig-compare-board__cell { padding: 10px 12px; font-size: 13px; }
	.ig-compare-board__cell--label { font-size: 10px; padding: 10px 8px; }
	.ig-compare-board__cardbody { padding: 10px 12px 12px; }
	.ig-compare-board__title { font-size: 14px; -webkit-line-clamp: 2; }
	.ig-compare-board__price { font-size: 15px; }
}
@media (max-width: 480px) {
	.ig-compare-board__grid { grid-template-columns: 96px repeat(var(--ig-compare-cols, 4), 80vw); }
}

/* ===== Service status timeline (customer account) ===== */
.ig-service-steps { display: flex; align-items: flex-start; justify-content: space-between; list-style: none; padding: 0; margin: 16px 0 24px; gap: 4px; }
.ig-service-step { display: flex; flex-direction: column; align-items: center; flex: 1; text-align: center; position: relative; padding-top: 18px; }
.ig-service-step::before { content: ''; position: absolute; left: 50%; right: -50%; top: 7px; height: 2px; background: #ccc; z-index: 0; }
.ig-service-step:last-child::before { display: none; }
.ig-service-step__dot { width: 16px; height: 16px; border: 2px solid #0a0a0a; background: #fff; position: relative; z-index: 1; margin-bottom: 6px; }
.ig-service-step.is-done .ig-service-step__dot { background: #0a0a0a; }
.ig-service-step.is-done::before { background: #0a0a0a; }
.ig-service-step.is-active .ig-service-step__dot { background: #E8FF00; }
.ig-service-step__label { font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: #6B6B6B; }
.ig-service-step.is-active .ig-service-step__label { color: #0a0a0a; font-weight: 700; }
@media (max-width: 600px) { .ig-service-step__label { font-size: 9px; } }

/* ===== Brutalist confirm modal (window.invgroupConfirm) ===== */
.ig-confirm { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; padding: 24px; }
.ig-confirm[hidden] { display: none; }
.ig-confirm__backdrop { position: absolute; inset: 0; background: rgba(10,10,10,0); transition: background .2s ease; }
.ig-confirm.is-open .ig-confirm__backdrop { background: rgba(10,10,10,.55); }
.ig-confirm__box {
	position: relative;
	background: #fff;
	border: 3px solid #0a0a0a;
	box-shadow: 8px 8px 0 #E8FF00, 8px 8px 0 1px #0a0a0a;
	max-width: 480px;
	width: 100%;
	padding: 28px 28px 24px;
	transform: translateY(-8px) scale(.96);
	opacity: 0;
	transition: transform .25s cubic-bezier(.22,1.06,.36,1), opacity .2s ease;
}
.ig-confirm.is-open .ig-confirm__box { transform: translateY(0) scale(1); opacity: 1; }
.ig-confirm__eyebrow { margin: 0 0 10px; font-family: var(--ig-font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #6B6B6B; }
.ig-confirm__title { margin: 0 0 12px; font-size: 22px; line-height: 1.2; letter-spacing: -.01em; font-weight: 900; text-transform: uppercase; }
.ig-confirm__msg { margin: 0 0 20px; font-size: 14px; line-height: 1.5; color: #333; }
.ig-confirm__msg[hidden] { display: none; }
.ig-confirm__actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.ig-confirm__actions .ig-button { min-width: 110px; }
.ig-confirm__actions .ig-button--danger { background: #c00; color: #fff; border-color: #0a0a0a; }
.ig-confirm__actions .ig-button--danger:hover { background: #0a0a0a; }
.ig-confirm-open { overflow: hidden; }
@media (max-width: 480px) {
	.ig-confirm { padding: 16px; }
	.ig-confirm__box { padding: 22px 20px 20px; }
	.ig-confirm__title { font-size: 19px; }
	.ig-confirm__actions { flex-direction: column-reverse; }
	.ig-confirm__actions .ig-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
	.ig-confirm__box, .ig-confirm__backdrop { transition: none; }
}

/* ===== Sale countdown a termékoldalon ===== */
.ig-product-page__sale-countdown {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 10px 0;
	padding: 6px 12px;
	background: #E8FF00;
	border: 2px solid #0a0a0a;
	font-family: var(--ig-font-mono);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .08em;
}
.ig-product-page__sale-countdown-label { font-size: 11px; }
.ig-product-page__sale-countdown-clock {
	font-size: 14px;
	font-variant-numeric: tabular-nums;
	background: #0a0a0a;
	color: #E8FF00;
	padding: 3px 8px;
	letter-spacing: .04em;
}

/* ===== Garancia-figyelő (account/warranty) ===== */
.ig-warranty__intro { margin: 4px 0 18px 0; font-size: 14px; }
.ig-warranty-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 18px; }
.ig-warranty-kpi__item { background: #fff; border: 3px solid #0a0a0a; padding: 14px 16px; }
.ig-warranty-kpi__item strong { display: block; font-size: 28px; font-weight: 900; line-height: 1; }
.ig-warranty-kpi__item span { display: block; margin-top: 4px; font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #6B6B6B; }
.ig-warranty-kpi__item.is-active strong { color: #0a0a0a; }
.ig-warranty-kpi__item.is-expiring { background: #E8FF00; }
.ig-warranty-kpi__item.is-expired strong { color: #b00; }

.ig-warranty-list { display: flex; flex-direction: column; gap: 10px; }
.ig-warranty-card { background: #fff; border: 2px solid #0a0a0a; padding: 14px 16px; border-left: 6px solid #0a0a0a; }
.ig-warranty-card.is-state-active   { border-left-color: #207520; }
.ig-warranty-card.is-state-expiring { border-left-color: #E8FF00; background: #fffae0; }
.ig-warranty-card.is-state-expired  { border-left-color: #c00; }
.ig-warranty-card.is-state-unknown  { border-left-color: #ccc; }
.ig-warranty-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.ig-warranty-card__title { font-weight: 800; font-size: 16px; letter-spacing: -.005em; text-decoration: none; color: inherit; }
.ig-warranty-card__title:hover { text-decoration: underline; }
.ig-warranty-card__status { font-family: var(--ig-font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; padding: 4px 8px; background: #f6f6f4; border: 1px solid #0a0a0a; white-space: nowrap; }
.ig-warranty-card.is-state-active   .ig-warranty-card__status { background: #dff5df; }
.ig-warranty-card.is-state-expiring .ig-warranty-card__status { background: #0a0a0a; color: #E8FF00; }
.ig-warranty-card.is-state-expired  .ig-warranty-card__status { background: #fee; color: #c00; }
.ig-warranty-card__meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px 16px; margin: 0; }
.ig-warranty-card__meta div { display: flex; flex-direction: column; }
.ig-warranty-card__meta dt { font-family: var(--ig-font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #6B6B6B; margin-bottom: 2px; }
.ig-warranty-card__meta dd { margin: 0; font-size: 13px; }
.ig-warranty-card__meta code { background: #f6f6f4; padding: 1px 6px; border: 1px solid #0a0a0a; font-size: 12px; }
@media (max-width: 600px) {
	.ig-warranty-kpi { grid-template-columns: 1fr; }
	.ig-warranty-card__head { flex-direction: column; }
	.ig-warranty-card__status { align-self: flex-start; }
}

/* ===== Mennyiségi árlépcső + karton-méret ===== */
.ig-pricing-tiers { margin: 14px 0; border: 2px solid #0a0a0a; background: #fff; }
.ig-pricing-tiers__carton {
	margin: 0;
	background: #E8FF00;
	padding: 10px 14px;
	border-bottom: 2px solid #0a0a0a;
	display: flex;
	align-items: baseline;
	gap: 10px;
	flex-wrap: wrap;
}
.ig-pricing-tiers__carton-eyebrow {
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #0a0a0a;
	opacity: .75;
}
.ig-pricing-tiers__carton strong {
	font-size: 15px;
	font-weight: 900;
	letter-spacing: -.01em;
}

.ig-pricing-tiers__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}
.ig-pricing-tiers__table thead th {
	background: #f6f6f4;
	padding: 8px 14px;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #6B6B6B;
	font-weight: 700;
	text-align: left;
	border-bottom: 2px solid #0a0a0a;
}
.ig-pricing-tiers__table tbody td {
	padding: 8px 14px;
	border-bottom: 1px solid #eee;
}
.ig-pricing-tiers__table tbody tr:last-child td { border-bottom: 0; }
.ig-pricing-tiers__table tbody td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.ig-pricing-tiers__table tr.is-discount td { background: #fffae0; }
.ig-pricing-tiers__table tr.is-discount td:last-child strong { color: #0a0a0a; }

/* Karton-multiplex sor — sárga emelt háttér + zöld border-left a "pakold be" érzéshez */
.ig-pricing-tiers__table tr.is-carton td { background: #fffae0; }
.ig-pricing-tiers__table tr.is-carton.is-discount td { background: #E8FF00; }
.ig-pricing-tiers__table tr.is-carton td:first-child {
	border-left: 4px solid #0a0a0a;
	font-weight: 700;
}
.ig-pricing-tiers__note {
	margin: 0;
	padding: 8px 14px;
	background: #f6f6f4;
	border-top: 1px solid #0a0a0a;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: .04em;
	color: #6B6B6B;
	line-height: 1.5;
}

/* Árlépcső táblában az "/ db" egységjelző halvány monospace */
.ig-pricing-tiers__unit {
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: .04em;
	color: #6B6B6B;
	font-weight: 500;
	margin-left: 4px;
}
.ig-pricing-tiers__table tr.is-carton.is-discount .ig-pricing-tiers__unit { color: #0a0a0a; }

/* Aktuális sor a qty input alapján — vastag fekete keret + nyíl jelzés balra */
.ig-pricing-tiers__table tr.is-current td {
	outline: 3px solid #0a0a0a;
	outline-offset: -3px;
	position: relative;
	font-weight: 800;
}
.ig-pricing-tiers__table tr.is-current td:first-child::before {
	content: '▸ ';
	font-weight: 900;
	color: #0a0a0a;
}
.ig-pricing-tiers__table tr.is-current.is-discount td { background: #E8FF00 !important; }
.ig-pricing-tiers__table tr.is-current.is-carton td:first-child::before { content: '🎯 '; }

/* A fő ár háttér-villanása amikor a qty változására kedvezményes tier-be ugrunk */
.ig-product-page__price.is-tier-discount {
	background: linear-gradient(transparent 60%, #E8FF00 60%);
	padding: 0 6px;
	margin-left: -6px;
}

/* ===== Karton-badge + "+1 karton" gomb a termékkártyán (csak viszonteladóknak) ===== */
.ig-product-card__carton-badge {
	position: absolute;
	top: 8px;
	right: 8px;
	max-width: 60%;
	background: #0a0a0a;
	color: #E8FF00;
	font-family: var(--ig-font-mono);
	border: 2px solid #0a0a0a;
	box-shadow: 3px 3px 0 #E8FF00;
	z-index: 2;
	display: flex;
	flex-direction: column;
	padding: 4px 8px;
	text-align: right;
	line-height: 1.2;
}
.ig-product-card__carton-badge strong {
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .05em;
	text-transform: uppercase;
	white-space: nowrap;
}
.ig-product-card__carton-badge em {
	font-style: normal;
	font-size: 9px;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #fff;
	margin-top: 2px;
}
.ig-product-card__cta--has-carton {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 6px;
}
.ig-product-card__carton-btn {
	background: #0a0a0a;
	color: #E8FF00;
	border: 2px solid #0a0a0a;
	padding: 0 12px;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .06em;
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s, color .15s;
}
.ig-product-card__carton-btn:hover {
	background: #E8FF00;
	color: #0a0a0a;
}
@media (max-width: 480px) {
	.ig-product-card__carton-badge { max-width: 70%; }
	.ig-product-card__carton-badge strong { font-size: 10px; }
	.ig-product-card__carton-badge em { font-size: 8px; }
	.ig-product-card__cta--has-carton { grid-template-columns: 1fr; }
}

/* ===== Shop breadcrumb pozicionálás ===== */
/* A breadcrumb a page-head padding-top sávjában él (abszolút), így létezése nem
   tol le semmit — az eyebrow + h1 mindig ugyanott áll. Fölötte 24px belső
   levegő ("padding a breadcrumb fölött"). */
.ig-page-head--shop { position: relative; }
.ig-page-head--shop > [data-shop-breadcrumb] {
	position: absolute;
	top: 24px;
	left: 0;
	right: 0;
}
.ig-page-head--shop > [data-shop-breadcrumb]:empty { display: none; }
.ig-page-head--shop > [data-shop-breadcrumb] .ig-breadcrumb { margin-bottom: 0; }

/* ===== Termékkártya: "X db a kosárban" badge + dinamikus ár jelzés ===== */
.ig-product-card__incart {
	position: absolute;
	bottom: 8px;
	right: 8px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	background: var(--ig-accent);
	color: var(--ig-accent-ink);
	border: 2px solid var(--ig-line);
	padding: 4px 8px;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .04em;
	z-index: 2;
	line-height: 1;
}
.ig-product-card__incart svg { width: 14px; height: 14px; flex-shrink: 0; }
.ig-product-card__incart strong { font-size: 14px; font-weight: 900; }

.ig-product-card__pricetag--cart {
	background: var(--ig-ink);
	color: var(--ig-accent);
	padding: 2px 6px;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.ig-product-card__amount.is-cart-tier {
	background: linear-gradient(transparent 65%, var(--ig-accent) 65%);
	padding: 0 4px;
}

/* SVG ikon a +karton gombon */
.ig-product-card__carton-icon { width: 14px; height: 14px; display: inline-block; vertical-align: middle; margin-right: 4px; }
.ig-product-card__carton-btn span { display: inline-block; vertical-align: middle; }

/* ===== Ajánlatkérő oldal (/ajanlatkeres/) — checkout-szerű 2-oszlopos ===== */
.ig-quote-request {
	/* full container szélesség, mint az összes többi oldal */
	padding-bottom: 80px;
}
.ig-quote-request__layout {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: 24px;
	align-items: start;
	margin-top: 20px;
}
.ig-quote-request__main { display: flex; flex-direction: column; gap: 18px; }
.ig-quote-request__step {
	background: #fff;
	border: 3px solid #0a0a0a;
	padding: 22px 26px;
}
.ig-quote-request__step-head {
	display: flex;
	align-items: baseline;
	gap: 12px;
	margin: 0 0 16px 0;
	padding-bottom: 12px;
	border-bottom: 2px solid #0a0a0a;
}
.ig-quote-request__step-num {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: .08em;
	background: #0a0a0a;
	color: #E8FF00;
	padding: 2px 7px;
}
.ig-quote-request__step-head h2 {
	margin: 0;
	font-size: 18px;
	letter-spacing: -.01em;
	text-transform: uppercase;
	font-weight: 900;
}
.ig-quote-request__shipping-toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	border: 2px solid #0a0a0a;
	background: #fff;
	cursor: pointer;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	margin-bottom: 12px;
}
.ig-quote-request__shipping-toggle:has(input:checked) { background: #E8FF00; }
.ig-quote-request__msg textarea {
	width: 100%;
	border: 2px solid #0a0a0a;
	padding: 10px 12px;
	font-family: inherit;
	font-size: 15px;
	min-height: 110px;
	resize: vertical;
	background: #fff;
}

/* Jobboldali aside: sticky, marad a görgetésnél */
.ig-quote-request__aside { position: sticky; top: 100px; }
.ig-quote-request__summary {
	background: #fff;
	border: 3px solid #0a0a0a;
	padding: 22px 26px;
	box-shadow: 6px 6px 0 #E8FF00, 6px 6px 0 1px #0a0a0a;
}
.ig-quote-request__summary h2 {
	margin: 0 0 14px 0;
	padding-bottom: 10px;
	border-bottom: 2px solid #0a0a0a;
	font-size: 16px;
	letter-spacing: -.005em;
	text-transform: uppercase;
	font-weight: 900;
}
.ig-quote-request__items { list-style: none; padding: 0; margin: 0; }
.ig-quote-request__items li {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 12px;
	padding: 8px 0;
	border-bottom: 1px solid #ececec;
}
.ig-quote-request__items li:last-child { border-bottom: 0; }
.ig-quote-request__items strong { display: block; font-size: 13px; font-weight: 700; }
.ig-quote-request__item-qty {
	display: block;
	margin-top: 2px;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: .08em;
	color: #6B6B6B;
	text-transform: uppercase;
}
.ig-quote-request__item-price {
	flex-shrink: 0;
	font-weight: 700;
	font-size: 13px;
}
.ig-quote-request__totals {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 4px 14px;
	margin: 14px 0 0 0;
}
.ig-quote-request__totals dt {
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #6B6B6B;
}
.ig-quote-request__totals dd { margin: 0; text-align: right; font-weight: 700; font-size: 13px; }
.ig-quote-request__grand {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	background: #E8FF00;
	border: 3px solid #0a0a0a;
	padding: 12px 14px;
	margin: 14px 0 0 0;
}
.ig-quote-request__grand span {
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.ig-quote-request__grand strong { font-size: 18px; font-weight: 900; }

.ig-quote-request__consent {
	margin: 16px 0 0 0;
	padding: 12px 0 0 0;
	border-top: 1px solid #ececec;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.ig-quote-request__consent-row {
	display: flex;
	gap: 8px;
	font-size: 12px;
	line-height: 1.5;
	cursor: pointer;
}
.ig-quote-request__consent-row input[type=checkbox] {
	flex-shrink: 0;
	margin-top: 2px;
}
.ig-quote-request__consent-row a { color: #0a0a0a; text-decoration: underline; }
.ig-quote-request__submit {
	display: block;
	width: 100%;
	margin: 14px 0 0 0;
	padding: 14px 18px;
	font-size: 15px;
	text-align: center;
}
.ig-quote-request__submit:disabled { opacity: .5; cursor: not-allowed; }
.ig-quote-request__hint {
	margin: 10px 0 0 0;
	font-family: var(--ig-font-mono);
	font-size: 10px;
	letter-spacing: .04em;
	color: #6B6B6B;
	line-height: 1.5;
}

.ig-notice--success {
	background: #E8FF00;
	border: 3px solid #0a0a0a;
	padding: 16px 20px;
	margin: 20px 0;
}
.ig-notice--success p { margin: 0; font-weight: 700; }

@media (max-width: 960px) {
	.ig-quote-request__layout { grid-template-columns: 1fr; }
	.ig-quote-request__aside { position: static; }
}
@media (max-width: 640px) {
	.ig-quote-request__step { padding: 18px 20px; }
	.ig-quote-request__summary { padding: 18px 20px; }
	.ig-quote-request__items li { flex-direction: column; align-items: flex-start; gap: 4px; }
}

/* ===== Quote view (ügyfél nézet a tokenes linken) ===== */
.ig-quote-view { max-width: 920px; margin: 0 auto; padding-bottom: 80px; }
.ig-quote-view__head { text-align: left; }
.ig-quote-view__head h1 {
	font-family: var(--ig-font-mono);
	font-size: clamp(28px, 4vw, 44px);
	letter-spacing: -.005em;
	font-weight: 900;
	background: #0a0a0a;
	color: #E8FF00;
	display: inline-block;
	padding: 4px 14px;
}
.ig-quote-view__items {
	background: #fff;
	border: 3px solid #0a0a0a;
	margin-top: 24px;
	padding: 0;
	overflow-x: auto;
}
.ig-quote-view__items .ig-table { margin: 0; }
.ig-quote-view__items th,
.ig-quote-view__items td { padding: 12px 16px; border-bottom: 1px solid #ececec; }
.ig-quote-view__items thead th {
	background: #f6f6f4;
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	border-bottom: 3px solid #0a0a0a;
}
.ig-quote-view__items td small { color: #6B6B6B; font-family: var(--ig-font-mono); font-size: 11px; }
.ig-quote-view__totals {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 4px 24px;
	margin: 24px 0 0 0;
	max-width: 360px;
	margin-left: auto;
}
.ig-quote-view__totals dt {
	font-family: var(--ig-font-mono);
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #6B6B6B;
}
.ig-quote-view__totals dd { margin: 0; text-align: right; font-weight: 700; }
.ig-quote-view__grand {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	background: #E8FF00;
	border: 3px solid #0a0a0a;
	padding: 18px 24px;
	margin: 16px 0 0 0;
}
.ig-quote-view__grand span {
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.ig-quote-view__grand strong { font-size: clamp(22px, 3vw, 32px); font-weight: 900; }
.ig-quote-view__actions {
	display: flex;
	gap: 12px;
	margin-top: 32px;
	flex-wrap: wrap;
	justify-content: center;
}
.ig-quote-view__actions .ig-button { font-size: 15px; padding: 14px 28px; }
@media (max-width: 640px) {
	.ig-quote-view__totals { max-width: none; }
	.ig-quote-view__grand { flex-direction: column; align-items: flex-start; gap: 4px; }
	.ig-quote-view__actions .ig-button { width: 100%; text-align: center; }
}

/* ===== Raktár-breakdown a termékoldalon ===== */
.ig-product-page__warehouses {
	list-style: none;
	padding: 0;
	margin: 12px 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.ig-product-page__warehouse {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 6px 10px;
	border: 2px solid #0a0a0a;
	background: #fff;
	font-family: var(--ig-font-mono);
	font-size: 12px;
	letter-spacing: .04em;
}
.ig-product-page__warehouse-label {
	text-transform: uppercase;
	font-weight: 700;
}
.ig-product-page__warehouse strong {
	font-size: 13px;
	font-weight: 900;
}
.ig-product-page__warehouse.is-role-main { border-left: 4px solid #207520; }
.ig-product-page__warehouse.is-role-separate_menu { border-left: 4px solid #E8FF00; background: #fffae0; }
.ig-product-page__warehouse.is-role-hidden { border-left: 4px solid #6B6B6B; opacity: .7; }
.ig-product-page__warehouse-stat { display: flex; align-items: center; gap: 8px; }
.ig-product-page__warehouse-badge { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; padding: 2px 7px; border: 2px solid #0a0a0a; white-space: nowrap; line-height: 1.4; }
.ig-product-page__warehouse.is-wstate-in   { border-left: 4px solid #207520; }
.ig-product-page__warehouse.is-wstate-in   .ig-product-page__warehouse-badge { background: #d8f5d8; color: #0c4a0c; }
.ig-product-page__warehouse.is-wstate-low  { border-left: 4px solid #c97a00; }
.ig-product-page__warehouse.is-wstate-low  .ig-product-page__warehouse-badge { background: #ffe9c2; color: #6b3d00; }
.ig-product-page__warehouse.is-wstate-last { border-left: 4px solid #d24a16; }
.ig-product-page__warehouse.is-wstate-last .ig-product-page__warehouse-badge { background: #ffd8c2; color: #7a2c08; }
.ig-product-page__warehouse.is-wstate-out  { border-left: 4px solid #b3261e; opacity: .8; }
.ig-product-page__warehouse.is-wstate-out  .ig-product-page__warehouse-badge { background: #f3d2cf; color: #7a1810; }
.ig-product-page__warehouse.is-wstate-out  .ig-product-page__warehouse-label { text-decoration: line-through; }

/* ===== EU VIES adószám-ellenőrzés ===== */
.ig-vat-row { display: flex; gap: 8px; align-items: stretch; }
.ig-vat-row input { flex: 1; }
.ig-vat-row__btn { white-space: nowrap; padding: 0 14px; font-size: 12px; letter-spacing: .06em; }
.ig-vat-row__msg { margin: 6px 0 0 0; padding: 8px 10px; border: 2px solid #0a0a0a; font-size: 12px; }
.ig-vat-row__msg.is-ok { background: #E8FF00; }
.ig-vat-row__msg.is-warn { background: #fffae0; }
.ig-vat-row__msg.is-err { background: #fee; color: #a33; border-color: #c00; }
.ig-vat-row__msg.is-loading { background: #f6f6f4; font-family: var(--ig-font-mono); letter-spacing: .08em; text-transform: uppercase; }

/* ===================================================================
   View Transitions API — natív, sima oldalváltás (MPA / cross-document)
   Chromium 126+; más böngészőben simán nincs animáció (graceful).
   =================================================================== */
@media (prefers-reduced-motion: no-preference) {
	@view-transition { navigation: auto; }

	/* A fejléc és a lábléc a helyén marad (nem úszik), csak a tartalom vált. */
	.ig-site-header { view-transition-name: ig-header; }
	.ig-site-footer { view-transition-name: ig-footer; }
	::view-transition-group(ig-header),
	::view-transition-group(ig-footer) { animation-duration: 0.001s; }

	/* Tartalom: gyors keresztúsztatás + finom elmozdulás (brutalista = pörgős). */
	::view-transition-old(root) { animation: ig-vt-out 0.18s ease both; }
	::view-transition-new(root) { animation: ig-vt-in  0.24s cubic-bezier(.2,.7,.3,1) both; }
	@keyframes ig-vt-out { to   { opacity: 0; transform: translateY(-6px) scale(0.997); } }
	@keyframes ig-vt-in  { from { opacity: 0; transform: translateY(10px) scale(0.997); } }
}

/* ===================================================================
   Mikrointerakciók + navigációs progress-bar + skeleton (Feature 2)
   =================================================================== */
.ig-navprog { position: fixed; top: 0; left: 0; height: 3px; width: 0; background: var(--ig-accent, #E8FF00); z-index: 100000; pointer-events: none; opacity: 0; box-shadow: 0 0 8px rgba(232,255,0,.7); transition: width .25s ease, opacity .3s ease; }
.ig-navprog.is-active { opacity: 1; }

/* Fókusz-gyűrű (a11y) — mindig, reduced-motiontól függetlenül */
.ig-button:focus-visible, .ig-qty__input:focus-visible, .ig-qty__btn:focus-visible,
.ig-product-card__media:focus-visible { outline: 3px solid var(--ig-accent, #E8FF00); outline-offset: 2px; }

@media (prefers-reduced-motion: no-preference) {
	/* Termékkártya: emelkedés + finom képnagyítás hoverre */
	.ig-product-card { transition: transform .18s ease, box-shadow .18s ease; }
	.ig-product-card:hover { transform: translateY(-3px); box-shadow: 6px 8px 0 rgba(10,10,10,.14); }
	.ig-product-card__media { overflow: hidden; }
	.ig-product-card__media img { transition: transform .4s cubic-bezier(.2,.7,.3,1); will-change: transform; }
	.ig-product-card:hover .ig-product-card__media img { transform: scale(1.05); }

	/* Gombok / qty: aktív lenyomás-érzet */
	.ig-button, .ig-qty__btn { transition: transform .08s ease, background-color .15s ease, color .15s ease, box-shadow .15s ease; }
	.ig-button:active, .ig-qty__btn:active { transform: translateY(1px) scale(.985); }

	/* Kosárba siker-pulzus (JS adja az .is-added osztályt) */
	@keyframes ig-pulse { 0% { transform: scale(1); } 40% { transform: scale(1.06); } 100% { transform: scale(1); } }
	.ig-button.is-added { animation: ig-pulse .42s ease; }

	/* Tartalom belépő-fade (egyszeri, oldalbetöltéskor) */
	@keyframes ig-fade-up { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
	@keyframes ig-fade-in { from { opacity: 0; } to { opacity: 1; } }
	.ig-site-main > .ig-container:not(.ig-shop):not(.ig-checkout),
	.ig-site-main > section { animation: ig-fade-up .4s ease both; }

	/* FONTOS: a shop és a checkout konténer `position: fixed` FAB-ot tartalmaz
	   (szűrés-gomb / kosár-dock). Egy transzformált ŐS containing block-ot hoz
	   létre, ami eltöri a fixed pozíciót (a FAB a lista aljára ragad lebegés
	   helyett). Ezért ezek CSAK opacity-vel fade-elnek — transform nélkül. */
	.ig-site-main > .ig-shop,
	.ig-site-main > .ig-checkout { animation: ig-fade-in .4s ease both; }
}

/* Skeleton-betöltő (shimmer) — AJAX-listákhoz / lassú betöltéshez */
.ig-skel { position: relative; overflow: hidden; background: #e7e4dd; border: 2px solid #0a0a0a; }
.ig-skel::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(255,255,255,.65), transparent); animation: ig-shimmer 1.2s infinite; }
.ig-skel-card { height: 320px; }
.ig-skel-line { height: 12px; margin: 8px 0; }
@keyframes ig-shimmer { 100% { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) { .ig-skel::after { animation: none; } }

/* ===================================================================
   Compare 2.0 — győztes-kiemelés + összesített befutó-korona (Feature 3)
   =================================================================== */
.ig-compare-board__cell--card { position: relative; }
.ig-compare-board__cell.is-winner { background: var(--ig-accent, #E8FF00); color: #0a0a0a; font-weight: 800; }
.ig-compare-board__best { display: inline-block; margin-left: 3px; line-height: 1; }
.ig-compare-board__cell--card.is-overall-winner { outline: 3px solid var(--ig-accent, #E8FF00); outline-offset: -3px; }
.ig-compare-board__crown { position: absolute; top: 6px; left: 6px; z-index: 2; display: inline-flex; align-items: center; gap: 4px; background: var(--ig-accent, #E8FF00); color: #0a0a0a; font-family: var(--ig-font-mono); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; padding: 2px 7px; border: 2px solid #0a0a0a; }

/* ===================================================================
   PWA telepítés gomb (Feature 4)
   =================================================================== */
.ig-pwa-install { position: fixed; left: 12px; bottom: 12px; z-index: 99990; background: var(--ig-accent, #E8FF00); color: #0a0a0a; border: 2px solid #0a0a0a; font-family: var(--ig-font-mono); font-weight: 800; text-transform: uppercase; letter-spacing: .05em; font-size: 12px; padding: 8px 14px; box-shadow: 4px 4px 0 #0a0a0a; cursor: pointer; }
.ig-pwa-install:active { transform: translate(2px,2px); box-shadow: 2px 2px 0 #0a0a0a; }
@media (max-width: 640px) { .ig-pwa-install { left: 8px; bottom: 70px; font-size: 11px; padding: 7px 12px; } }

/* ===================================================================
   Push értesítések — fiók-oldali feliratkozó kapcsoló (Feature 4b)
   =================================================================== */
.ig-push { display: flex; flex-direction: column; gap: 10px; }
.ig-push__btn { align-self: flex-start; cursor: pointer; }
.ig-push__btn.is-on { background: var(--ig-accent, #E8FF00); color: #0a0a0a; border-color: #0a0a0a; }
.ig-push__btn:disabled { opacity: .55; cursor: not-allowed; }
.ig-push__note { margin: 0; font-family: var(--ig-font-mono); font-size: 12px; line-height: 1.5; color: var(--ig-muted, #6B6B6B); }

/* ==========================================================================
   RMA / garanciális visszáru űrlap (fiók → RMA fül)
   ========================================================================== */
.ig-rma-form { margin-top: 18px; display: flex; flex-direction: column; gap: 16px; max-width: 640px; }
.ig-rma-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ig-rma-field { display: flex; flex-direction: column; gap: 6px; }
.ig-rma-field label { font-family: var(--ig-font-mono); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ig-ink); }
.ig-rma-field input, .ig-rma-field textarea { font-family: var(--ig-font-mono); font-size: 14px; padding: 12px 14px; border: var(--ig-stroke-bold) solid var(--ig-line); background: var(--ig-paper); color: var(--ig-ink); width: 100%; box-sizing: border-box; }
.ig-rma-field textarea { resize: vertical; line-height: 1.5; }
.ig-rma-field input:focus, .ig-rma-field textarea:focus { outline: 3px solid var(--ig-accent); outline-offset: 2px; }
.ig-rma-actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.ig-rma-link { font-family: var(--ig-font-mono); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ig-ink); text-decoration: none; border-bottom: 2px solid var(--ig-accent); padding-bottom: 1px; }
.ig-rma-link:hover { background: var(--ig-accent); }
.ig-rma-msg { margin: 4px 0 0; font-family: var(--ig-font-mono); font-size: 13px; line-height: 1.5; padding: 12px 14px; border: var(--ig-stroke) solid var(--ig-line); }
.ig-rma-msg.is-ok { background: var(--ig-accent); color: var(--ig-accent-ink); border-color: var(--ig-line); font-weight: 700; }
.ig-rma-msg.is-err { background: #ffe5e5; color: #8a1f1f; border-color: #8a1f1f; }
@media (max-width: 560px) { .ig-rma-row { grid-template-columns: 1fr; } }