/*
 * iShure design system: tokens, base, and the till-slip component language.
 * Elementor Site Settings hold the global colours and type presets; this file carries what
 * Elementor controls cannot express (font axes, dark mode, torn edges, dot leaders, motion).
 */

/* ---------------------------------------------------------------- fonts (self-hosted, OFL) */

@font-face {
	font-family: "Archivo";
	src: url("../fonts/archivo-var-latin.woff2") format("woff2");
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Martian Mono";
	src: url("../fonts/martian-mono-var-latin.woff2") format("woff2");
	font-weight: 100 800;
	font-stretch: 75% 112.5%;
	font-style: normal;
	font-display: swap;
}

/* ---------------------------------------------------------------- tokens */

:root {
	--ish-counter: #EEF2F5;
	--ish-paper: #FCFDFE;
	--ish-ink: #14161A;
	--ish-muted: #5B6573;
	--ish-link: #0072AC;
	--ish-sky: #00A1E6;
	--ish-on-sky: #0B1016;
	--ish-indigo: #06324A; /* logo navy: bands (Contract facts, compare) */
	--ish-on-indigo: #E8F1F6;
	--ish-band-text: #C4D6E2; /* band paragraphs, tinted from the navy (9:1) */
	--ish-action: #F2791E; /* logo orange: the one tear-off action per view, ink-night text (6.9:1) */
	--ish-action-hover: #F58F45;
	--ish-on-action: #0B1016;
	--ish-stamp: #A34B08; /* orange stamp ink on paper (5.8:1) */
	--ish-wash-warm: #FFF4EA; /* "Ask us" and verdicts */
	--ish-night: #0B1016;
	--ish-wash: #EAF6FD;
	--ish-rule: #C9D3DC;
	--ish-field: #7A8591; /* input borders: 3.7:1 on paper */
	--ish-shadow: 206 30% 30%;
	--ish-figure: #06324A; /* totals and prices in logo navy (13:1 on paper); sky on the dark slip */

	--ish-mono: "Martian Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
	--ish-sans: "Archivo", ui-sans-serif, system-ui, sans-serif;

	--ish-radius-pill: 999px;
	--ish-radius-field: 10px;
	--ish-tear: 7px; /* depth of the zig-zag torn edge */

	--ish-space-1: 0.25rem;
	--ish-space-2: 0.5rem;
	--ish-space-3: 0.75rem;
	--ish-space-4: 1rem;
	--ish-space-5: 1.5rem;
	--ish-space-6: 2rem;
	--ish-space-7: 3rem;
	--ish-space-8: clamp(3.5rem, 2.5rem + 4vw, 6rem);

	--ish-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
	--ish-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);

	color-scheme: light;
}

@media (prefers-color-scheme: dark) {
	:root {
		--ish-counter: #0B1016;
		--ish-paper: #141B24;
		--ish-ink: #E8EDF2;
		--ish-muted: #9AA6B2;
		--ish-link: #38BDF8;
		--ish-wash: #0F2533;
		--ish-indigo: #062538;
		--ish-on-indigo: #E8F1F6;
		--ish-band-text: #8FB3C9;
		--ish-stamp: #FDBA74;
		--ish-wash-warm: #2A1C10;
		--ish-rule: #2A3441;
		--ish-field: #6B7785;
		--ish-shadow: 210 60% 2%;
		--ish-figure: #38BDF8; /* totals print in sky on the dark slip (8.1:1 on #141B24) */
		color-scheme: dark;
	}

	/* Elementor's global colours follow the scheme too, so widgets that reference them flip with the page. */
	html body[class*="elementor-kit-"] {
		--e-global-color-primary: #38BDF8;
		--e-global-color-secondary: #062538;
		--e-global-color-text: #E8EDF2;
		--e-global-color-fa8c211f: #0B1016;
		--e-global-color-0b49b6ba: #141B24;
		--e-global-color-aac0db35: #9AA6B2;
		--e-global-color-67542981: #0F2533;
		--e-global-color-3d1fcebe: #2A3441;
	}
}

/* ---------------------------------------------------------------- base and browser surfaces */

body {
	background: var(--ish-counter);
	color: var(--ish-ink);
	font-family: var(--ish-sans);
	caret-color: var(--ish-link);
	scrollbar-color: var(--ish-field) var(--ish-counter);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

::selection {
	background: #FDD9BC; /* a light pull of the logo orange */
	color: #0B1016;
}

/* html body a (0,0,3) beats Hello Elementor's reset (a, 0,0,1) but loses to any class,
   so buttons and component links keep their own colours. */
html body a {
	color: var(--ish-link);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

/* Hover only on plain text links (no class): styled links and buttons keep their own hover. */
html body a:not([class]):hover,
html body a:not([class]):active { color: var(--ish-link); text-decoration-thickness: 2px; }

:focus-visible {
	outline: 3px solid var(--ish-link);
	outline-offset: 2px;
	border-radius: 4px;
}

h1, h2, h3, .ish-display {
	text-wrap: balance;
	font-stretch: 88%;
}

p {
	text-wrap: pretty;
	max-width: 68ch;
}

.ish-figure,
table,
.woocommerce-Price-amount {
	font-variant-numeric: tabular-nums lining-nums;
}

/* ---------------------------------------------------------------- the slip */

/* Paper lift. On the wrapper, because a mask clips a filter set on the same element;
   here the drop shadow follows the zig-zag edge like real paper on a counter. */
.ish-slip-shadow {
	filter: drop-shadow(0 1px 1px hsl(var(--ish-shadow) / 0.10)) drop-shadow(0 12px 22px hsl(var(--ish-shadow) / 0.16));
}

.ish-slip {
	--ish-slip-pad: clamp(1.1rem, 0.8rem + 1.4vw, 1.75rem);
	position: relative;
	background: var(--ish-paper);
	color: var(--ish-ink);
	padding: calc(var(--ish-slip-pad) + var(--ish-tear)) var(--ish-slip-pad);
	/* Zig-zag torn edge, top and bottom: two masks of repeating triangles plus a solid body. */
	-webkit-mask:
		conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / calc(var(--ish-tear) * 2) var(--ish-tear) repeat-x,
		conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / calc(var(--ish-tear) * 2) var(--ish-tear) repeat-x,
		linear-gradient(#000 0 0) center / 100% calc(100% - var(--ish-tear) * 2) no-repeat;
	mask:
		conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / calc(var(--ish-tear) * 2) var(--ish-tear) repeat-x,
		conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / calc(var(--ish-tear) * 2) var(--ish-tear) repeat-x,
		linear-gradient(#000 0 0) center / 100% calc(100% - var(--ish-tear) * 2) no-repeat;
}

.ish-slip__head {
	display: grid;
	gap: var(--ish-space-1);
	padding-bottom: var(--ish-space-3);
	border-bottom: 1px dashed var(--ish-rule);
	margin-bottom: var(--ish-space-3);
}

.ish-slip__store {
	font-family: var(--ish-mono);
	font-size: 0.75rem;
	letter-spacing: 0.02em;
	color: var(--ish-muted);
}

.ish-slip__title {
	margin: 0;
	font-family: var(--ish-sans);
	font-weight: 800;
	font-stretch: 80%;
	font-size: clamp(1.35rem, 1.1rem + 1vw, 1.75rem);
	line-height: 1.1;
	letter-spacing: -0.015em;
}

.ish-slip__meta {
	font-size: 0.875rem;
	color: var(--ish-muted);
}

.ish-slip__section {
	margin: var(--ish-space-4) 0 var(--ish-space-2);
	font-family: var(--ish-mono);
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--ish-ink);
}

/* One line: label ....... amount. The leader fills the gap, the amount never wraps. */
.ish-line {
	display: grid;
	grid-template-columns: minmax(0, auto) minmax(1.5rem, 1fr) auto;
	align-items: baseline;
	gap: var(--ish-space-2);
	padding: 0.3rem 0;
	font-family: var(--ish-mono);
	font-size: clamp(0.8125rem, 0.78rem + 0.15vw, 0.9375rem);
	line-height: 1.45;
}

.ish-line__label { min-width: 0; }

.ish-line__label small {
	display: block;
	font-family: var(--ish-sans);
	font-size: 0.8125rem;
	color: var(--ish-muted);
}

.ish-line__leader {
	align-self: end;
	height: 0.55em;
	margin-bottom: 0.3em;
	background: radial-gradient(circle, var(--ish-rule) 1px, transparent 1.5px) left center / 7px 3px repeat-x;
}

.ish-line__amount {
	white-space: nowrap;
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.ish-line--muted { color: var(--ish-muted); }
.ish-line--ask .ish-line__amount { color: var(--ish-link); background: var(--ish-wash-warm); padding: 0 0.4em; border-radius: 3px; }

.ish-slip__rule {
	border: 0;
	border-top: 1px dashed var(--ish-rule);
	margin: var(--ish-space-4) 0;
}

.ish-total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--ish-space-3);
	flex-wrap: wrap;
}

.ish-total__label {
	font-family: var(--ish-mono);
	font-size: 0.8125rem;
	font-weight: 600;
}

.ish-total__value {
	font-family: var(--ish-sans);
	font-weight: 800;
	font-stretch: 75%;
	font-size: clamp(2.25rem, 1.5rem + 3vw, 3.75rem);
	line-height: 1;
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums lining-nums;
}

.ish-total__value small {
	font-size: 0.4em;
	font-weight: 600;
	font-stretch: 100%;
	letter-spacing: 0;
	color: var(--ish-muted);
}

.ish-slip__foot {
	margin-top: var(--ish-space-4);
	padding-top: var(--ish-space-3);
	border-top: 1px dashed var(--ish-rule);
	font-family: var(--ish-mono);
	font-size: 0.78rem;
	line-height: 1.6;
	color: var(--ish-muted);
}

.ish-slip__foot p { margin: 0 0 var(--ish-space-2); max-width: none; }

/* Three ways to pay, as totals on one slip. */
.ish-ways {
	display: grid;
	gap: var(--ish-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ish-way {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: baseline;
	gap: var(--ish-space-1) var(--ish-space-3);
	padding: var(--ish-space-2) 0 var(--ish-space-3);
	border-bottom: 1px dashed var(--ish-rule);
}

.ish-way:last-child { border-bottom: 0; }

.ish-way__name {
	font-family: var(--ish-sans);
	font-weight: 700;
	font-size: 1rem;
}

.ish-way__name small {
	display: block;
	font-weight: 400;
	font-size: 0.8125rem;
	color: var(--ish-muted);
}

.ish-way__value {
	font-family: var(--ish-sans);
	font-weight: 800;
	font-stretch: 78%;
	font-size: clamp(1.4rem, 1.1rem + 1.2vw, 1.9rem);
	line-height: 1.05;
	text-align: right;
	font-variant-numeric: tabular-nums lining-nums;
	white-space: nowrap;
}

.ish-way__value small {
	display: block;
	font-size: 0.8125rem;
	font-weight: 500;
	font-stretch: 100%;
	color: var(--ish-muted);
}

.ish-way--lead .ish-way__value { font-size: clamp(1.9rem, 1.4rem + 2vw, 2.75rem); }

/* No figure yet: an honest, quiet "Ask us", never a big number-shaped blank. */
.ish-way.is-ask .ish-way__value {
	font-family: var(--ish-sans);
	font-size: 1rem;
	font-weight: 600;
	font-stretch: 100%;
	color: var(--ish-link);
}

.ish-slip__controls {
	margin-top: var(--ish-space-5);
	padding: var(--ish-space-4) 0;
	border-top: 1px dashed var(--ish-rule);
	border-bottom: 1px dashed var(--ish-rule);
}

.ish-slip__controls .ish-field:first-child { margin-top: 0; }
.ish-slip__controls .ish-slip__meta { margin: var(--ish-space-3) 0 0; }

/* Narrow phones: each total stacks under its name, and mono lines drop the leader so long
   labels can wrap without the dots breaking. The dashed rule under each line keeps the slip feel. */
@media (max-width: 480px) {
	.ish-way { grid-template-columns: minmax(0, 1fr); }
	.ish-way__value { text-align: left; }
	.ish-way__value small { display: inline; margin-left: var(--ish-space-2); }
	.ish-line {
		grid-template-columns: minmax(0, 1fr) auto;
		font-size: 0.78rem;
		border-bottom: 1px dotted var(--ish-rule);
	}
	.ish-line__leader { display: none; }
}

/* ---------------------------------------------------------------- controls */

/* Segmented switcher: which machine is on the slip. */
.ish-seg {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 2px;
	padding: 3px;
	border-radius: var(--ish-radius-pill);
	background: var(--ish-counter);
	margin-bottom: var(--ish-space-4);
}

.ish-seg button {
	appearance: none;
	border: 0;
	border-radius: var(--ish-radius-pill);
	padding: 0.5rem 0.9rem;
	min-height: 40px;
	background: transparent;
	color: var(--ish-muted);
	font: 600 0.8125rem/1 var(--ish-sans);
	cursor: pointer;
	transition: background-color 160ms ease, color 160ms ease, transform 160ms var(--ish-ease-out);
}

.ish-seg button[aria-pressed="true"] {
	background: var(--ish-paper);
	color: var(--ish-ink);
	box-shadow: 0 1px 2px hsl(var(--ish-shadow) / 0.16);
}

.ish-seg button:active { transform: scale(0.97); }

.ish-field {
	display: grid;
	gap: var(--ish-space-2);
	margin: var(--ish-space-3) 0;
}

.ish-field label {
	display: flex;
	justify-content: space-between;
	gap: var(--ish-space-2);
	font-size: 0.875rem;
	font-weight: 600;
}

.ish-field output {
	font-family: var(--ish-mono);
	font-weight: 500;
	font-variant-numeric: tabular-nums;
}

.ish-field input[type="range"] {
	width: 100%;
	accent-color: var(--ish-link);
	min-height: 32px;
}

.ish-basis {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ish-space-2) var(--ish-space-4);
	margin: var(--ish-space-2) 0 0;
	padding: 0;
	border: 0;
	font-size: 0.875rem;
}

.ish-basis legend {
	width: 100%;
	margin-bottom: var(--ish-space-1);
	font-weight: 600;
}

.ish-basis label { display: inline-flex; align-items: center; gap: var(--ish-space-2); cursor: pointer; }
.ish-basis input { accent-color: var(--ish-link); width: 18px; height: 18px; }

/* Buttons: pills. Sky is the single tear-off action per view, with ink text (6.6:1). */
.ish-btn,
.elementor-button.ish-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ish-space-2);
	min-height: 48px;
	padding: 0.85rem 1.4rem;
	border: 0;
	border-radius: var(--ish-radius-pill);
	font: 700 1rem/1 var(--ish-sans);
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: transform 160ms var(--ish-ease-out), background-color 160ms ease, box-shadow 160ms ease;
}

.ish-btn:active { transform: scale(0.97); }

/* Hello Elementor styles bare <button> and [type=submit] with a pink border and hover fill. */
button.ish-btn,
button.ish-btn:hover,
button.ish-btn:focus { border: 0; }
button.ish-btn--quiet,
button.ish-btn--quiet:hover,
button.ish-btn--quiet:focus { color: var(--ish-link); background: transparent; }
@media (hover: hover) and (pointer: fine) { button.ish-btn--quiet:hover { background: var(--ish-wash); } }

.ish-btn--tear {
	background: var(--ish-action);
	color: var(--ish-on-action);
	box-shadow: 0 1px 1px hsl(var(--ish-shadow) / 0.18), 0 6px 14px -6px hsl(var(--ish-shadow) / 0.35);
}

.ish-btn--quiet {
	background: transparent;
	color: var(--ish-link);
	box-shadow: inset 0 0 0 1.5px currentColor;
}

@media (hover: hover) and (pointer: fine) {
	.ish-btn--tear:hover { background: var(--ish-action-hover); color: var(--ish-on-action); }
	.ish-btn--quiet:hover { background: var(--ish-wash); }
}

.ish-slip__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ish-space-3);
	margin-top: var(--ish-space-4);
}

/* ---------------------------------------------------------------- signature motion: reprint only what changed */

@media (prefers-reduced-motion: no-preference) {
	.ish-reprint {
		animation: ish-reprint 180ms var(--ish-ease-out);
	}
}

@keyframes ish-reprint {
	from {
		opacity: 0.2;
		transform: translateY(0.35em);
		clip-path: inset(0 0 100% 0);
	}
	to {
		opacity: 1;
		transform: none;
		clip-path: inset(0 0 0 0);
	}
}

/* Machine panes inside one slip: only the active one shows. */
.ish-pane[hidden] { display: none; }

/* ---------------------------------------------------------------- utilities for Elementor editors */

.ish-muted { color: var(--ish-muted); }
.ish-mono { font-family: var(--ish-mono); }
.ish-sr {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---------------------------------------------------------------- layout helpers used in Elementor (CSS Classes field) */

/* Keeps a column in view beside a long slip on desktop. */
@media (min-width: 1025px) {
	.ish-sticky {
		position: sticky;
		top: var(--ish-space-6);
		align-self: flex-start;
	}
}

/* Service terms as plain sentences, figure first. Set in a Text Editor widget as a list. */
.ish-terms ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: var(--ish-space-3);
}

.ish-terms li {
	display: grid;
	grid-template-columns: 4.5rem minmax(0, 1fr);
	align-items: baseline;
	gap: var(--ish-space-3);
	padding-top: var(--ish-space-3);
	border-top: 1px dashed var(--ish-rule);
	color: var(--ish-muted);
	font-size: 0.9375rem;
	line-height: 1.4;
}

.ish-terms li strong {
	font-weight: 800;
	font-stretch: 78%;
	font-size: 1.5rem;
	line-height: 1;
	color: var(--ish-ink);
	font-variant-numeric: tabular-nums lining-nums;
}

/* ---------------------------------------------------------------- header */

/* Sticky on Elementor's header location wrapper: the inner container is forced to
   position: relative by Elementor, so sticking it there only offsets it over the page. */
.elementor-location-header {
	position: sticky;
	top: 0;
	z-index: 50; /* z-scale: 50 header, 60 WhatsApp button, 70 menus */
}

.ish-header {
	background: color-mix(in srgb, var(--ish-counter) 92%, transparent);
	-webkit-backdrop-filter: saturate(160%) blur(12px);
	backdrop-filter: saturate(160%) blur(12px);
	border-bottom: 1px solid var(--ish-rule);
}

.admin-bar .elementor-location-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .elementor-location-header { top: 0; } }

/* Placeholder wordmark until the final logo arrives. TODO(marius): swap for the Site Logo widget.
   Selectors carry .elementor-widget so they outrank the kit's heading typography. */
.elementor-widget.ish-wordmark .elementor-heading-title,
.elementor-widget.ish-wordmark .elementor-heading-title a {
	display: inline-flex;
	align-items: baseline;
	gap: 0.45em;
	white-space: nowrap;
	color: var(--ish-ink);
	text-decoration: none;
	font-family: var(--ish-sans);
	font-weight: 850;
	font-stretch: 78%;
	font-size: 1.6rem;
	letter-spacing: -0.02em;
	line-height: 1;
}

.elementor-widget.ish-wordmark small {
	font-family: var(--ish-mono);
	font-size: 0.72rem;
	font-weight: 500;
	font-stretch: 100%;
	letter-spacing: 0.02em;
	color: var(--ish-muted);
}

@media (max-width: 480px) {
	.ish-header .ish-wordmark small { display: none; }
}

/* The menu stays on one line; Elementor's "grow" control gives it the free width. */
.ish-header .ish-nav { min-width: 0; margin-inline-start: var(--ish-space-5); }

/* Below 1280px the phone number gives way to the menu (it stays in the footer and on WhatsApp). */
@media (max-width: 1279px) {
	.ish-header .ish-header-phone { display: none; }
}

.ish-header .elementor-widget.ish-wordmark small { display: none; }
.ish-header .ish-nav .elementor-nav-menu--main > .elementor-nav-menu { flex-wrap: nowrap; justify-content: center; }
.ish-header .ish-nav .elementor-nav-menu--main > .elementor-nav-menu > li > a { white-space: nowrap; }

.ish-header-phone a {
	font-family: var(--ish-mono);
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--ish-ink);
	text-decoration: none;
	white-space: nowrap;
}

@media (hover: hover) and (pointer: fine) {
	.ish-header-phone a:hover { color: var(--ish-link); }
}

/* ---------------------------------------------------------------- footer */

.ish-footer {
	--ish-footer-ink: #D8DEE5;
	--ish-footer-muted: #9AA6B2; /* 7.7:1 on ink night */
	color: var(--ish-footer-ink);
}

.ish-footer a { color: var(--ish-footer-ink); text-decoration: none; }
.ish-footer a:hover { color: #FFFFFF; text-decoration: underline; }
.ish-footer :focus-visible { outline-color: var(--ish-action); }

.ish-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.ish-footer .elementor-widget-text-editor,
.ish-footer .elementor-widget-text-editor p,
.ish-footer .elementor-widget-text-editor li { color: var(--ish-footer-ink); }
.ish-footer .ish-footer-small,
.ish-footer .ish-footer-small p { color: var(--ish-footer-muted); }

.ish-footer-small,
.ish-footer-small p {
	color: var(--ish-footer-muted);
	font-size: 0.8125rem;
	max-width: none;
}

.ish-footer-contact a { font-family: var(--ish-mono); font-size: 0.9375rem; }

/* ---------------------------------------------------------------- floating WhatsApp */

.ish-wa {
	position: fixed;
	right: max(16px, env(safe-area-inset-right));
	bottom: max(16px, env(safe-area-inset-bottom));
	z-index: 60;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 52px;
	padding: 0 1.1rem 0 0.95rem;
	border-radius: var(--ish-radius-pill);
	background: #0B6B41; /* WhatsApp green darkened for 6.5:1 with white */
	color: #FFFFFF;
	font: 700 0.9375rem/1 var(--ish-sans);
	text-decoration: none;
	box-shadow: 0 2px 4px hsl(150 60% 10% / 0.18), 0 10px 24px -8px hsl(150 60% 10% / 0.45);
	transition: transform 160ms var(--ish-ease-out), background-color 160ms ease;
}

.ish-wa:active { transform: scale(0.96); }
@media (hover: hover) and (pointer: fine) { .ish-wa:hover { background: #075C37; color: #FFFFFF; } }

@media (max-width: 480px) {
	.ish-wa span { display: none; }
	.ish-wa { padding: 0; width: 52px; justify-content: center; }
}

@media (prefers-reduced-motion: no-preference) {
	.ish-wa { animation: ish-wa-in 320ms var(--ish-ease-out) 600ms backwards; } /* backwards, not both: a held final frame would override .is-away */
}

@keyframes ish-wa-in {
	from { opacity: 0; transform: translateY(12px); }
	to { opacity: 1; transform: none; }
}

.elementor-widget.ish-wordmark--light .elementor-heading-title,
.elementor-widget.ish-wordmark--light .elementor-heading-title a { color: #FFFFFF; }
.elementor-widget.ish-wordmark--light small { color: #9AA6B2; }

.ish-footer-legal {
	padding-top: var(--ish-space-5);
	border-top: 1px dashed #2A3441;
}

.ish-footer .elementor-heading-title { margin: 0; }

/* Submenu indicator drawn in CSS (no icon font for one glyph). */
.ish-nav .elementor-nav-menu--main .menu-item-has-children > a::after {
	content: "";
	width: 0.42em;
	height: 0.42em;
	margin-left: 0.45em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-0.18em) rotate(45deg);
	transition: transform 160ms var(--ish-ease-out);
}

.ish-nav .elementor-nav-menu--main .menu-item-has-children:hover > a::after,
.ish-nav .elementor-nav-menu--main .menu-item-has-children:focus-within > a::after {
	transform: translateY(0.05em) rotate(225deg);
}

.ish-nav .sub-menu { min-width: 250px; }
/* Neutral elevation for the dropdown in both schemes (a tinted shadow reads as a glow on dark). */
.ish-nav .elementor-nav-menu--dropdown,
.ish-nav .sub-menu { box-shadow: 0 12px 32px -8px rgb(0 0 0 / 0.28) !important; }


/* ---------------------------------------------------------------- machine ranges: slip lines you can click */

.ish-ranges { list-style: none; margin: 0; padding: 0; border-top: 1px dashed var(--ish-rule); }
.ish-range { border-bottom: 1px dashed var(--ish-rule); }

.ish-range__link {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(2rem, 1fr) auto;
	align-items: center;
	gap: var(--ish-space-4);
	padding: var(--ish-space-5) var(--ish-space-2);
	color: var(--ish-ink);
	text-decoration: none;
	transition: background-color 160ms ease;
}

@media (hover: hover) and (pointer: fine) {
	.ish-range__link:hover { background: var(--ish-paper); }
	.ish-range__link:hover .ish-range__name { color: var(--ish-link); }
}

.ish-range__name {
	font-weight: 800;
	font-stretch: 85%;
	font-size: clamp(1.25rem, 1.05rem + 0.8vw, 1.6rem);
	line-height: 1.15;
	transition: color 160ms ease;
}

.ish-range__name small,
.ish-range__price small {
	display: block;
	margin-top: 0.3rem;
	font-weight: 400;
	font-stretch: 100%;
	font-size: 0.9375rem;
	color: var(--ish-muted);
}

.ish-range__leader {
	height: 3px;
	background: radial-gradient(circle, var(--ish-rule) 1px, transparent 1.5px) left center / 7px 3px repeat-x;
}

.ish-range__price {
	text-align: right;
	font-weight: 800;
	font-stretch: 78%;
	font-size: clamp(1.25rem, 1.05rem + 0.8vw, 1.6rem);
	font-variant-numeric: tabular-nums lining-nums;
	white-space: nowrap;
}

.ish-range__price small { font-family: var(--ish-mono); font-size: 0.8rem; }

.ish-ranges__foot { margin-top: var(--ish-space-3); font-size: 0.8125rem; color: var(--ish-muted); }

@media (max-width: 767px) {
	.ish-range__link { grid-template-columns: minmax(0, 1fr); gap: var(--ish-space-2); }
	.ish-range__leader { display: none; }
	.ish-range__price { text-align: left; }
}

/* ---------------------------------------------------------------- tables: undo Hello Elementor's table reset */

.ish-esc__table th, .ish-esc__table td,
.ish-compare th, .ish-compare td {
	background: transparent !important; /* Hello zebra-stripes tbody rows with a higher-specificity nth-child rule */
	border-left: 0;
	border-right: 0;
	border-top: 0;
}
.ish-esc__table, .ish-compare table { border: 0; margin-bottom: 0; }

/* ---------------------------------------------------------------- escalation slip */

.ish-esc__table {
	width: 100%;
	border-collapse: collapse;
	margin: var(--ish-space-3) 0 var(--ish-space-4);
	font-family: var(--ish-mono);
	font-size: clamp(0.78rem, 0.74rem + 0.2vw, 0.9rem);
	font-variant-numeric: tabular-nums;
}

.ish-esc__table th,
.ish-esc__table td { padding: 0.5rem 0.25rem; text-align: right; border-bottom: 1px dotted var(--ish-rule); font-weight: 400; }
.ish-esc__table th:first-child { text-align: left; }
.ish-esc__table thead th { font-weight: 600; color: var(--ish-muted); font-size: 0.75rem; }
.ish-esc__table tfoot th,
.ish-esc__table tfoot td { font-weight: 700; border-bottom: 0; border-top: 1px dashed var(--ish-ink); }
.ish-esc__table small { color: var(--ish-muted); font-size: 0.72em; }
.ish-esc .ish-total__value { color: var(--ish-ink); }

/* ---------------------------------------------------------------- three ways to pay, compared */

.ish-compare table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9375rem;
	line-height: 1.45;
}

.ish-compare th,
.ish-compare td { padding: 0.85rem 0.75rem; vertical-align: top; text-align: left; border-bottom: 1px dashed var(--ish-rule); }
.ish-compare thead th { font-weight: 800; font-stretch: 85%; font-size: 1.15rem; border-bottom: 1px solid var(--ish-ink); }
.ish-compare tbody th { font-family: var(--ish-mono); font-size: 0.78rem; font-weight: 600; color: var(--ish-muted); width: 22%; }
.ish-compare td strong { font-variant-numeric: tabular-nums; }

/* Phones: each row becomes a block, each cell carries its option name (data-label). */
@media (max-width: 767px) {
	.ish-compare thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.ish-compare table,
	.ish-compare tbody,
	.ish-compare tr,
	.ish-compare th,
	.ish-compare td { display: block; width: auto; }
	.ish-compare tr { padding: var(--ish-space-4) 0; border-bottom: 1px dashed var(--ish-rule); }
	.ish-compare tbody th { padding: 0 0 var(--ish-space-2); border: 0; }
	.ish-compare td { position: relative; padding: 0.35rem 0 0.35rem 9.75rem; border: 0; }
	.ish-compare td::before { content: attr(data-label); position: absolute; left: 0; top: 0.35rem; width: 9rem; font-weight: 700; }
}

/* ---------------------------------------------------------------- dark bands (indigo, ink night) */

.ish-band { color: var(--ish-on-indigo); }
.ish-band .elementor-heading-title { color: #FFFFFF; }
.ish-band p { color: var(--ish-band-text); }
/* A slip on the band is paper: it keeps the slip's own ink, not the band's light text. */
.ish-band .ish-slip,
.ish-band .ish-slip p { color: var(--ish-ink); }
.ish-band .ish-slip .ish-slip__foot p { color: var(--ish-muted); }
.ish-band .ish-slip .ish-stamp { color: var(--ish-stamp); }

/* ---------------------------------------------------------------- other ranges and service areas */

.ish-more ul,
.ish-areas ul { list-style: none; margin: 0; padding: 0; }

.ish-more li {
	padding: var(--ish-space-4) 0;
	border-top: 1px dashed var(--ish-rule);
}

.ish-more li a { font-weight: 800; font-stretch: 85%; font-size: 1.25rem; color: var(--ish-ink); text-decoration: none; }
.ish-more li a:hover { color: var(--ish-link); }
.ish-more li span { display: block; margin-top: 0.25rem; color: var(--ish-muted); font-size: 0.9375rem; }

.ish-areas ul { display: flex; flex-wrap: wrap; gap: var(--ish-space-2); }
.ish-areas li {
	padding: 0.45rem 0.85rem;
	border-radius: var(--ish-radius-pill);
	background: var(--ish-paper);
	box-shadow: inset 0 0 0 1px var(--ish-rule);
	font-weight: 600;
	font-size: 0.9375rem;
}

/* Toner lookup: a single field, submitted to the shop search. */
.ish-lookup form { display: flex; flex-wrap: wrap; gap: var(--ish-space-2); max-width: 34rem; }
.ish-lookup label { width: 100%; font-weight: 600; font-size: 0.9375rem; }
.ish-lookup input[type="search"] {
	flex: 1 1 14rem;
	min-height: 48px;
	padding: 0 1rem;
	border: 1.5px solid var(--ish-field);
	border-radius: var(--ish-radius-field);
	background: var(--ish-paper);
	color: var(--ish-ink);
	font: 500 1rem var(--ish-mono);
}
.ish-lookup input[type="search"]::placeholder { color: var(--ish-muted); }
.ish-lookup button { border: 0; }


/* ---------------------------------------------------------------- slip details from the finish review */

/* Grand total: a printed double rule, like a till's ==== before the total. */
.ish-slip__section--total {
	padding-top: var(--ish-space-3);
	border-top: 3px double var(--ish-ink);
}

.ish-total--grand {
	padding-top: var(--ish-space-3);
	border-top: 3px double var(--ish-ink);
}

/* A note belongs to the line above it, full width, no leader. */
.ish-line__note {
	margin: -0.15rem 0 0.35rem;
	max-width: none;
	font-size: 0.8125rem;
	color: var(--ish-muted);
}

/* Till timestamp, printed as a rubber stamp in the logo orange (darkened to 5.8:1 for text). */
.ish-stamp {
	display: inline-block;
	font-family: var(--ish-mono);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.3;
	color: var(--ish-stamp);
	border: 1.5px solid currentColor;
	border-radius: 3px;
	padding: 0.25em 0.55em;
	transform: rotate(-1.2deg);
	transform-origin: left center;
}
@media (prefers-reduced-motion: reduce) { .ish-stamp { transform: none; } }

/* Buttons shown on the slip for phones and tablets only (a page button carries the action on desktop). */
@media (min-width: 1025px) {
	.ish-slip__actions--mobile { display: none; }
}

/* A list printed as a slip (ranges). */
.ish-slip--list .ish-ranges { border-top: 0; }
.ish-slip--list .ish-range:last-child { border-bottom: 0; }
.ish-slip--list .ish-range__link { padding-inline: 0; }

/* ---------------------------------------------------------------- contract facts */

.ish-facts__title {
	margin: 0;
	padding-bottom: var(--ish-space-2);
	border-bottom: 6px solid var(--ish-ink);
	font-weight: 850;
	font-stretch: 80%;
	font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem);
	line-height: 1.05;
	color: var(--ish-ink);
}

.ish-facts__sub {
	padding: var(--ish-space-2) 0;
	margin-bottom: var(--ish-space-2);
	border-bottom: 1px solid var(--ish-ink);
	font-size: 0.875rem;
	color: var(--ish-muted);
}

.ish-facts .ish-line { border-bottom: 1px dotted var(--ish-rule); }
.ish-facts .ish-line__amount { white-space: normal; text-align: right; }

/* ---------------------------------------------------------------- WhatsApp float: step aside over slips */

.ish-wa { transition: transform 200ms var(--ish-ease-out), opacity 200ms ease, background-color 160ms ease; }
.ish-wa.is-away { opacity: 0; transform: translateY(12px); pointer-events: none; }

/* ---------------------------------------------------------------- header spacing on tablet and phone */

@media (max-width: 1024px) {
	.ish-header .elementor-element-header-actions { margin-inline-start: auto; }
	.ish-header .elementor-widget.ish-wordmark { margin-inline-end: var(--ish-space-4); }
}


/* Totals take the figure colour: ink in light mode, sky in dark mode (direction contract). */
.ish-way__value,
.ish-total__value,
.ish-esc .ish-total__value,
.ish-range__price { color: var(--ish-figure); }
.ish-way.is-ask .ish-way__value { color: var(--ish-link); }


/* ---------------------------------------------------------------- machine family pages */

.ish-crumbs ol { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0 0 var(--ish-space-4); padding: 0; list-style: none; font-size: 0.875rem; color: var(--ish-muted); }
.ish-crumbs li + li::before { content: "/"; margin-right: 0.35rem; color: var(--ish-rule); }
.ish-crumbs a { color: var(--ish-muted); }

.ish-machine__h1 {
	margin: 0;
	font-weight: 800;
	font-stretch: 82%;
	font-size: clamp(2rem, 1.3rem + 2.8vw, 3.5rem);
	line-height: 1.03;
	letter-spacing: -0.025em;
	color: var(--ish-ink);
	text-wrap: balance;
}

.ish-machine__sub { margin: var(--ish-space-3) 0 0; font-size: 1.0625rem; color: var(--ish-muted); }

.ish-machine__photo { margin: var(--ish-space-5) 0 0; background: #FFFFFF; aspect-ratio: 4 / 3; display: grid; place-items: center; }
.ish-machine__photo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }

/* Toner and parts: slip lines with a buy button. */
.ish-parts { list-style: none; margin: 0; padding: 0; border-top: 1px dashed var(--ish-rule); }
.ish-part {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	align-items: center;
	gap: var(--ish-space-2) var(--ish-space-4);
	padding: var(--ish-space-3) 0;
	border-bottom: 1px dashed var(--ish-rule);
}
.ish-part__name { font-weight: 700; }
.ish-part__name small { display: block; font-family: var(--ish-mono); font-weight: 400; font-size: 0.78rem; color: var(--ish-muted); }
.ish-part__price { font-family: var(--ish-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ish-btn--sm { min-height: 40px; padding: 0.55rem 1rem; font-size: 0.875rem; }
.ish-parts__foot { margin-top: var(--ish-space-3); font-size: 0.8125rem; color: var(--ish-muted); }

@media (max-width: 600px) {
	.ish-part { grid-template-columns: minmax(0, 1fr) auto; }
	.ish-part .ish-btn { grid-column: 1 / -1; justify-self: start; }
}

.ish-parts--acc { border-top: 1px dashed var(--ish-rule); }
.ish-parts--acc summary,
.ish-specs__full summary {
	cursor: pointer;
	padding: var(--ish-space-4) 0;
	font-weight: 700;
	color: var(--ish-link);
	list-style-position: inside;
}
.ish-parts--acc ul { list-style: none; margin: 0; padding: 0; }

/* Specifications: key cards, full table, datasheet. */
.ish-specs { padding: var(--ish-space-5) 0; border-top: 1px dashed var(--ish-rule); }
.ish-specs__model { margin: 0 0 var(--ish-space-4); font-weight: 800; font-stretch: 85%; font-size: 1.25rem; }
.ish-specs__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); gap: 1px; margin: 0 0 var(--ish-space-4); background: var(--ish-rule); border: 1px solid var(--ish-rule); }
.ish-specs__cards div { background: var(--ish-paper); padding: var(--ish-space-3) var(--ish-space-4); }
.ish-specs__cards dt { font-size: 0.78rem; color: var(--ish-muted); }
.ish-specs__cards dd { margin: 0.25rem 0 0; font-weight: 700; font-stretch: 88%; font-size: 1rem; line-height: 1.35; font-variant-numeric: tabular-nums; }
.ish-specs__full table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.ish-specs__full th, .ish-specs__full td { background: transparent !important; border: 0; border-bottom: 1px dotted var(--ish-rule); padding: 0.55rem 0.25rem; text-align: left; vertical-align: top; }
.ish-specs__full th { width: 40%; font-weight: 600; color: var(--ish-muted); }
.ish-specs__desc { font-family: var(--ish-mono); font-size: 0.8125rem; color: var(--ish-muted); }
.ish-specs__pdf { margin: var(--ish-space-4) 0 var(--ish-space-3); }
.ish-specs__pdf summary, .ish-specs__full summary { cursor: pointer; font-weight: 600; color: var(--ish-link); padding: 0.5rem 0; min-height: 44px; display: flex; align-items: center; }
.ish-specs__pdf object { width: 100%; height: min(80vh, 900px); border: 1px solid var(--ish-rule); background: var(--ish-paper); }

/* Is it the right size? */
.ish-size__facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: var(--ish-space-4); margin: 0 0 var(--ish-space-5); }
.ish-size__facts dt { font-size: 0.8125rem; color: var(--ish-muted); }
.ish-size__facts dd { margin: 0.2rem 0 0; font-weight: 800; font-stretch: 82%; font-size: 1.6rem; color: var(--ish-figure); font-variant-numeric: tabular-nums; }
.ish-size__facts dd small { font-size: 0.8125rem; font-weight: 500; font-stretch: 100%; color: var(--ish-muted); }
.ish-size__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: var(--ish-space-4); }
.ish-size__steps li { padding-top: var(--ish-space-3); border-top: 1px dashed var(--ish-rule); }
.ish-size__steps span { display: block; font-size: 0.8125rem; color: var(--ish-muted); }
.ish-size__steps a { font-weight: 800; font-stretch: 85%; font-size: 1.15rem; }
.ish-size__steps small { display: block; font-family: var(--ish-mono); font-size: 0.78rem; color: var(--ish-muted); }

/* Kyocera families (hub page): one slip-line list per machine type. */
.ish-famlist + .ish-famlist { margin-top: var(--ish-space-6, 3rem); }
.ish-famlist__h {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--ish-space-2);
	margin: 0 0 var(--ish-space-3); font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem); line-height: 1.2;
}
.ish-famlist__h small { font-family: var(--ish-mono); font-size: 0.8rem; font-weight: 400; color: var(--ish-muted); }

.ish-famlist__h { font-weight: 800; font-stretch: 88%; }
figure.ish-machine__photo.ish-machine__photo { margin: var(--ish-space-5) 0 0; }
.ish-specs .ish-btn--quiet { padding-inline: 0; min-height: 44px; }

/* Price table (money pages): every machine, grouped by type; stacks into slip lines on phones. */
.ish-pricetable table { width: 100%; border-collapse: collapse; border: 0; margin: 0; font-variant-numeric: tabular-nums; }
.ish-pricetable caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ish-pricetable th, .ish-pricetable td { background: transparent !important; border: 0; border-bottom: 1px dashed var(--ish-rule); padding: 0.8rem 0.75rem; text-align: left; vertical-align: top; }
.ish-pricetable thead th { position: sticky; top: var(--ish-header-h, 64px); z-index: 1; background: var(--ish-paper) !important; font-family: var(--ish-mono); font-size: 0.75rem; font-weight: 600; color: var(--ish-muted); border-bottom: 1px solid var(--ish-ink); }
.ish-pricetable .ish-num { text-align: right; white-space: nowrap; }
.ish-pricetable td.ish-num { font-weight: 700; font-size: 1.0625rem; color: var(--ish-figure); }
.ish-pricetable small { display: block; font-family: var(--ish-mono); font-size: 0.75rem; font-weight: 400; color: var(--ish-muted); }
.ish-pricetable tbody th a { color: var(--ish-ink); font-weight: 700; text-decoration: none; }
.ish-pricetable tbody th a:hover { color: var(--ish-link); text-decoration: underline; }
.ish-pricetable__group th { padding-top: var(--ish-space-6); font-weight: 800; font-stretch: 88%; font-size: 1.25rem; border-bottom: 1px solid var(--ish-ink); }
.ish-pricetable .ish-ask { color: var(--ish-link); font-weight: 600; background: var(--ish-wash-warm); padding: 0.1em 0.45em; border-radius: 3px; }
.ish-pricetable .ish-na { color: var(--ish-muted); font-weight: 400; }
.ish-pricetable__note { margin: var(--ish-space-4) 0 var(--ish-space-2); font-size: 0.8125rem; color: var(--ish-muted); max-width: 75ch; }
@media (max-width: 767px) {
	.ish-pricetable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.ish-pricetable table, .ish-pricetable tbody, .ish-pricetable tr, .ish-pricetable th, .ish-pricetable td { display: block; width: 100%; }
	.ish-pricetable tr { padding: var(--ish-space-3) 0; border-bottom: 1px dashed var(--ish-rule); }
	.ish-pricetable th, .ish-pricetable td { border: 0; padding: 0.2rem 0; }
	.ish-pricetable tbody th { padding-bottom: var(--ish-space-2); }
	.ish-pricetable td.ish-num { display: grid; grid-template-columns: 1fr auto; gap: 0 var(--ish-space-3); align-items: baseline; text-align: right; }
	.ish-pricetable td.ish-num::before { content: attr(data-label); text-align: left; font-family: var(--ish-mono); font-size: 0.75rem; font-weight: 400; color: var(--ish-muted); white-space: normal; }
	.ish-pricetable td.ish-num small { grid-column: 2; }
	.ish-pricetable__group th { padding-top: var(--ish-space-5); }
	.ish-pricetable td.is-na { display: none; }
}

/* Numbered steps and definition lists on explainer sections. */
.ish-steps { list-style: none; counter-reset: ish-step; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: var(--ish-space-5); }
.ish-steps li { counter-increment: ish-step; border-top: 1px solid var(--ish-ink); padding-top: var(--ish-space-3); }
.ish-steps li::before { content: counter(ish-step, decimal-leading-zero); display: block; font-family: var(--ish-mono); font-size: 0.8125rem; color: var(--ish-muted); margin-bottom: var(--ish-space-2); }
.ish-steps strong { display: block; color: var(--ish-ink); font-size: 1.0625rem; margin-bottom: 0.35rem; }
.ish-steps span { display: block; font-size: 0.9375rem; }
.ish-defs { margin: 0; display: grid; gap: 0; border-top: 1px dashed var(--ish-rule); }
.ish-defs > div { display: grid; grid-template-columns: minmax(10rem, 16rem) 1fr; gap: var(--ish-space-2) var(--ish-space-5); padding: var(--ish-space-4) 0; border-bottom: 1px dashed var(--ish-rule); }
.ish-defs dt { font-weight: 700; color: var(--ish-ink); }
.ish-defs dd { margin: 0; max-width: 65ch; }
@media (max-width: 767px) { .ish-defs > div { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------- forms and the compare calculator */

.ish-in { display: grid; gap: 0.4rem; margin: 0 0 var(--ish-space-4); }
.ish-in[hidden] { display: none; }
.ish-in > label { font-size: 0.875rem; font-weight: 600; color: var(--ish-ink); }
.ish-in__box { display: flex; align-items: stretch; border: 1.5px solid var(--ish-field); border-radius: var(--ish-radius-field); background: var(--ish-paper); overflow: hidden; }
.ish-in__box:focus-within { outline: 2px solid var(--ish-link); outline-offset: 2px; }
.ish-in__box input { flex: 1; min-width: 0; min-height: 48px; border: 0 !important; padding: 0 0.85rem; background: transparent; color: var(--ish-ink); font: 500 1.0625rem var(--ish-mono); font-variant-numeric: tabular-nums; outline: 0; box-shadow: none !important; }
.ish-in__unit { display: flex; align-items: center; padding: 0 0.85rem; font: 500 0.8125rem var(--ish-mono); color: var(--ish-muted); background: var(--ish-counter); }
.ish-in__unit--pre { padding-right: 0.6rem; }
.ish-in__hint { margin: 0; font-size: 0.8125rem; color: var(--ish-muted); }
.ish-in > input, .ish-in > select, .ish-cmp select {
	min-height: 48px; width: 100%; padding: 0 0.85rem;
	border: 1.5px solid var(--ish-field); border-radius: var(--ish-radius-field);
	background: var(--ish-paper); color: var(--ish-ink); font: 500 1rem var(--ish-sans);
}
.ish-in > input:focus-visible, .ish-in > select:focus-visible { outline: 2px solid var(--ish-link); outline-offset: 2px; }
.ish-in input[aria-invalid="true"], .ish-consent input[aria-invalid="true"] { border-color: #B42318; outline: 2px solid #B42318; }

.ish-choice { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 3px; margin: 0 var(--ish-space-2) var(--ish-space-4) 0; border-radius: var(--ish-radius-pill); background: var(--ish-counter); }
.ish-choice label { position: relative; display: inline-flex; align-items: center; min-height: 40px; padding: 0 0.95rem; border-radius: var(--ish-radius-pill); font: 600 0.875rem/1 var(--ish-sans); color: var(--ish-muted); cursor: pointer; transition: background-color 160ms ease, color 160ms ease; }
.ish-choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.ish-choice label:has(input:checked) { background: var(--ish-paper); color: var(--ish-ink); box-shadow: 0 1px 2px hsl(var(--ish-shadow) / 0.16); }
.ish-choice label:has(input:focus-visible) { outline: 2px solid var(--ish-link); outline-offset: 2px; }

.ish-cmp { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--ish-space-6) 56px; align-items: start; }
.ish-cmp__group { margin: 0 0 var(--ish-space-5); padding: 0; border: 0; min-width: 0; }
.ish-cmp__group legend { margin-bottom: var(--ish-space-3); padding: 0; font-weight: 800; font-stretch: 88%; font-size: 1.25rem; color: var(--ish-ink); }
.ish-cmp__out { position: sticky; top: calc(var(--ish-header-h, 64px) + 16px); display: grid; gap: var(--ish-space-5); }
.ish-cmp__empty { margin: var(--ish-space-4) 0; color: var(--ish-muted); }
.ish-cmp__period { margin: 0 0 var(--ish-space-3); font-family: var(--ish-mono); font-size: 0.8125rem; color: var(--ish-muted); }
.ish-cmp__who { margin: var(--ish-space-3) 0 var(--ish-space-2); font-weight: 800; font-stretch: 88%; font-size: 1.0625rem; color: var(--ish-ink); }
.ish-cmp__who a { font-weight: 600; font-stretch: 100%; font-size: 0.875rem; margin-left: var(--ish-space-2); }
.ish-cmp__verdict { margin: var(--ish-space-3) 0 0; font-weight: 600; color: var(--ish-ink); }
.ish-line--strong .ish-line__label, .ish-line--strong .ish-line__amount { font-weight: 700; color: var(--ish-ink); }
.ish-cmp__lead, .ish-form { padding: var(--ish-space-5); border: 1px solid var(--ish-rule); border-radius: var(--ish-radius-field); background: var(--ish-paper); }
.ish-cmp__lead h3 { margin: 0 0 var(--ish-space-2); font-size: 1.25rem; font-weight: 800; font-stretch: 88%; }
.ish-cmp__lead > p { margin: 0 0 var(--ish-space-4); color: var(--ish-muted); font-size: 0.9375rem; }
.ish-cmp__lead[hidden] { display: none; }
.ish-consent { display: grid; grid-template-columns: auto 1fr; gap: var(--ish-space-2); align-items: start; margin: 0 0 var(--ish-space-4); font-size: 0.875rem; }
.ish-consent input { width: 20px; height: 20px; margin-top: 1px; accent-color: var(--ish-link); }
.ish-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ish-form__msg { min-height: 1.4em; margin: 0 0 var(--ish-space-3); font-size: 0.9375rem; font-weight: 600; color: var(--ish-ink); }
.ish-cmp__lead.is-sent .ish-form__msg { color: var(--ish-link); }
.ish-cmp__lead button[type="submit"] { border: 0; min-height: 52px; padding: 0 1.75rem; cursor: pointer; }
@media (max-width: 1023px) {
	.ish-cmp { grid-template-columns: minmax(0, 1fr); }
	.ish-cmp__out { position: static; }
}

/* Quote summary slip (quote page). */
.ish-qsum__title { margin: var(--ish-space-2) 0 0; font-weight: 800; font-stretch: 85%; font-size: 1.375rem; color: var(--ish-ink); }
.ish-qsum__kind { margin: 0 0 var(--ish-space-3); font-size: 0.875rem; color: var(--ish-muted); }
.ish-qsum__text { color: var(--ish-muted); }

/* Elementor Pro forms, in the house style. */
.ish-form .elementor-field-group { margin-bottom: var(--ish-space-4); }
.ish-form .elementor-field-label { font-size: 0.875rem; font-weight: 600; color: var(--ish-ink); margin-bottom: 0.4rem; }
.ish-form .elementor-field-textual,
.ish-form select.elementor-field {
	min-height: 48px; border: 1.5px solid var(--ish-field) !important; border-radius: var(--ish-radius-field) !important;
	background: var(--ish-paper) !important; color: var(--ish-ink) !important; font: 500 1rem var(--ish-sans); padding: 0 0.85rem;
}
.ish-form textarea.elementor-field-textual { padding: 0.75rem 0.85rem; min-height: 120px; }
.ish-form .elementor-field-textual:focus { outline: 2px solid var(--ish-link); outline-offset: 2px; box-shadow: none; }
.ish-form .elementor-field-type-acceptance .elementor-field-subgroup label { font-size: 0.875rem; }
.ish-form .elementor-field-type-acceptance input { width: 20px; height: 20px; accent-color: var(--ish-link); }
.ish-form .elementor-button { min-height: 52px; border-radius: var(--ish-radius-pill); background: var(--ish-action) !important; color: var(--ish-on-action) !important; font-weight: 700; }
.ish-form .elementor-message { font-weight: 600; }
.ish-form .elementor-message-success { color: var(--ish-link); }

/* iShure lead forms (toner requests, finder, repairs). */
.ish-leadform__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--ish-space-4); }
.ish-leadform__grid .ish-in--wide { grid-column: 1 / -1; }
.ish-in > textarea { width: 100%; padding: 0.75rem 0.85rem; border: 1.5px solid var(--ish-field); border-radius: var(--ish-radius-field); background: var(--ish-paper); color: var(--ish-ink); font: 500 1rem var(--ish-sans); }
.ish-leadform.is-sent .ish-form__msg { color: var(--ish-link); }
.ish-leadform button[type="submit"] { border: 0; min-height: 52px; padding: 0 1.75rem; cursor: pointer; }
@media (max-width: 600px) { .ish-leadform__grid { grid-template-columns: minmax(0, 1fr); } }

/* Toner finder and TK-code pages. */
.ish-finder .ish-lookup { max-width: 40rem; }
.ish-finder__status { margin: var(--ish-space-3) 0; font-size: 0.875rem; color: var(--ish-muted); min-height: 1.3em; }
.ish-finder__out:empty { display: none; }
.ish-part__name a { color: var(--ish-ink); font-weight: 700; }
.ish-part__name small + small { margin-top: 0.15rem; }
.ish-fits { margin: var(--ish-space-6) 0; }
.ish-fits h2 { font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem); font-weight: 800; font-stretch: 88%; margin: 0 0 var(--ish-space-3); }
.ish-fits ul { list-style: none; margin: 0; padding: 0; columns: 2 16rem; column-gap: var(--ish-space-6); }
.ish-fits li { break-inside: avoid; padding: 0.5rem 0; border-bottom: 1px dashed var(--ish-rule); }
.ish-fits small { display: block; font-size: 0.78rem; color: var(--ish-muted); }
.ish-parts--toner + .ish-parts__foot .ish-stamp { display: inline; margin-left: var(--ish-space-2); }

/* Machine finder quiz. */
.ish-mf { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--ish-space-6) 56px; align-items: start; }
.ish-mf__step { margin: 0 0 var(--ish-space-4); padding: 0; border: 0; min-width: 0; }
.ish-mf__step legend { margin-bottom: var(--ish-space-2); padding: 0; font-weight: 700; font-size: 1.0625rem; color: var(--ish-ink); }
.ish-mf__n { font-family: var(--ish-mono); font-size: 0.78rem; font-weight: 500; color: var(--ish-muted); margin-right: 0.35rem; }
.ish-mf .ish-choice { margin-bottom: 0; }
.ish-mf__out { position: sticky; top: calc(var(--ish-header-h, 64px) + 16px); display: grid; gap: var(--ish-space-5); }
.ish-mf__out [data-o="lead"][hidden] { display: none; }
.ish-qsum__title a { color: var(--ish-ink); text-decoration: none; }
.ish-qsum__title a:hover { color: var(--ish-link); text-decoration: underline; }
@media (max-width: 1023px) { .ish-mf { grid-template-columns: minmax(0, 1fr); } .ish-mf__out { position: static; } }

/* Big figures (service promise), code link grids, small notes. */
.ish-figures { margin: var(--ish-space-5) 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1px; background: var(--ish-rule); border: 1px solid var(--ish-rule); }
.ish-figures > div { background: var(--ish-paper); padding: var(--ish-space-4) var(--ish-space-4) var(--ish-space-5); display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: var(--ish-space-2); }
.ish-figures dt { font-size: 0.875rem; color: var(--ish-muted); }
.ish-figures dd { margin: 0; font-weight: 800; font-stretch: 82%; font-size: clamp(2rem, 1.6rem + 1.6vw, 3rem); line-height: 1; color: var(--ish-figure); font-variant-numeric: tabular-nums; }
.ish-codes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: var(--ish-space-2); }
.ish-codes--wide { grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); }
.ish-codes a { display: flex; align-items: center; min-height: 48px; padding: 0 var(--ish-space-4); border: 1px solid var(--ish-rule); border-radius: var(--ish-radius-field); background: var(--ish-paper); color: var(--ish-ink); font: 600 0.9375rem var(--ish-mono); text-decoration: none; transition: border-color 160ms ease, color 160ms ease; }
.ish-codes--wide a { font-family: var(--ish-sans); }
.ish-codes a:hover { border-color: var(--ish-link); color: var(--ish-link); }
.ish-note { font-size: 0.8125rem; color: var(--ish-muted); }

/* Range and parts lists. */
.ish-rangelist + .ish-rangelist { margin-top: var(--ish-space-6); }
.ish-rangelist { scroll-margin-top: calc(var(--ish-header-h, 64px) + 16px); }
.ish-part__name small a { color: var(--ish-link); }

/* Guides: long-form reading. */
.ish-lede { font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem); line-height: 1.55; color: var(--ish-muted); max-width: 62ch; }
.ish-prose { max-width: 68ch; }
.ish-prose h2 { margin: var(--ish-space-6) 0 var(--ish-space-2); font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem); font-weight: 800; font-stretch: 88%; line-height: 1.25; color: var(--ish-ink); }
.ish-prose h2:first-child { margin-top: 0; }
.ish-prose p, .ish-prose li { font-size: 1.0625rem; line-height: 1.65; color: var(--ish-ink); }
.ish-prose ul { padding-left: 1.2rem; }
.ish-prose li + li { margin-top: 0.4rem; }
.ish-prose a { color: var(--ish-link); }
.ish-guides { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px dashed var(--ish-rule); max-width: 72ch; }
.ish-guides li { padding: var(--ish-space-4) 0; border-bottom: 1px dashed var(--ish-rule); }
.ish-guides a { display: block; font-weight: 800; font-stretch: 88%; font-size: 1.25rem; color: var(--ish-ink); text-decoration: none; margin-bottom: 0.3rem; }
.ish-guides a:hover { color: var(--ish-link); text-decoration: underline; }
.ish-guides span { color: var(--ish-muted); }

/* Links inside running text are underlined (not colour alone), incl. form consent lines. */
.ish-consent a, .ish-form .elementor-field-type-acceptance a, .ish-prose a, .ish-defs a, .ish-note a { text-decoration: underline; text-underline-offset: 0.15em; }
.elementor-widget-text-editor p a:not(.ish-btn), .ish-footer-legal a { text-decoration: underline; text-underline-offset: 0.15em; }

/* Phones: a long price text ("Ask us for a price") wraps instead of squeezing the name. */
@media (max-width: 600px) {
	.ish-part__price { white-space: normal; text-align: right; max-width: 8.5rem; font-size: 0.875rem; }
}

/* Draft-only marker for terms still to be confirmed (terms page). */
mark.ish-confirm { background: #FFF3C4; color: var(--ish-ink); padding: 0 0.2em; border-radius: 3px; font-weight: 600; }

/* ---------------------------------------------------------------- shop */
.ish-shop { background: var(--ish-counter); }
.ish-shop__inner { max-width: 1240px; margin: 0 auto; padding: 40px 20px 88px; }
.ish-shop__notices:empty { display: none; }
.ish-shop__notices .woocommerce-message, .ish-shop__notices .woocommerce-info, .ish-shop__notices .woocommerce-error { margin: 0 0 var(--ish-space-4); border-top-color: var(--ish-link); background: var(--ish-paper); }
.ish-shop__finder { margin: var(--ish-space-5) 0 var(--ish-space-6); }
.ish-shop__count { margin: var(--ish-space-4) 0 var(--ish-space-2); font: 500 0.8125rem var(--ish-mono); color: var(--ish-muted); }
.ish-shop__foot { margin-top: var(--ish-space-6); }
.ish-shop__sections { list-style: none; margin: 0 0 var(--ish-space-6); padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: var(--ish-space-3); }
.ish-shop__sections a { display: grid; gap: 0.3rem; padding: var(--ish-space-4) var(--ish-space-5); min-height: 6rem; border: 1px solid var(--ish-rule); border-radius: var(--ish-radius-field); background: var(--ish-paper); color: var(--ish-ink); text-decoration: none; transition: border-color 160ms ease, transform 160ms var(--ish-ease-out); }
.ish-shop__sections a:hover { border-color: var(--ish-link); }
.ish-shop__sections a:active { transform: scale(0.98); }
.ish-shop__sections strong { font-weight: 800; font-stretch: 88%; font-size: 1.25rem; }
.ish-shop__sections span { font: 500 0.8125rem var(--ish-mono); color: var(--ish-muted); }
.ish-shop__terms { margin: 0; display: grid; gap: 0.35rem; font-size: 0.8125rem; }
.ish-shop__terms > div { display: grid; grid-template-columns: 6.5rem 1fr; gap: var(--ish-space-2); }
.ish-shop__terms dt { font-weight: 600; color: var(--ish-ink); }
.ish-shop__terms dd { margin: 0; color: var(--ish-muted); }
.ish-pdp { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--ish-space-6) 56px; align-items: start; }
.ish-pdp__buy { position: sticky; top: calc(var(--ish-header-h, 64px) + 16px); display: grid; gap: var(--ish-space-5); }
.ish-pdp__desc { max-width: 62ch; color: var(--ish-ink); }
.ish-pdp__cart { display: grid; grid-template-columns: 5.5rem 1fr; gap: var(--ish-space-2) var(--ish-space-3); align-items: end; margin-top: var(--ish-space-4); }
.ish-pdp__cart label { grid-column: 1 / -1; font-size: 0.875rem; font-weight: 600; }
.ish-pdp__cart input { min-height: 52px; width: 100%; padding: 0 0.75rem; border: 1.5px solid var(--ish-field); border-radius: var(--ish-radius-field); background: var(--ish-paper); color: var(--ish-ink); font: 600 1.0625rem var(--ish-mono); }
.ish-pdp__cart button { min-height: 52px; border: 0; cursor: pointer; }
@media (max-width: 1023px) { .ish-pdp { grid-template-columns: minmax(0, 1fr); } .ish-pdp__buy { position: static; } }
@media (max-width: 767px) { .ish-shop__inner { padding: 24px 16px 56px; } }

/* WooCommerce basket, checkout and account in the house style (block cart and checkout). */
.woocommerce-cart .wc-block-cart, .woocommerce-checkout .wc-block-checkout, .woocommerce-account .woocommerce { font-family: var(--ish-sans); color: var(--ish-ink); }
.wc-block-components-button:not(.is-link), .woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
	background: var(--ish-action) !important; color: var(--ish-on-action) !important; border-radius: var(--ish-radius-pill) !important; font-weight: 700 !important; min-height: 48px; border: 0 !important;
}
.wc-block-components-text-input input, .wc-block-components-combobox input, .woocommerce form .input-text, .woocommerce form select { border: 1.5px solid var(--ish-field) !important; border-radius: var(--ish-radius-field) !important; }
.wc-block-components-totals-item__value, .wc-block-components-product-price, .woocommerce-Price-amount { font-variant-numeric: tabular-nums; }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-weight: 800; font-stretch: 85%; font-size: 1.5rem; }
.woocommerce a:not(.button), .wc-block-components-product-name { color: var(--ish-link); }
/* WooCommerce's own pages (basket, checkout, account) in the page frame; buttons never underlined. */
.woocommerce-cart main#content, .woocommerce-checkout main#content, .woocommerce-account main#content { max-width: 1240px; margin: 0 auto; padding: 40px 20px 88px; }
@media (max-width: 767px) { .woocommerce-cart main#content, .woocommerce-checkout main#content, .woocommerce-account main#content { padding: 24px 16px 56px; } }
.wc-block-components-button, .wc-block-components-button:hover, .woocommerce a.button, .ish-btn { text-decoration: none !important; }
.ish-reorder { margin: var(--ish-space-5) 0 var(--ish-space-6); padding: var(--ish-space-4) var(--ish-space-5); border: 1px solid var(--ish-rule); border-radius: var(--ish-radius-field); background: var(--ish-paper); }

/* Reviews (/reviews/): quote cards. Placeholder cards are dashed and flagged until replaced. */
.ish-reviews { display: grid; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); gap: var(--ish-space-4); }
.ish-review { margin: 0; padding: var(--ish-space-5); border: 1px solid var(--ish-rule); border-radius: var(--ish-radius-field); background: var(--ish-paper); display: flex; flex-direction: column; gap: var(--ish-space-3); }
.ish-review blockquote { margin: 0; font-size: 1.0625rem; line-height: 1.6; color: var(--ish-ink); }
.ish-review blockquote p { margin: 0; }
.ish-review figcaption { display: grid; gap: 0.15rem; margin-top: auto; font-size: 0.875rem; color: var(--ish-muted); }
.ish-review figcaption strong { color: var(--ish-ink); }
.ish-review--placeholder { border-style: dashed; border-color: var(--ish-field); }
.ish-review__flag { margin: 0; font: 600 0.75rem var(--ish-mono); color: #8A5A00; background: #FFF3C4; align-self: flex-start; padding: 0.15rem 0.45rem; border-radius: 3px; }

/* Logo (header: colour, white in dark mode; footer: white). Source files are 2x. */
.ish-logo { display: inline-flex; align-items: center; line-height: 0; }
.ish-logo-wrap .ish-logo img, .ish-logo img { display: block; width: auto; max-width: none; height: 44px; }
.ish-footer .ish-logo-wrap .ish-logo img { height: 52px; }
@media (max-width: 767px) { .ish-logo-wrap .ish-logo img, .ish-logo img { height: 36px; } }
.elementor-widget.ish-logo-wrap { flex: 0 0 auto !important; width: auto !important; min-width: max-content; margin-inline-end: var(--ish-space-4); }
.ish-logo-wrap .elementor-shortcode { line-height: 0; }
.ish-header .elementor-button { white-space: nowrap; }
@media (max-width: 480px) { .ish-header .elementor-button { padding: 0.55rem 0.9rem; font-size: 0.875rem; } .elementor-widget.ish-logo-wrap { margin-inline-end: var(--ish-space-2); } }

/* The verdict on a comparison sits on a warm wash, so the answer is the first thing read. */
.ish-cmp__verdict:not(:empty) { background: var(--ish-wash-warm); padding: var(--ish-space-3) var(--ish-space-4); border-radius: var(--ish-radius-field); }
/* The stamp keeps its ink inside any slip foot (facts, parts, quote summary). */
.ish-slip .ish-stamp, .ish-slip__foot .ish-stamp, p.ish-stamp, .ish-band .ish-slip .ish-slip__foot p.ish-stamp { color: var(--ish-stamp); }