/* =========================================================================
   Pushkar Brand — theme stylesheet
   Colours, fonts and sizes come from theme.json presets (--wp--preset--*),
   so the style variations (Monitor / Manual) re-skin everything here.
   ========================================================================= */

:root {
	--pb-bg: var(--wp--preset--color--base);
	--pb-bg-2: var(--wp--preset--color--base-2);
	--pb-edge: var(--wp--preset--color--base-3);
	--pb-fg: var(--wp--preset--color--contrast);
	--pb-fg-2: var(--wp--preset--color--contrast-2);
	--pb-fg-3: var(--wp--preset--color--contrast-3);
	--pb-accent: var(--wp--preset--color--accent);
	--pb-accent-ink: var(--wp--preset--color--accent-ink);
	--pb-line: color-mix(in srgb, var(--pb-fg) 15%, transparent);
	--pb-line-strong: color-mix(in srgb, var(--pb-fg) 34%, transparent);
	--pb-display: var(--wp--preset--font-family--display);
	--pb-body: var(--wp--preset--font-family--body);
	--pb-gutter: var(--wp--style--root--padding-left, clamp(1rem, 0.4rem + 3vw, 3rem));
	--pb-header-h: 4.25rem;
	--pb-ease: cubic-bezier(0.22, 0.61, 0.2, 1);
	--pb-wide: var(--wp--style--global--wide-size, 92rem);
	/* content column = wide size minus the side gutters (aligns with header/footer content) */
	--pb-col: calc(var(--pb-wide) - 2 * var(--pb-gutter));
	--pb-ink: #0e0e0c;
	--pb-paper: #ece8df;
	--pb-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 12'%3E%3Cpath d='M0 6h17M13 1.5 17.5 6 13 10.5' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E");
}

@media (min-width: 64rem) {
	:root { --pb-header-h: 5rem; }
}

/* ---------- Base ---------------------------------------------------------- */

html {
	scroll-padding-top: calc(var(--pb-header-h) + 1rem);
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	font-variant-numeric: tabular-nums;
	overflow-x: clip;
}

::selection {
	background: var(--pb-accent);
	color: var(--pb-accent-ink);
}

:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--pb-accent);
	outline-offset: 3px;
}

a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
	transition: text-decoration-color 0.2s, color 0.2s;
}

a:hover {
	text-decoration-color: var(--pb-accent);
	text-decoration-thickness: 2px;
}

h1, h2, h3, h4, h5, h6 {
	font-optical-sizing: auto;
	text-wrap: balance;
	overflow-wrap: break-word;
	hyphens: manual;
}

h1, .has-display-font-size { font-stretch: 125%; }
h2 { font-stretch: 118%; }
h3 { font-stretch: 110%; }
h4, h5, h6 { font-stretch: 100%; }

p { text-wrap: pretty; }

img, video { max-width: 100%; height: auto; }

strong, b { font-weight: 700; }

.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.skip-link:focus {
	background: var(--pb-accent);
	color: var(--pb-accent-ink);
	z-index: 100;
}

/* Small functional label (used sparingly: footer columns, form fields). */
.pb-label {
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--pb-fg-2);
	margin: 0;
}

/* ---------- Header ------------------------------------------------------- */

.pb-header {
	position: fixed;
	inset: 0 0 auto 0;
	z-index: 40;
	transition: transform 0.4s var(--pb-ease), background-color 0.3s, border-color 0.3s;
	border-bottom: 1px solid transparent;
}

.admin-bar .pb-header { top: var(--wp-admin--admin-bar--height, 32px); }

.has-hero .pb-header:not(.is-solid) { color: var(--pb-paper); }
.has-hero .pb-header:not(.is-solid) .wp-block-navigation__responsive-container-open { border-color: color-mix(in srgb, var(--pb-paper) 40%, transparent); }
.pb-header.is-solid,
body:not(.has-hero) .pb-header {
	background: color-mix(in srgb, var(--pb-bg) 94%, transparent);
	border-bottom-color: var(--pb-line);
	color: var(--pb-fg);
}

.pb-header.is-tucked { transform: translateY(-100%); }
.admin-bar .pb-header.is-tucked { transform: translateY(calc(-100% - var(--wp-admin--admin-bar--height, 32px))); }

.pb-header__inner {
	box-sizing: border-box;
	height: var(--pb-header-h);
	max-width: var(--pb-wide);
	margin-inline: auto;
	padding-inline: var(--pb-gutter);
	gap: 1.5rem;
}

.pb-logo { flex: none; line-height: 0; }
.pb-logo a { display: inline-block; }
.pb-logo img.custom-logo {
	width: auto !important;
	height: 2.6rem !important;
	object-fit: contain;
}
@media (min-width: 64rem) {
	.pb-header .pb-logo img.custom-logo { height: 3.1rem !important; }
}

/* Logo on light surfaces (the Manual variation sets an invert filter). */
.pb-header.is-solid .pb-logo img,
body:not(.has-hero) .pb-header .pb-logo img,
.pb-footer .pb-logo img,
.pb-overlay .pb-logo img { filter: var(--wp--custom--logo-filter, none); }

/* Desktop navigation */
.pb-nav { --pb-nav-gap: clamp(1rem, 0.2rem + 1.6vw, 2.25rem); }
.pb-nav .wp-block-navigation__container { gap: var(--pb-nav-gap); }
.pb-nav .wp-block-navigation-item__content {
	padding-block: 0.6rem;
	text-decoration: none;
	position: relative;
}
.pb-nav .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0.25rem;
	height: 2px;
	background: var(--pb-accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.25s var(--pb-ease);
}
.pb-nav .wp-block-navigation-item__content:hover::after,
.pb-nav .current-menu-item > .wp-block-navigation-item__content::after,
.pb-nav [aria-current="page"]::after {
	transform: scaleX(1);
}
.pb-nav .wp-block-navigation__submenu-icon { margin-left: 0.3em; width: 0.6em; height: 0.6em; }

/* Desktop dropdowns */
.pb-nav .wp-block-navigation__submenu-container {
	background: var(--pb-bg-2) !important;
	color: var(--pb-fg) !important;
	border: 1px solid var(--pb-line) !important;
	padding: 0.5rem 0 !important;
	min-width: 16.5rem !important;
	top: calc(100% + 0.25rem) !important;
}
.pb-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.65rem 1.1rem !important;
	width: 100%;
}
.pb-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after { display: none; }
.pb-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background: var(--pb-accent);
	color: var(--pb-accent-ink);
}

/* "Menu" button on phones/tablets */
.pb-nav .wp-block-navigation__responsive-container-open {
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border: 1px solid var(--pb-line-strong);
	padding: 0.7rem 1rem;
	color: inherit;
}

/* Phone/tablet overlay (template part "nav-overlay") */
.wp-block-navigation__responsive-container.is-menu-open {
	background: var(--pb-bg) !important;
	color: var(--pb-fg) !important;
	padding: 0 !important;
}
.pb-overlay {
	min-height: 100%;
	display: flex;
	flex-direction: column;
	padding: 0 var(--pb-gutter) 2rem;
}
.pb-overlay__bar { height: var(--pb-header-h); flex: none; }
.pb-overlay__close {
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border: 1px solid var(--pb-line-strong) !important;
	background: transparent !important;
	color: inherit !important;
	padding: 0.7rem 1rem !important;
	cursor: pointer;
}
.pb-overlay__nav { margin-top: 1.5rem; flex: 1 0 auto; align-items: stretch !important; }
.pb-overlay__nav .wp-block-navigation__container { gap: 0 !important; width: 100%; align-items: stretch !important; }
.pb-overlay__nav .wp-block-navigation-item { width: 100%; flex-direction: column; align-items: flex-start !important; border-top: 1px solid var(--pb-line); }
.pb-overlay__nav > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	font-size: clamp(1.75rem, 1rem + 4.5vw, 3rem);
	font-stretch: 125%;
	font-weight: 800;
	letter-spacing: -0.005em;
	padding: 0.6rem 0 !important;
	line-height: 1;
	text-decoration: none;
}
.pb-overlay__nav .wp-block-navigation__submenu-container {
	position: static !important;
	border: 0 !important;
	padding: 0 0 0.9rem !important;
	background: transparent !important;
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap;
	gap: 0.15rem 1.25rem;
	opacity: 1 !important;
	visibility: visible !important;
	width: auto !important;
	height: auto !important;
	min-width: 0 !important;
}
.pb-overlay__nav .wp-block-navigation__submenu-container .wp-block-navigation-item { border: 0; width: auto; }
.pb-overlay__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	font-stretch: 100%;
	letter-spacing: 0.04em;
	padding: 0.35rem 0 !important;
	color: var(--pb-fg-2);
}
.pb-overlay__nav .wp-block-navigation__submenu-container { row-gap: 0 !important; }
.pb-overlay__nav .wp-block-navigation__submenu-container .wp-block-navigation-item { min-height: 0; }
.pb-overlay__meta {
	font-family: var(--pb-body);
	text-transform: none;
	letter-spacing: 0;
	font-weight: 400;
	margin-top: 2rem;
	border-top: 1px solid var(--pb-line);
	padding-top: 1.25rem;
	font-size: var(--wp--preset--font-size--small);
}
.pb-overlay__meta p { margin: 0 0 0.4rem; }
.pb-overlay__meta a + a { margin-left: 1.25rem; }

/* ---------- Main & page flow --------------------------------------------- */

.pb-main { margin: 0; }
body:not(.has-hero) .pb-main { padding-top: calc(var(--pb-header-h) + var(--wp--preset--spacing--60)); }
.pb-main--plain { padding-bottom: var(--wp--preset--spacing--70); }
.pb-plain-title { font-size: var(--wp--preset--font-size--xx-large); margin-bottom: var(--wp--preset--spacing--40); }

.pb-content > * + * { margin-block-start: var(--wp--style--block-gap); }
.pb-content > .alignfull { margin-block-start: 0; }
.pb-content > .alignfull + .alignfull { margin-block-start: 0; }

/* Section rhythm: every top-level full-width group is a band. */
.pb-band {
	padding-block: var(--wp--preset--spacing--70);
	padding-inline: var(--pb-gutter);
}
.pb-band + .pb-band { border-top: 1px solid var(--pb-line); }
.pb-band > * { max-width: var(--pb-col); margin-inline: auto; }
.pb-band > * + * { margin-block-start: var(--wp--preset--spacing--40); }

.pb-band__head {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	justify-content: space-between;
	gap: 1rem 2rem;
}
.pb-band__head > * { margin: 0; }

/* ---------- Heroes (Cover blocks with class pb-hero) ---------------------- */

.wp-block-cover.pb-hero {
	min-height: clamp(22rem, 58svh, 40rem);
	padding: 0 !important;
	align-items: flex-end;
	overflow: hidden;
	isolation: isolate;
}
.wp-block-cover.pb-hero .wp-block-cover__background {
	background: linear-gradient(180deg,
		color-mix(in srgb, var(--pb-ink) 62%, transparent) 0%,
		color-mix(in srgb, var(--pb-ink) 10%, transparent) 32%,
		color-mix(in srgb, var(--pb-ink) 22%, transparent) 58%,
		color-mix(in srgb, var(--pb-ink) 94%, transparent) 100%) !important;
	opacity: 1 !important;
}
.wp-block-cover.pb-hero .wp-block-cover__inner-container {
	box-sizing: border-box;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: calc(var(--pb-header-h) + 2rem) var(--pb-gutter) var(--wp--preset--spacing--60);
	padding-inline: max(var(--pb-gutter), (100% - var(--pb-col)) / 2);
	color: var(--pb-paper);
}
.wp-block-cover.pb-hero { background: var(--pb-ink); }
.wp-block-cover.pb-hero :where(h1, h2, h3, p, a) { color: var(--pb-paper); }
.wp-block-cover.pb-hero .wp-block-button.is-style-fill .wp-block-button__link {
	background: var(--pb-paper);
	border-color: var(--pb-paper);
	color: var(--pb-ink);
}
.wp-block-cover.pb-hero .wp-block-button:not(.is-style-fill) .wp-block-button__link { color: var(--pb-paper); }
.wp-block-cover.pb-hero h1 {
	font-size: var(--wp--preset--font-size--xx-large);
	margin: 0;
	max-width: 18ch;
}

/* Home hero */
.wp-block-cover.pb-hero--home { min-height: 100svh; }
/* The home loop has bright, busy cuts: a soft scrim on the text side and a quiet
   shadow keep the claim readable without dimming the whole picture. */
.wp-block-cover.pb-hero.pb-hero--home .wp-block-cover__background {
	background:
		linear-gradient(90deg,
			color-mix(in srgb, var(--pb-ink) 48%, transparent) 0%,
			color-mix(in srgb, var(--pb-ink) 20%, transparent) 40%,
			transparent 68%),
		linear-gradient(180deg,
			color-mix(in srgb, var(--pb-ink) 62%, transparent) 0%,
			color-mix(in srgb, var(--pb-ink) 10%, transparent) 32%,
			color-mix(in srgb, var(--pb-ink) 22%, transparent) 58%,
			color-mix(in srgb, var(--pb-ink) 94%, transparent) 100%) !important;
}
.pb-hero--home .pb-claim { text-shadow: 0 1px 2px rgb(14 14 12 / 0.55), 0 0 1.2rem rgb(14 14 12 / 0.45); }
.wp-block-cover.pb-hero--home h1 {
	font-size: var(--wp--preset--font-size--display);
	font-stretch: 150%;
	font-weight: 800;
	line-height: 0.86;
	letter-spacing: -0.01em;
	max-width: none;
}
.pb-claim {
	font-family: var(--pb-display);
	font-stretch: 72%;
	font-weight: 650;
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.08;
	letter-spacing: 0.035em;
	text-transform: uppercase;
	margin: 0 0 var(--wp--preset--spacing--40) !important;
}
.pb-hero--home .wp-block-buttons { margin-top: var(--wp--preset--spacing--50); }

/* One orchestrated moment: the title "locks" like a picture finding horizontal sync,
   the claim lines are typed in like a character generator. Motion-safe only. */
@media (prefers-reduced-motion: no-preference) {
	.pb-hero--home h1 {
		animation: pb-hold 1.15s steps(1, end) 0.1s both;
	}
	.pb-hero--home h1 > span,
	.pb-hero--home h1 {
		will-change: transform;
	}
	.pb-claim {
		animation: pb-type 0.9s steps(18, end) 0.05s both;
	}
	.pb-hero--home .wp-block-buttons {
		animation: pb-fade 0.6s var(--pb-ease) 1.05s both;
	}
}
@keyframes pb-hold {
	0%   { transform: translateX(-9%) skewX(-24deg); opacity: 0.0; }
	8%   { transform: translateX(7%) skewX(18deg); opacity: 1; }
	16%  { transform: translateX(-5%) skewX(-12deg); }
	26%  { transform: translateX(3.5%) skewX(8deg); }
	36%  { transform: translateX(-2%) skewX(-4deg); }
	48%  { transform: translateX(1%) skewX(2deg); }
	60%  { transform: translateX(-0.4%) skewX(-1deg); }
	72%, 100% { transform: none; opacity: 1; }
}
@keyframes pb-type {
	from { clip-path: inset(0 100% 0 0); }
	to   { clip-path: inset(0 0 0 0); }
}
@keyframes pb-fade {
	from { opacity: 0; transform: translateY(0.6rem); }
	to   { opacity: 1; transform: none; }
}

/* Background loops: the poster image shows until pushkar.js starts the loop. */
.wp-block-cover__video-background { transition: opacity 0.6s ease; }
.wp-block-cover__video-background.pb-loop-pending { opacity: 0; }
.wp-block-cover .pb-loop-poster { z-index: 0; }

/* ---------- Buttons ------------------------------------------------------- */

.wp-block-button__link { transition: background-color 0.2s, color 0.2s, border-color 0.2s; }
.wp-block-buttons { gap: 0.75rem; }

.wp-block-button.is-style-fill .wp-block-button__link {
	background: var(--pb-fg);
	color: var(--pb-bg);
	border-color: var(--pb-fg);
}
.wp-block-button.is-style-fill .wp-block-button__link:hover,
.wp-block-button.is-style-fill .wp-block-button__link:focus-visible {
	background: var(--pb-accent);
	border-color: var(--pb-accent);
	color: var(--pb-accent-ink);
}

/* Arrow link: text + drawn arrow, no box. */
.wp-block-button.is-style-arrow .wp-block-button__link {
	border: 0;
	padding: 0.4em 0;
	background: none !important;
	color: inherit !important;
	display: inline-flex;
	align-items: center;
	gap: 0.7em;
}
.wp-block-button.is-style-arrow .wp-block-button__link::after,
.wp-block-button__link.pb-go::after {
	content: "";
	width: 1.35em;
	height: 0.8em;
	background: currentColor;
	-webkit-mask: var(--pb-arrow) center / contain no-repeat;
	mask: var(--pb-arrow) center / contain no-repeat;
	transition: transform 0.25s var(--pb-ease);
}
.wp-block-button.is-style-arrow .wp-block-button__link:hover { color: var(--pb-accent) !important; }
.wp-block-button.is-style-arrow .wp-block-button__link:hover::after { transform: translateX(0.3em); }

/* Status labels on devices (a Button block with no link, styled as a state). */
.wp-block-button[class*="is-style-status-"] .wp-block-button__link {
	pointer-events: none;
	cursor: default;
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	background: transparent;
	color: var(--pb-fg);
	border-color: var(--pb-line-strong);
}
.wp-block-button[class*="is-style-status-"] .wp-block-button__link::before {
	content: "";
	width: 0.62em;
	height: 0.62em;
	flex: none;
	border: 1.5px solid currentColor;
}
.wp-block-button.is-style-status-available .wp-block-button__link {
	background: var(--pb-accent);
	color: var(--pb-accent-ink);
	border-color: var(--pb-accent);
}
.wp-block-button.is-style-status-available .wp-block-button__link::before { background: currentColor; }
.wp-block-button.is-style-status-request .wp-block-button__link::before {
	background: linear-gradient(90deg, currentColor 50%, transparent 50%);
}
.wp-block-button.is-style-status-unavailable .wp-block-button__link {
	color: var(--pb-fg-3);
	border-style: dashed;
}

/* ---------- Device entries ---------------------------------------------- */

.pb-catalog { padding-inline: var(--pb-gutter); }
.pb-catalog > * { max-width: var(--pb-col); margin-inline: auto; }

.pb-device {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding-block: var(--wp--preset--spacing--60);
	border-top: 1px solid var(--pb-line);
	margin: 0 auto !important;
	scroll-margin-top: calc(var(--pb-header-h) + 3.5rem);
}
.pb-device:first-child { border-top: 0; }
.pb-device__info { display: contents; }
.pb-device__info > * { margin: 0; }
.pb-device__info > .wp-block-heading { order: 1; font-size: var(--wp--preset--font-size--x-large); }
.pb-device__kind { order: 2; }
.pb-device__media { order: 3; }
.pb-device__info > :not(.wp-block-heading):not(.pb-device__kind) { order: 4; }

.pb-device__kind {
	color: var(--pb-fg-2);
	font-size: var(--wp--preset--font-size--small);
	margin-top: -0.35rem !important;
}
.pb-device__media { display: grid; gap: 0.75rem; margin: 0.5rem 0 !important; }
.pb-device__media > * { margin: 0 !important; }
.pb-device__media .wp-block-image img,
.pb-device__media .wp-block-gallery img { width: 100%; height: auto; }
.pb-device__media .wp-block-gallery { margin: 0; }
.pb-device__note {
	color: var(--pb-fg-2);
	font-size: var(--wp--preset--font-size--small);
}
.pb-device__price {
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--large);
	letter-spacing: 0.01em;
	padding-top: 0.25rem;
}
.pb-device .wp-block-buttons { margin-top: 0.4rem !important; }

@media (min-width: 60rem) {
	.pb-device {
		display: grid;
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		column-gap: clamp(2rem, 4vw, 5rem);
		align-items: start;
	}
	.pb-device__media { grid-column: 1; grid-row: 1; margin: 0 !important; }
	.pb-device__info {
		display: flex;
		flex-direction: column;
		gap: 1rem;
		grid-column: 2;
		grid-row: 1;
		position: sticky;
		top: calc(var(--pb-header-h) + 4.5rem);
	}
	.pb-device__info > .wp-block-heading { font-size: var(--wp--preset--font-size--x-large); }
}

/* Spec sheet list: numbers in a column, one line per feature. */
ul.is-style-specs,
ol.is-style-specs {
	list-style: none;
	padding: 0 !important;
	margin: 0.25rem 0 0;
	border-top: 1px solid var(--pb-line);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.4;
}
.is-style-specs li {
	display: flex;
	gap: 0.85rem;
	align-items: baseline;
	padding: 0.55rem 0;
	border-bottom: 1px solid var(--pb-line);
}
.is-style-specs li > strong:first-child {
	flex: 0 0 2.6rem;
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: 1.05em;
	color: var(--pb-fg);
}
.is-style-specs li:not(:has(> strong:first-child)) { padding-left: 3.45rem; }

/* In-page device index (built by pushkar.js) */
.pb-index {
	position: sticky;
	top: 0;
	z-index: 20;
	background: color-mix(in srgb, var(--pb-bg) 96%, transparent);
	border-bottom: 1px solid var(--pb-line);
	transition: top 0.4s var(--pb-ease);
}
.pb-header-visible .pb-index { top: var(--pb-header-h); }
.admin-bar .pb-index { top: var(--wp-admin--admin-bar--height, 32px); }
.admin-bar.pb-header-visible .pb-index { top: calc(var(--pb-header-h) + var(--wp-admin--admin-bar--height, 32px)); }
.pb-index ol {
	box-sizing: border-box;
	list-style: none;
	margin: 0 auto;
	padding: 0 var(--pb-gutter);
	max-width: var(--pb-wide);
	display: flex;
	gap: 1.6rem;
	overflow-x: auto;
	scrollbar-width: none;
	scroll-snap-type: x proximity;
	scroll-padding-inline: var(--pb-gutter);
}
.pb-index ol::-webkit-scrollbar { display: none; }
.pb-index li { flex: none; scroll-snap-align: start; }
.pb-index a {
	display: block;
	padding: 0.95rem 0 0.85rem;
	font-family: var(--pb-display);
	font-stretch: 100%;
	font-weight: 600;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--pb-fg-2);
	border-bottom: 2px solid transparent;
	white-space: nowrap;
}
.pb-index a:hover { color: var(--pb-fg); }
.pb-index a[aria-current="true"] { color: var(--pb-fg); border-bottom-color: var(--pb-accent); }

/* Closing note on catalogue pages ("I can bend and customize…") */
.pb-closing {
	padding: var(--wp--preset--spacing--70) var(--pb-gutter);
	border-top: 1px solid var(--pb-line);
}
.pb-closing > * { max-width: 46rem; margin-inline: auto; }
.pb-closing p { font-size: var(--wp--preset--font-size--large); line-height: 1.4; }

/* ---------- Index rows (Devices hub, Video hub) --------------------------- */

.wp-block-group.is-style-rows { border-top: 1px solid var(--pb-line); gap: 0 !important; }
.wp-block-group.is-style-rows > .wp-block-group {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.85rem;
	padding: 1.25rem 0 1.5rem;
	border-bottom: 1px solid var(--pb-line);
	margin: 0 !important;
}
.wp-block-group.is-style-rows > .wp-block-group .wp-block-image { margin: 0; overflow: hidden; }
.wp-block-group.is-style-rows > .wp-block-group .wp-block-image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	transition: transform 0.6s var(--pb-ease);
}
.wp-block-group.is-style-rows > .wp-block-group .wp-block-heading { margin: 0; font-size: var(--wp--preset--font-size--x-large); }
.wp-block-group.is-style-rows > .wp-block-group .wp-block-heading a { text-decoration: none; }
/* Whole row is clickable through the heading link. */
.wp-block-group.is-style-rows > .wp-block-group .wp-block-heading a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
.wp-block-group.is-style-rows > .wp-block-group:hover .wp-block-heading a { color: var(--pb-accent); }
.wp-block-group.is-style-rows > .wp-block-group:hover .wp-block-image img { transform: scale(1.025); }

@media (min-width: 48rem) {
	.wp-block-group.is-style-rows > .wp-block-group {
		grid-template-columns: minmax(0, 1fr) clamp(14rem, 30vw, 26rem);
		align-items: center;
		gap: 2rem;
		padding: 1.25rem 0;
	}
	.wp-block-group.is-style-rows > .wp-block-group .wp-block-image { grid-column: 2; grid-row: 1; }
	.wp-block-group.is-style-rows > .wp-block-group .wp-block-heading {
		grid-column: 1;
		grid-row: 1;
		font-size: var(--wp--preset--font-size--xx-large);
	}
}

/* ---------- Swipe strip gallery ------------------------------------------ */

.wp-block-gallery.is-style-strip {
	display: grid !important;
	grid-auto-flow: column;
	grid-auto-columns: clamp(15rem, 72vw, 28rem);
	gap: 0.75rem !important;
	overflow-x: auto;
	max-width: none !important;
	margin-left: max(0px, (100% - var(--pb-col)) / 2) !important;
	margin-right: calc(-1 * var(--pb-gutter)) !important;
	padding-right: var(--pb-gutter) !important;
	scroll-padding-inline: 0 var(--pb-gutter);
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	padding-bottom: 1rem !important;
	scrollbar-width: thin;
	scrollbar-color: var(--pb-fg-3) transparent;
	flex-wrap: nowrap !important;
}
@media (min-width: 48rem) {
	.wp-block-gallery.is-style-strip { grid-auto-columns: clamp(16rem, 29vw, 30rem); }
}

.wp-block-gallery.is-style-strip > .wp-block-image {
	width: auto !important;
	margin: 0 !important;
	scroll-snap-align: start;
	aspect-ratio: 4 / 3;
}
.wp-block-gallery.is-style-strip > .wp-block-image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}

/* ---------- YouTube facade ----------------------------------------------- */

.pb-yt { margin-inline: 0; margin-bottom: 0; }
.pb-yt .wp-block-embed__wrapper {
	position: relative;
	aspect-ratio: 16 / 9;
	background: #000;
	overflow: hidden;
}
.pb-yt .wp-block-embed__wrapper::before { display: none; }
.pb-yt__link {
	position: absolute;
	inset: 0;
	display: block;
	color: #fff;
	text-decoration: none;
}
.pb-yt__thumb {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: opacity 0.3s, transform 0.6s var(--pb-ease);
}
.pb-yt__play {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 4.25rem;
	height: 4.25rem;
	transform: translate(-50%, -50%);
	border: 1.5px solid #fff;
	background: rgb(0 0 0 / 0.45);
	transition: background-color 0.2s, border-color 0.2s;
}
.pb-yt__play::after {
	content: "";
	position: absolute;
	left: 54%;
	top: 50%;
	transform: translate(-50%, -50%);
	border-style: solid;
	border-width: 0.6rem 0 0.6rem 1rem;
	border-color: transparent transparent transparent #fff;
}
.pb-yt__label {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 2.5rem 1rem 0.8rem;
	font-size: var(--wp--preset--font-size--x-small);
	line-height: 1.35;
	background: linear-gradient(transparent, rgb(0 0 0 / 0.78));
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.pb-device .pb-yt__label { display: none; }
.pb-yt__link:hover .pb-yt__play,
.pb-yt__link:focus-visible .pb-yt__play {
	background: var(--pb-accent);
	border-color: var(--pb-accent);
}
.pb-yt__link:hover .pb-yt__play::after,
.pb-yt__link:focus-visible .pb-yt__play::after { border-left-color: var(--pb-accent-ink); }
.pb-yt__link:hover .pb-yt__thumb { transform: scale(1.02); }
.pb-yt iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Video pages: grid of facades (Group block with grid layout). */
.pb-video-grid { gap: clamp(1rem, 2vw, 1.75rem) !important; }
.pb-video-grid .pb-yt__label { font-size: var(--wp--preset--font-size--small); }

/* Featured video in a band (home documentary). */
.pb-band > .pb-feature-video { max-width: 72rem; margin-left: max(0px, (100% - var(--pb-col)) / 2); }
.pb-yt__thumb.is-broken { opacity: 0; }

/* Text bands over video/images: keep lines readable. */
.pb-hero--band .wp-block-cover__inner-container > * { max-width: 44rem; }
.pb-hero--band .wp-block-cover__inner-container > .wp-block-heading { max-width: none; }
.wp-block-cover.pb-hero--band { min-height: clamp(26rem, 72svh, 44rem); }
.wp-block-cover.pb-hero--band .wp-block-cover__background {
	background: linear-gradient(90deg,
		color-mix(in srgb, var(--pb-ink) 88%, transparent) 0%,
		color-mix(in srgb, var(--pb-ink) 62%, transparent) 45%,
		color-mix(in srgb, var(--pb-ink) 18%, transparent) 100%) !important;
}
.pb-hero--band .wp-block-cover__inner-container { padding-top: var(--wp--preset--spacing--70); }

/* ---------- How to glitch ------------------------------------------------- */

.pb-band.pb-guide > * { max-width: 46rem; }
.pb-band.pb-guide > .alignwide { max-width: min(var(--pb-wide), 72rem); }
.pb-guide p { font-size: var(--wp--preset--font-size--medium); }
.pb-note {
	border-left: 0;
	padding: 1rem 1.15rem;
	background: var(--pb-bg-2);
	font-size: var(--wp--preset--font-size--small) !important;
}

.pb-guide h2 { margin-top: var(--wp--preset--spacing--70); }
.pb-guide h3 {
	margin-top: var(--wp--preset--spacing--60);
	font-size: var(--wp--preset--font-size--large);
}
.pb-guide .wp-block-columns { gap: 0.75rem; }
.pb-guide .wp-block-image img { width: 100%; height: auto; }

/* Signal chain: a list drawn as boxes joined by patch cables. */
ul.is-style-signal-chain,
ol.is-style-signal-chain {
	list-style: none;
	padding: 0 !important;
	margin-block: 1rem 1.75rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.6rem;
	counter-reset: none;
}
.is-style-signal-chain li {
	position: relative;
	border: 1px solid var(--pb-line-strong);
	padding: 0.65rem 0.9rem;
	font-family: var(--pb-display);
	font-stretch: 105%;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.05em;
	text-transform: uppercase;
	line-height: 1.25;
	background: var(--pb-bg);
}
.is-style-signal-chain li + li::before {
	content: "";
	position: absolute;
	left: 1.25rem;
	top: -1.6rem;
	width: 1px;
	height: 1.6rem;
	background: var(--pb-accent);
}
.is-style-signal-chain li + li::after {
	content: "";
	position: absolute;
	left: calc(1.25rem - 4px);
	top: -7px;
	border: 4px solid transparent;
	border-top: 5px solid var(--pb-accent);
	border-bottom: 0;
}
@media (min-width: 48rem) {
	ul.is-style-signal-chain,
	ol.is-style-signal-chain {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: stretch;
		gap: 0.75rem 2.6rem;
	}
	.is-style-signal-chain li { display: flex; align-items: center; }
	.is-style-signal-chain li + li::before {
		left: -2.6rem;
		top: 50%;
		width: 2.6rem;
		height: 1px;
	}
	.is-style-signal-chain li + li::after {
		left: -7px;
		top: calc(50% - 4px);
		border: 4px solid transparent;
		border-left: 5px solid var(--pb-accent);
		border-right: 0;
	}
}

/* ---------- Music / Interaction (home) ----------------------------------- */

.pb-covers { gap: 0.75rem !important; }
.pb-covers .wp-block-image { margin: 0; }
.pb-covers figcaption {
	font-family: var(--pb-display);
	font-stretch: 105%;
	font-weight: 600;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--pb-fg-2);
	margin-top: 0.6rem;
	text-align: left;
}
.pb-covers .wp-block-image a:hover + figcaption,
.pb-covers .wp-block-image:hover figcaption { color: var(--pb-fg); }
.pb-covers img { aspect-ratio: 1; object-fit: cover; width: 100%; }

.pb-links {
	list-style: none;
	padding: 0 !important;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.pb-lead { font-size: var(--wp--preset--font-size--large); line-height: 1.45; }

/* ---------- Contact (Contact Form 7) ------------------------------------- */

.wpcf7 form { display: grid; gap: 1.75rem; }
.wpcf7 form > p { margin: 0; }
.wpcf7 label {
	display: block;
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--pb-fg-2);
}
.wpcf7 .wpcf7-form-control-wrap { display: block; margin-top: 0.5rem; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 textarea {
	width: 100%;
	box-sizing: border-box;
	background: var(--pb-bg-2);
	color: var(--pb-fg);
	border: 1px solid var(--pb-line-strong);
	border-radius: 0;
	padding: 0.85rem 0.95rem;
	font-family: var(--pb-body);
	font-size: var(--wp--preset--font-size--medium);
	text-transform: none;
	letter-spacing: 0;
	font-weight: 400;
	transition: border-color 0.2s, box-shadow 0.2s;
}
.wpcf7 textarea { min-height: 11rem; resize: vertical; }
.wpcf7 input:focus,
.wpcf7 textarea:focus {
	outline: none;
	border-color: var(--pb-accent);
	box-shadow: inset 0 0 0 1px var(--pb-accent);
}
.wpcf7 input[type="submit"] {
	justify-self: start;
	cursor: pointer;
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	background: var(--pb-fg);
	color: var(--pb-bg);
	border: 1px solid var(--pb-fg);
	border-radius: 0;
	padding: 1em 1.6em;
	transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}
.wpcf7 input[type="submit"]:hover,
.wpcf7 input[type="submit"]:focus-visible {
	background: var(--pb-accent);
	border-color: var(--pb-accent);
	color: var(--pb-accent-ink);
}
.wpcf7 input[type="submit"]:disabled,
.wpcf7 input[type="submit"]:disabled:hover {
	/* off until the consent box is ticked */
	opacity: 0.45;
	cursor: not-allowed;
	background: var(--pb-fg);
	border-color: var(--pb-fg);
	color: var(--pb-bg);
}
.wpcf7 .wpcf7-spinner { background-color: var(--pb-fg-2); }
/* Consent checkbox: a sentence, not a field label. */
.wpcf7 .wpcf7-list-item { margin: 0; }
.wpcf7 .wpcf7-list-item label {
	display: flex;
	gap: 0.7rem;
	align-items: flex-start;
	cursor: pointer;
	font-family: var(--pb-body);
	font-stretch: 100%;
	font-weight: 400;
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0;
	text-transform: none;
	line-height: 1.45;
	color: var(--pb-fg-2);
}
.wpcf7 input[type="checkbox"] {
	flex: none;
	width: 1.15rem;
	height: 1.15rem;
	margin: 0.1rem 0 0;
	accent-color: var(--pb-accent);
	cursor: pointer;
}
/* Field errors float under the field: when one clears, nothing below it moves
   (otherwise the Send button jumps and the click that blurred the field is lost). */
.wpcf7 .wpcf7-form-control-wrap { position: relative; }
.wpcf7-not-valid-tip {
	position: absolute;
	left: 0;
	top: 100%;
	line-height: 1.2;
	color: #ff9a8a;
	font-size: var(--wp--preset--font-size--x-small);
	margin-top: 0.3rem;
	text-transform: none;
	letter-spacing: 0;
	font-family: var(--pb-body);
}
.wpcf7 form .wpcf7-response-output {
	margin: 0.5rem 0 0 !important;
	padding: 0.85rem 1rem !important;
	border: 1px solid var(--pb-line-strong) !important;
	font-size: var(--wp--preset--font-size--small);
}
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--pb-accent) !important; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { border-color: #ff9a8a !important; }

.pb-contact { gap: var(--wp--preset--spacing--60) clamp(2rem, 5vw, 6rem) !important; }
.pb-contact-aside > * { margin: 0; }
.pb-contact-aside > * + * { margin-top: 0.5rem; }
.pb-contact-aside .pb-label + p { margin-top: 0.35rem; }
.pb-contact-aside .pb-label:not(:first-child) { margin-top: 1.75rem; }
.pb-contact-aside a { font-size: var(--wp--preset--font-size--large); }

/* ---------- Footer ------------------------------------------------------- */

.pb-footer {
	border-top: 1px solid var(--pb-line);
	margin-top: 0;
	font-size: var(--wp--preset--font-size--small);
}
.pb-footer__inner {
	box-sizing: border-box;
	max-width: var(--pb-wide);
	margin-inline: auto;
	padding: var(--wp--preset--spacing--70) var(--pb-gutter) 1.5rem;
}
.pb-footer__grid {
	display: grid;
	gap: 2.5rem;
	grid-template-columns: 1fr;
}
@media (min-width: 48rem) {
	.pb-footer__grid { grid-template-columns: 1.1fr 1.4fr 1fr; gap: 3rem; }
}
.pb-footer__brand > * + * { margin-top: 1rem; }
.pb-footer .pb-logo img.custom-logo { height: 3.4rem !important; }
.pb-footer__tagline {
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--pb-fg-2);
}
.pb-footer__nav .wp-block-navigation__container {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, max-content));
	grid-auto-flow: row dense;
	column-gap: clamp(1.5rem, 3vw, 3rem) !important;
	row-gap: 0 !important;
	align-items: start !important;
}
.pb-footer__nav .wp-block-navigation__container > .wp-block-navigation-item:not(.has-child) { grid-column: 1; }
.pb-footer__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child { grid-row: 1 / span 12; grid-column: 2; }
.pb-footer__nav .wp-block-navigation__container > .has-child ~ .has-child { grid-column: 3; }
.pb-footer__nav .wp-block-navigation__container > .has-child ~ .has-child ~ .has-child { grid-column: 4; }
@media (max-width: 30rem) {
	/* phone: two balanced columns in menu order, each group kept whole */
	.pb-footer__nav .wp-block-navigation__container {
		display: block !important;
		columns: 2;
		column-gap: 1.5rem;
	}
	.pb-footer__nav .wp-block-navigation__container > .wp-block-navigation-item { break-inside: avoid; }
}
.pb-footer__nav .wp-block-navigation-item { flex-direction: column; align-items: flex-start !important; }
.pb-footer__nav .wp-block-navigation-item__content { padding: 0.25rem 0; text-decoration: none; }
.pb-footer__nav .wp-block-navigation-item__content:hover { color: var(--pb-accent); }
.pb-footer__nav .wp-block-navigation__submenu-container {
	position: static !important;
	opacity: 1 !important;
	visibility: visible !important;
	height: auto !important;
	width: auto !important;
	min-width: 0 !important;
	border: 0 !important;
	background: transparent !important;
	padding: 0.15rem 0 0.6rem !important;
}
.pb-footer__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-family: var(--pb-body);
	text-transform: none;
	letter-spacing: 0;
	font-weight: 400;
	font-stretch: 100%;
	color: var(--pb-fg-2);
	padding: 0.15rem 0;
}
.pb-footer__nav .wp-block-navigation__submenu-icon { display: none; }
.pb-footer__contact > * { margin: 0; }
.pb-footer__contact > * + * { margin-top: 0.4rem; }
.pb-footer__contact .pb-label:not(:first-child) { margin-top: 1.5rem; }
.pb-footer__links { list-style: none; padding: 0 !important; display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; }
.pb-footer__bottom {
	margin-top: var(--wp--preset--spacing--60);
	padding-top: 1.25rem;
	border-top: 1px solid var(--pb-line);
	color: var(--pb-fg-3);
	font-size: var(--wp--preset--font-size--x-small);
}
.pb-footer__bottom p { margin: 0; }
.pb-footer__bottom a { color: inherit; }

/* ---------- Lightbox (core image "expand on click") ---------------------- */

.wp-lightbox-overlay .scrim { background-color: var(--pb-bg) !important; }
.wp-lightbox-overlay .close-button,
.wp-lightbox-overlay button { color: var(--pb-fg) !important; }

/* ---------- Motion safety ------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---------- Editor tweaks (this file is also loaded as editor style) ------ */

.editor-styles-wrapper .pb-header,
.editor-styles-wrapper .pb-index { position: static; }
.editor-styles-wrapper .wp-block-cover.pb-hero--home { min-height: 70vh; }
.editor-styles-wrapper .wp-block-button[class*="is-style-status-"] .wp-block-button__link { pointer-events: auto; }
.editor-styles-wrapper .pb-device {
	display: grid !important;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	column-gap: 2rem;
	align-items: start;
}
.editor-styles-wrapper .pb-device__info {
	display: flex !important;
	flex-direction: column;
	gap: 1rem;
	position: static !important;
}
.editor-styles-wrapper .pb-device__info > *,
.editor-styles-wrapper .pb-device__media { order: 0 !important; }
.editor-styles-wrapper .pb-hero--home h1,
.editor-styles-wrapper .pb-claim,
.editor-styles-wrapper .pb-hero--home .wp-block-buttons { animation: none !important; }
.editor-styles-wrapper .pb-yt__label { display: none; }


/* ---------- PB devices, PB-PI, Software ----------------------------------- */

/* Product hero: a claim above a very big name. */
.wp-block-cover.pb-hero--product { min-height: clamp(32rem, 86svh, 54rem); }
.wp-block-cover.pb-hero--product h1 {
	/* the vw cap keeps a long word like SOFTWARE on one line on a phone */
	font-size: min(var(--wp--preset--font-size--display), 10.2vw);
	font-stretch: 150%;
	font-weight: 800;
	line-height: 0.86;
	letter-spacing: -0.01em;
	max-width: none;
}
.pb-hero--product .pb-claim { text-shadow: 0 1px 2px rgb(14 14 12 / 0.55), 0 0 1.2rem rgb(14 14 12 / 0.45); }
.pb-hero--product .pb-lead { max-width: 40rem; margin-top: var(--wp--preset--spacing--40) !important; }
.pb-hero--product .wp-block-buttons { margin-top: var(--wp--preset--spacing--40); }
.pb-hero--band .pb-label { color: var(--pb-accent); margin: 0 0 0.6rem !important; }

/* A row of big numbers. */
.pb-band--numbers { padding-block: var(--wp--preset--spacing--50); }
ul.pb-numbers {
	list-style: none;
	padding: 0 !important;
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem clamp(1rem, 2.5vw, 2rem);
}
.pb-numbers li {
	/* each figure keeps its own width: a long one wraps instead of spilling out */
	flex: 1 1 8rem;
	min-width: max-content;
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--pb-line-strong);
	font-family: var(--pb-display);
	font-stretch: 72%;
	font-weight: 650;
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--pb-fg-2);
}
.pb-numbers li strong {
	font-stretch: 125%;
	font-weight: 800;
	font-size: clamp(2.1rem, 1.3rem + 2.4vw, 3.5rem);
	line-height: 0.95;
	letter-spacing: -0.01em;
	color: var(--pb-fg);
}

/* Text beside a picture or an aside. */
.pb-split { gap: var(--wp--preset--spacing--60) clamp(2rem, 5vw, 6rem) !important; }
.pb-band > .pb-split { max-width: var(--pb-col); }
.pb-split > .wp-block-column > * { margin-block: 0; }
.pb-split > .wp-block-column > * + * { margin-block-start: 1rem; }
.pb-split .wp-block-image img { width: 100%; height: auto; }

/* Spec lists with words in the first column. */
.is-style-specs.pb-offer { font-size: var(--wp--preset--font-size--medium); }
.is-style-specs.pb-offer li > strong:first-child { flex-basis: 6.4rem; }
.is-style-specs.pb-specs { max-width: 52rem; }
.is-style-specs.pb-specs li > strong:first-child,
.is-style-specs.pb-needs li > strong:first-child {
	flex-basis: 7.5rem;
	font-stretch: 100%;
	font-size: 0.78em;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--pb-fg-2);
}
.is-style-specs.pb-needs li { padding-left: 0; }

/* Reasons, numbered 01, 02, … */
ol.pb-reasons {
	list-style: none;
	counter-reset: pb-r;
	padding: 0 !important;
	max-width: 52rem;
	border-top: 1px solid var(--pb-line);
}
.pb-reasons li {
	counter-increment: pb-r;
	display: grid;
	grid-template-columns: 2.8rem minmax(0, 1fr);
	gap: 0.75rem;
	padding: 0.85rem 0;
	border-bottom: 1px solid var(--pb-line);
}
.pb-reasons li::before {
	content: counter(pb-r, decimal-leading-zero);
	font-family: var(--pb-display);
	font-stretch: 112%;
	font-weight: 700;
	color: var(--pb-accent);
}

/* What it does: a grid of cards. */
.pb-features {
	display: grid;
	/* nine cards: three by three on a wide screen */
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
	gap: var(--wp--preset--spacing--60) clamp(1.5rem, 3vw, 2.5rem);
}
.pb-features > .pb-feature { margin: 0; }
.pb-feature > * { margin: 0; }
.pb-feature > * + * { margin-top: 0.55rem; }
.pb-feature .wp-block-image { aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.pb-feature .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }
.pb-feature .wp-block-image.pb-top img { object-position: 50% 0; } /* menu screens: keep the title */
.pb-feature h3 { margin-top: 1rem; font-size: var(--wp--preset--font-size--large); }
.pb-feature p { color: var(--pb-fg-2); font-size: var(--wp--preset--font-size--small); }

/* A tight grid of pictures. */
.wp-block-gallery.pb-grid { gap: 0.4rem; }
.wp-block-gallery.pb-grid .wp-block-image img { aspect-ratio: 16 / 9; object-fit: cover; }

/* Menu screens: whole, with an edge so the dark UI stays apart from the page. */
.wp-block-gallery.pb-panels { gap: 0.6rem; margin-top: var(--wp--preset--spacing--50); }
.wp-block-gallery.pb-panels .wp-block-image img { aspect-ratio: 584 / 720; object-fit: cover; outline: 1px solid var(--pb-line); outline-offset: -1px; }

/* Questions and answers. */
/* narrower blocks keep the column's left edge instead of centring */
.pb-band > ol.pb-reasons,
.pb-band > .is-style-specs.pb-specs,
.pb-band:not(.pb-guide) > .pb-note, /* the How to glitch guide keeps its own column */
.pb-faq > *,
.pb-band--intro > * {
	max-width: min(52rem, var(--pb-col));
	margin-left: max(0px, (100% - var(--pb-col)) / 2);
	margin-right: auto;
}
.pb-band--intro > * { max-width: min(46rem, var(--pb-col)); }
.pb-faq .wp-block-details { margin: 0; padding: 0; border-top: 1px solid var(--pb-line); }
.pb-faq .wp-block-details:last-child { border-bottom: 1px solid var(--pb-line); }
.pb-faq .wp-block-heading + .wp-block-details { margin-block-start: var(--wp--preset--spacing--40); }
.pb-faq .wp-block-details + .wp-block-details { margin-block-start: 0; }
.pb-faq summary {
	position: relative;
	cursor: pointer;
	list-style: none;
	padding: 0.95rem 2.25rem 0.95rem 0;
	font-family: var(--pb-display);
	font-stretch: 105%;
	font-weight: 700;
}
.pb-faq summary::-webkit-details-marker { display: none; }
.pb-faq summary::after {
	content: "+";
	position: absolute;
	right: 0.35rem;
	top: 0.85rem;
	color: var(--pb-accent);
	font-weight: 700;
}
.pb-faq details[open] > summary::after { content: "\2212"; }
.pb-faq details > p { margin: 0 0 1.1rem; max-width: 46rem; color: var(--pb-fg-2); }

.pb-band--fineprint { padding-block: var(--wp--preset--spacing--40); }
.pb-band--intro { padding-bottom: 0; }
.pb-band--intro + .pb-catalog .pb-device:first-child { border-top: 0; }

/* Homebrew: text entries with a "how to run it" panel. */
.pb-device--text .pb-device__info {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	position: static;
}
.pb-device--text .pb-device__info > * { order: 0 !important; }
.pb-device__run {
	display: flex;
	flex-direction: column;
	gap: 0.8rem;
	padding: 1.25rem 1.35rem;
	background: var(--pb-bg-2);
	margin: 0 !important;
}
.pb-device__run > * { margin: 0 !important; }
.pb-device__run .wp-block-buttons { margin-top: 0.4rem !important; }
ol.pb-steps { display: grid; gap: 0.5rem; padding-left: 1.2rem; font-size: var(--wp--preset--font-size--small); }
.pb-device code {
	font-size: 0.88em;
	padding: 0.05em 0.3em;
	background: color-mix(in srgb, var(--pb-fg) 9%, transparent);
	overflow-wrap: anywhere;
}
@media (min-width: 60rem) {
	.pb-device--text .pb-device__info { grid-column: 1; grid-row: 1; }
	.pb-device__run { grid-column: 2; grid-row: 1; }
}