/* PINAX base, Kafeneio system: reset, type, links, focus, buttons, forms, tables, layout, components (eyebrow, plate, ticket, notice), prose.
   Owner: foundation agent. Tokens only (00-tokens.css). Element rules use :where() so feature sheets override them without a fight.
   Flat colour only: no gradients, no shadows. */

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
:where(html) { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: var(--px-space-5); }
:where(body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ol, ul) { margin: 0; }
:where(ul, ol)[role="list"] { list-style: none; padding: 0; }
:where(img, picture, video, canvas, svg) { display: block; max-width: 100%; }
:where(img) { height: auto; }
:where(input, button, textarea, select) { font: inherit; color: inherit; letter-spacing: inherit; }
:where(button) { cursor: pointer; }
:where(textarea) { resize: vertical; }
:where(p, li, h1, h2, h3, h4, h5, h6, dd, td) { overflow-wrap: break-word; }
:where(h1, h2, h3, h4) { text-wrap: balance; }
:where(p) { text-wrap: pretty; }
[hidden] { display: none !important; }

/* ---------- Page ---------- */
html { background: var(--px-paper); }
body {
	min-height: 100vh;
	background: var(--px-paper);
	color: var(--px-ink);
	font-family: var(--px-font-text);
	font-size: var(--px-text-base);
	font-weight: 400;
	line-height: 1.5;
	font-kerning: normal;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: clip;
}
::selection { background: var(--px-green); color: var(--px-paper); }

/* ---------- Type ---------- */
/* Headings are shop signs: condensed, heavy, uppercase. Product names in h1 may opt out with .px-case-normal. */
:where(h1, h2, .px-h1, .px-h2, .px-display) {
	font-family: var(--px-font-display);
	font-weight: 800;
	font-synthesis: none;
	line-height: 0.9;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	color: inherit;
}
:where(h1, .px-h1) { font-size: var(--px-h1); }
:where(h2, .px-h2) { font-size: var(--px-h2); }
:where(.px-h3) {
	font-family: var(--px-font-display);
	font-weight: 800;
	font-size: var(--px-h3);
	line-height: 0.95;
	text-transform: uppercase;
}
:where(h3) { font-size: 1.125rem; font-weight: 700; line-height: 1.25; }
:where(h4, .px-h4) { font-size: var(--px-text-base); font-weight: 700; line-height: 1.3; }
:where(h5, h6) { font-size: var(--px-text-base); font-weight: 700; line-height: 1.4; }
.px-case-normal { text-transform: none; }

/* .px-display: any sign-writer line (condensed uppercase). */
.px-display { font-family: var(--px-font-display); font-weight: 800; text-transform: uppercase; line-height: 0.9; }
.px-display--900 { font-weight: 900; }

/* Huge Greek wordmark ΠΙΝΑΞ (mark it lang="el"; aria-hidden when decorative) */
.px-wordmark {
	display: block;
	font-family: var(--px-font-display);
	font-weight: 900;
	font-size: var(--px-wordmark);
	line-height: 0.78;
	letter-spacing: 0.02em;
	margin-left: -0.04em; /* optical: Π side bearing */
}

.px-caps { text-transform: uppercase; letter-spacing: 0.12em; }
:where(strong, b) { font-weight: 700; }
:where(small) { font-size: var(--px-text-sm); }
:where(code, kbd, samp, pre) { font-family: var(--px-font-text); font-variant-numeric: tabular-nums; font-size: 0.95em; }
:where(pre) { overflow-x: auto; padding: var(--px-space-3); background: var(--px-pale); }
:where(hr) { border: 0; border-top: var(--px-rule); margin: var(--px-space-5) 0; }
:where(abbr[title]) { text-decoration: underline dotted; text-underline-offset: 0.2em; }

/* Data voice: ISO codes, prices, coordinates. Same text face, tabular numbers. */
.px-mono,
.px-data,
.px-num {
	font-variant-numeric: tabular-nums lining-nums;
	letter-spacing: 0.01em;
}
.px-mono, .px-data { font-weight: 600; }

/* Eyebrow: red uppercase sign above a heading. Greek eyebrows get lang="el" and no accents (typographic convention). */
.px-eyebrow {
	display: block;
	margin-bottom: 0.625rem;
	color: var(--px-red);
	font-family: var(--px-font-display);
	font-weight: 800;
	font-size: var(--px-h4);
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.px-eyebrow a { color: inherit; text-decoration: none; }
.px-eyebrow a:hover { text-decoration: underline; text-decoration-thickness: 2px; }

/* Label: small caps line in text face (column heads, record labels, statuses) */
.px-label {
	font-family: var(--px-font-text);
	font-weight: 700;
	font-size: var(--px-text-sm);
	line-height: 1.2;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--px-grey);
}

.px-lede { max-width: 36ch; font-size: var(--px-text-lg); line-height: 1.5; color: var(--px-grey); }
.px-muted { color: var(--px-grey); font-size: var(--px-text-sm); }

/* ---------- Links ---------- */
:where(a) {
	color: inherit;
	text-decoration-line: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: color var(--px-dur) var(--px-ease);
}
:where(a:hover) { color: var(--px-red); text-decoration-thickness: 2px; }
/* A plain link in running text on paper: green, bold like the mockup register link */
.px-link { color: var(--px-green); font-weight: 700; text-decoration-thickness: 2px; }
.px-link:hover { color: var(--px-red); }
/* Arrow row link: text left, red arrow right */
.px-arrow { display: flex; justify-content: space-between; gap: var(--px-space-3); padding-block: 0.875rem; font-weight: 600; text-decoration: none; }
.px-arrow::after { content: "\2192"; color: var(--px-red); }
.px-arrow:hover { color: var(--px-red); }

/* ---------- Focus ---------- */
:focus { outline: none; }
:focus-visible { outline: 3px solid var(--px-red); outline-offset: 3px; }
.px-on-dark :focus-visible,
.px-field--green :focus-visible,
.px-field--violet :focus-visible,
.px-field--ink :focus-visible { outline-color: var(--px-mustard); }
.px-field--red :focus-visible { outline-color: var(--px-paper); }
.px-field--mustard :focus-visible,
.px-field--honey :focus-visible,
.px-field--pale :focus-visible,
.px-field--pistachio :focus-visible { outline-color: var(--px-ink); }
[tabindex="-1"]:focus { outline: none; }

/* ---------- Skip link and screen reader text ---------- */
.px-skip {
	position: absolute;
	left: var(--px-space-3);
	top: var(--px-space-3);
	z-index: 1000;
	padding: var(--px-space-2) var(--px-space-3);
	background: var(--px-ink);
	color: var(--px-paper);
	font-weight: 700;
	text-decoration: none;
	transform: translateY(-200%);
}
.px-skip:focus,
.px-skip:focus-visible { transform: none; color: var(--px-paper); }

.screen-reader-text,
.px-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}
.screen-reader-text:focus {
	position: static !important;
	width: auto;
	height: auto;
	margin: 0;
	clip: auto;
	clip-path: none;
	white-space: normal;
}

/* ---------- Layout ---------- */
.px-wrap {
	width: 100%;
	max-width: calc(var(--px-wrap) + var(--px-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--px-gutter);
}
.px-wrap--narrow { max-width: calc(46rem + var(--px-gutter) * 2); }
.px-section { padding-block: var(--px-section); }
.px-section--tight { padding-block: var(--px-space-6); }
.px-section--loose { padding-block: calc(var(--px-section) * 1.25); }
.px-section--flush-top { padding-top: 0; }
.px-section__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: var(--px-space-4); }
.px-section__head > a { font-weight: 700; }
.px-section__body { margin-top: var(--px-space-5); }
.px-stack > * + * { margin-top: var(--px-flow, var(--px-space-3)); }
.px-cluster { display: flex; flex-wrap: wrap; gap: var(--px-space-3); align-items: center; }
.px-grid { display: grid; gap: var(--px-space-6) var(--px-space-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.px-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: var(--px-space-6); }
.px-grid[hidden], .px-cluster[hidden] { display: none; }
.px-rule { border-top: var(--px-rule); }
.px-rule-heavy { border-top: var(--px-rule-heavy); padding-top: var(--px-space-6); }
.px-rule-bottom { border-bottom: var(--px-rule); }

/* ---------- Colour fields (full-bleed sections; safe pairs only) ---------- */
.px-field--paper,
.px-field--resin { background: var(--px-paper); color: var(--px-ink); }
.px-field--green,
.px-field--violet { background: var(--px-green); color: var(--px-paper); }
.px-field--red { background: var(--px-red); color: var(--px-paper); }
.px-field--mustard,
.px-field--honey { background: var(--px-mustard); color: var(--px-ink); }
.px-field--pale,
.px-field--pistachio { background: var(--px-pale); color: var(--px-ink); }
.px-field--ink { background: var(--px-ink); color: var(--px-paper); }

/* Eyebrows and signs on coloured fields: red never sits on green, ink or red */
:where(.px-field--green, .px-field--violet, .px-field--ink, .px-on-dark) .px-eyebrow { color: var(--px-mustard); }
:where(.px-field--red, .px-field--mustard, .px-field--honey) .px-eyebrow { color: inherit; }
:where(.px-field--green, .px-field--violet, .px-field--red, .px-field--ink, .px-on-dark) :where(.px-label, .px-lede, .px-muted) { color: inherit; }
:where(.px-field--green, .px-field--violet, .px-field--red, .px-field--ink, .px-on-dark) :where(a:hover) { color: inherit; text-decoration-thickness: 3px; }
:where(.px-field--green, .px-field--violet, .px-field--ink) .px-link { color: var(--px-paper); }
:where(.px-field--pale, .px-field--pistachio) .px-lede { color: var(--px-ink); }

/* ---------- Buttons ---------- */
/* Default: mustard enamel with ink letters ("OPEN THE MAP") */
.px-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--px-space-2);
	min-height: 3.25rem;
	padding: 0.95rem 1.625rem 0.8rem;
	border: 2px solid var(--px-mustard);
	border-radius: var(--px-radius);
	background: var(--px-mustard);
	color: var(--px-ink);
	font-family: var(--px-font-display);
	font-size: 1.375rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	text-align: center;
	cursor: pointer;
	transition: background-color var(--px-dur) var(--px-ease), color var(--px-dur) var(--px-ease), border-color var(--px-dur) var(--px-ease);
}
.px-btn:hover { background: var(--px-ink); border-color: var(--px-ink); color: var(--px-mustard); text-decoration: none; }
:where(.px-field--ink, .px-on-dark) .px-btn:hover { background: var(--px-paper); border-color: var(--px-paper); color: var(--px-ink); }

/* Red: the buy action (Add to cart) */
.px-btn--red { background: var(--px-red); border-color: var(--px-red); color: var(--px-paper); }
.px-btn--red:hover { background: var(--px-ink); border-color: var(--px-ink); color: var(--px-paper); }

/* Ink: secondary solid, works on paper, mustard and pale */
.px-btn--ink { background: var(--px-ink); border-color: var(--px-ink); color: var(--px-paper); }
.px-btn--ink:hover { background: var(--px-green); border-color: var(--px-green); color: var(--px-paper); }

/* Green: proof action (Check it on the register). Legacy name .px-btn--proof */
.px-btn--green,
.px-btn--proof { background: var(--px-green); border-color: var(--px-green); color: var(--px-paper); }
.px-btn--green:hover,
.px-btn--proof:hover { background: var(--px-ink); border-color: var(--px-ink); color: var(--px-paper); }

/* Paper: solid on green, red or ink fields. Legacy name .px-btn--resin */
.px-btn--paper,
.px-btn--resin { background: var(--px-paper); border-color: var(--px-paper); color: var(--px-ink); }
.px-btn--paper:hover,
.px-btn--resin:hover { background: var(--px-mustard); border-color: var(--px-mustard); color: var(--px-ink); }

/* Ghost: outline in the current text colour */
.px-btn--ghost { background: transparent; border-color: currentColor; color: inherit; }
.px-btn--ghost:hover { background: var(--px-ink); border-color: var(--px-ink); color: var(--px-paper); }
:where(.px-field--green, .px-field--violet, .px-field--red, .px-field--ink, .px-on-dark) .px-btn--ghost:hover { background: var(--px-paper); border-color: var(--px-paper); color: var(--px-ink); }

.px-btn--small { min-height: 2.5rem; padding: 0.6rem 0.9rem 0.45rem; font-size: 1.125rem; }
.px-btn--block { width: 100%; }
.px-btn[disabled],
.px-btn[aria-disabled="true"] { cursor: not-allowed; background: transparent; border-color: var(--px-grey); color: var(--px-grey); }

/* ---------- Forms ---------- */
:where(label) { display: inline-block; font-weight: 600; font-size: 0.9375rem; line-height: 1.4; }
:where(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="reset"], [type="range"], [type="color"], [type="file"], [type="image"], [type="hidden"]), select, textarea) {
	width: 100%;
	min-height: 3rem;
	padding: 0.7rem 0.85rem 0.6rem;
	border: 1px solid var(--px-grey);
	border-bottom: 2px solid var(--px-ink);
	border-radius: 0;
	background-color: var(--px-paper);
	color: var(--px-ink);
	font-size: var(--px-text-base);
	line-height: 1.4;
	transition: border-color var(--px-dur) var(--px-ease);
}
:where(input, select, textarea):hover { border-color: var(--px-ink); }
:where(input, select, textarea):focus-visible { outline: 3px solid var(--px-red); outline-offset: 2px; border-color: var(--px-ink); }
:where(input, textarea)::placeholder { color: var(--px-grey); opacity: 1; }
:where(select) {
	appearance: none;
	padding-right: 2.5rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231B1A17' stroke-width='2'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.85rem center;
	background-size: 0.75rem;
}
:where(input[type="checkbox"], input[type="radio"]) { width: 1.15rem; height: 1.15rem; accent-color: var(--px-green); vertical-align: -0.15em; }
:where(fieldset) { border: 0; border-top: var(--px-rule); padding: var(--px-space-3) 0 0; margin: 0; min-width: 0; }
:where(legend) { padding-right: var(--px-space-2); font-weight: 700; }
:where(input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"]) { border-color: var(--px-red); border-bottom-color: var(--px-red); }
.px-field-hint { display: block; margin-top: var(--px-space-1); color: var(--px-grey); font-size: var(--px-text-sm); }
.px-form-row { display: grid; gap: var(--px-space-2); margin-bottom: var(--px-space-3); }
.px-form-inline { display: flex; flex-wrap: wrap; gap: var(--px-space-2); align-items: stretch; }
.px-form-inline > :where(input, select) { flex: 1 1 14rem; width: auto; }

/* ---------- Tables ---------- */
.px-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.px-table,
.px-prose table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1rem;
	font-variant-numeric: tabular-nums;
}
.px-table caption,
.px-prose table caption { text-align: left; padding-bottom: var(--px-space-2); font-weight: 700; font-size: var(--px-text-sm); letter-spacing: 0.12em; text-transform: uppercase; color: var(--px-grey); }
.px-table :where(th, td),
.px-prose table :where(th, td) {
	padding: 0.75rem 1rem 0.75rem 0;
	border-top: var(--px-hairline);
	text-align: left;
	vertical-align: top;
}
.px-table thead th,
.px-prose table thead th {
	padding-top: 0;
	border-top: 0;
	border-bottom: var(--px-rule);
	color: var(--px-grey);
	font-weight: 700;
	font-size: var(--px-text-sm);
	letter-spacing: 0.12em;
	text-transform: uppercase;
}
.px-table thead + tbody tr:first-child :where(th, td),
.px-prose table thead + tbody tr:first-child :where(th, td) { border-top: 0; }
.px-table tbody th { font-weight: 700; }
.px-table .px-num { white-space: nowrap; }

/* ---------- Components ---------- */

/* Enamel plate: red fill, paper letters, thin inset paper rule, two rivets */
.px-plate {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.55em;
	padding: 0.42em 0.75em 0.3em;
	border-radius: var(--px-radius-plate);
	background: var(--px-red);
	color: var(--px-paper);
	font-family: var(--px-font-display);
	font-weight: 900;
	font-size: 2rem;
	line-height: 1;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	white-space: nowrap;
}
.px-plate::before {
	content: "";
	position: absolute;
	inset: 4px;
	border: 2px solid var(--px-paper);
	border-radius: 3px;
	pointer-events: none;
}
.px-plate__dot {
	flex: none;
	width: 0.16em;
	height: 0.16em;
	min-width: 5px;
	min-height: 5px;
	border-radius: 50%;
	background: currentColor;
	margin-top: -0.1em;
}
.px-plate__word { margin-right: -0.12em; } /* optical: trailing tracking */
.px-plate--green { background: var(--px-green); }
.px-plate--mustard { background: var(--px-mustard); color: var(--px-ink); }
.px-plate--mustard::before { border-color: var(--px-ink); }

/* Code chip: GR-C on green */
.px-code {
	display: inline-block;
	padding: 0.3em 0.45em 0.2em;
	background: var(--px-green);
	color: var(--px-paper);
	font-family: var(--px-font-display);
	font-weight: 800;
	font-size: 1.25rem;
	line-height: 1;
	letter-spacing: 0.04em;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.px-code--plain { padding: 0; background: none; color: var(--px-grey); font-family: var(--px-font-text); font-weight: 700; font-size: var(--px-text-sm); letter-spacing: 0.02em; }

/* Price ticket: small paper ticket, red top edge, Greek name and a red price. Sits over a photo corner. */
.px-ticket {
	position: relative;
	display: inline-block;
	align-self: flex-start;
	padding: 0.5rem 0.875rem;
	border-top: 4px solid var(--px-red);
	background: var(--px-paper);
	color: var(--px-ink);
	transform: rotate(-2deg);
}
.px-ticket__name,
.px-ticket > span {
	display: block;
	font-family: var(--px-font-text);
	font-weight: 600;
	font-size: var(--px-text-sm);
	line-height: 1.1;
}
.px-ticket__price,
.px-ticket > b {
	display: block;
	color: var(--px-red);
	font-family: var(--px-font-display);
	font-weight: 800;
	font-size: 2.25rem;
	line-height: 0.95;
	letter-spacing: 0.01em;
	font-variant-numeric: lining-nums;
	white-space: nowrap;
}
.px-ticket__price :where(del) { color: var(--px-grey); font-size: 0.6em; margin-right: 0.2em; }
.px-ticket__price :where(ins) { text-decoration: none; }
.px-ticket--over { margin: -2.125rem 0 0 0.75rem; } /* overlap the bottom-left of the image above it */
.px-ticket--big { padding: 0.625rem 1.125rem 0.5rem; border-top: 0; background: var(--px-mustard); }
.px-ticket--big .px-ticket__price,
.px-ticket--big > b { color: var(--px-ink); font-size: 3.5rem; }
.px-ticket--wait .px-ticket__price,
.px-ticket--wait > b { color: var(--px-green); font-size: 1.5rem; letter-spacing: 0.04em; text-transform: uppercase; }
@media (max-width: 32.5rem) {
	.px-ticket { padding: 0.375rem 0.625rem; }
	.px-ticket__name, .px-ticket > span { font-size: 0.75rem; }
	.px-ticket__price, .px-ticket > b { font-size: 1.75rem; }
	.px-ticket--over { margin: -1.75rem 0 0 0.5rem; }
	.px-ticket--big .px-ticket__price, .px-ticket--big > b { font-size: 2.75rem; }
}

/* Status line on cards and records */
.px-status { font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--px-grey); }
.px-status--ok { color: var(--px-green); }

/* Origin one-liner on cards: place, GR code, protection */
.px-origin { color: var(--px-grey); font-size: 0.9375rem; line-height: 1.4; }

/* Record list: label column + value, hairlines between rows */
.px-record { margin: 0; }
.px-record > div { display: grid; grid-template-columns: 7.5rem 1fr; gap: var(--px-space-3); padding-block: 0.75rem; border-top: var(--px-hairline); }
.px-record dt { padding-top: 0.15em; color: var(--px-grey); font-weight: 700; font-size: var(--px-text-sm); letter-spacing: 0.06em; text-transform: uppercase; }
.px-record dd { margin: 0; }
.px-record dd a { color: var(--px-green); font-weight: 700; text-decoration-thickness: 2px; }
.px-record dd a:hover { color: var(--px-red); }
@media (max-width: 32.5rem) {
	.px-record > div { grid-template-columns: 1fr; gap: 0.125rem; }
}

/* Notice: one flat block, no box-in-box. Default pale; --warn mustard; --closed ink bar */
.px-notice { padding: var(--px-space-3) var(--px-space-4); background: var(--px-pale); color: var(--px-ink); }
.px-notice > * + * { margin-top: var(--px-space-2); }
.px-notice__title { font-family: var(--px-font-display); font-weight: 800; font-size: var(--px-h4); line-height: 1; text-transform: uppercase; letter-spacing: 0.02em; }
.px-notice--warn { background: var(--px-mustard); }
.px-notice--ink { background: var(--px-ink); color: var(--px-paper); }
.px-notice--ink :focus-visible { outline-color: var(--px-mustard); }
.px-notice :where(a) { font-weight: 700; }

/* ---------- Prose ---------- */
.px-prose { max-width: 42rem; font-size: var(--px-text-base); line-height: 1.6; }
.px-prose > * + * { margin-top: 1.1em; }
.px-prose p + p { margin-top: 1em; }
.px-prose > :where(h2) { margin-top: 1.8em; font-size: clamp(2.25rem, 1.8rem + 1.8vw, 3.25rem); }
.px-prose > :where(h3) { margin-top: 1.8em; font-family: var(--px-font-display); font-weight: 800; font-size: clamp(1.625rem, 1.4rem + 0.8vw, 2rem); line-height: 1; text-transform: uppercase; }
.px-prose > :where(h4) { margin-top: 1.5em; font-size: var(--px-text-lg); }
.px-prose > :where(h2, h3, h4) + * { margin-top: 0.6em; }
.px-prose > :first-child { margin-top: 0; }
.px-prose :where(a) { color: var(--px-green); font-weight: 600; text-decoration-thickness: 1px; }
.px-prose :where(a:hover) { color: var(--px-red); text-decoration-thickness: 2px; }
.px-prose :where(ul, ol) { padding-left: 1.3em; }
.px-prose :where(li + li) { margin-top: 0.4em; }
.px-prose :where(ol > li)::marker { color: var(--px-red); }
/* One bullet for the whole site: a small red square. Plain prose lists, the never list and shipping restrictions share it. */
.px-prose :where(ul:not([class]), ul.wp-block-list, ul.px-never),
.px-ship__notes ul { padding-left: 0; list-style: none; }
.px-prose :where(ul:not([class]), ul.wp-block-list, ul.px-never) > li,
.px-ship__notes li { position: relative; padding-left: 1.1rem; }
.px-prose :where(ul:not([class]), ul.wp-block-list, ul.px-never) > li::before,
.px-ship__notes li::before { content: ""; position: absolute; left: 0; top: 0.55em; top: calc((1lh - 0.4rem) / 2); width: 0.4rem; height: 0.4rem; background: var(--px-red); }
.px-prose :where(ol > li)::marker { font-weight: 700; font-variant-numeric: tabular-nums; }
.px-prose :where(blockquote) {
	padding-left: var(--px-space-4);
	border-left: 6px solid var(--px-mustard);
	font-family: var(--px-font-display);
	font-weight: 800;
	font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem);
	line-height: 1;
	text-transform: uppercase;
}
.px-prose :where(blockquote cite, blockquote footer) { display: block; margin-top: var(--px-space-3); font-family: var(--px-font-text); font-weight: 600; font-size: var(--px-text-sm); font-style: normal; text-transform: none; color: var(--px-grey); }
.px-prose :where(figure) { margin-inline: 0; }
.px-prose :where(figcaption, .wp-caption-text, .wp-element-caption) { margin-top: var(--px-space-2); color: var(--px-grey); font-size: var(--px-text-sm); }
.px-prose :where(dl) { display: grid; grid-template-columns: minmax(8rem, max-content) 1fr; gap: 0.5rem var(--px-space-4); }
.px-prose :where(dt) { color: var(--px-grey); font-weight: 700; font-size: var(--px-text-sm); letter-spacing: 0.06em; text-transform: uppercase; padding-top: 0.15em; }
.px-prose :where(table) { display: block; overflow-x: auto; max-width: 100%; }
.px-prose .alignwide { max-width: min(64rem, 100%); }
.px-prose :where(.wp-block-button__link) {
	display: inline-flex; min-height: 3.25rem; align-items: center; padding: 0.95rem 1.625rem 0.8rem; border-radius: var(--px-radius);
	background: var(--px-mustard); color: var(--px-ink); font-family: var(--px-font-display); font-weight: 800; font-size: 1.375rem; line-height: 1; letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none;
}
.px-prose :where(.wp-block-button__link:hover) { background: var(--px-ink); color: var(--px-mustard); }
@media (max-width: 32.5rem) {
	.px-prose :where(dl) { grid-template-columns: 1fr; gap: 0.125rem; }
	.px-prose :where(dd) { margin-bottom: 0.5rem; }
}

/* ---------- Pagination ---------- */
.px-pagination { margin-top: var(--px-space-6); }
.px-pagination .nav-links { display: flex; flex-wrap: wrap; gap: var(--px-space-2); align-items: center; }
.px-pagination .page-numbers {
	display: inline-flex; min-width: 2.75rem; min-height: 2.75rem; align-items: center; justify-content: center; padding: 0.2em 0.75rem 0;
	color: var(--px-ink); font-family: var(--px-font-display); font-weight: 800; font-size: 1.375rem; letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none;
}
.px-pagination .page-numbers.current { background: var(--px-ink); color: var(--px-paper); }
.px-pagination a.page-numbers:hover { color: var(--px-red); }

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