/*
 * Airborne Propstore Plugin (Airborne Studio).
 *
 * Every rule here is scoped to .abp or a .abp-* class, so nothing else on the site changes. Colours are the
 * site's own (the same values propstore-ui.css uses), apart from the orange of the tags, which is new in the
 * EMLA designs. The font is the site's Acumin Pro from its Typekit kit, in the weights the kit has (300 to 600).
 * Sizes follow the EMLA designs at 1920 wide and step down for tablets and phones.
 */

/* ---- Settings ---- */

.abp,
.abp-block {
	--abp-navy: #2d2e41;
	--abp-purple: #764aaf;
	--abp-purple-dark: #5e3b8b; /* propstore-ui.css: focused buttons */
	--abp-purple-pale: #e1d7ee; /* propstore-ui.css: progress bars */
	--abp-orange: #ffaa00;
	--abp-green: #19ba5d;
	--abp-line: #c7c7c7;
	--abp-light: #f4f4f4;
	--abp-media: #f4f4f4;
	--abp-radius: 6px;
	--abp-gutter: 20px;
	--abp-gap: 20px;
	--abp-font: acumin-pro, sans-serif;
	font-family: var(--abp-font);
	color: var(--abp-navy);
}

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

@media (min-width: 768px) {
	.abp,
	.abp-block {
		--abp-gutter: 40px;
	}
}

@media (min-width: 1440px) {
	.abp,
	.abp-block {
		--abp-gutter: 60px;
	}
}

/* ---- The page and the article grid ---- */

/* The theme's header sits on top of the page (position: absolute); its own "header ~ main" rule pads main below it. */
.abp-page {
	display: block;
}

/*
 * One grid for the whole article. Named lines, at 1920 wide:
 *   full       the whole window
 *   container  1496px, where the byline and title start
 *   wide       1194px, for pictures, galleries and videos
 *   text       739px on the right, for the intro and the text
 */
.abp-article {
	container: abp-article / inline-size;
	--abp-c: min(1496px, 100% - 2 * var(--abp-gutter));
	display: grid;
	grid-template-columns:
		[full-start] minmax(var(--abp-gutter), 1fr)
		[container-start] calc(var(--abp-c) * 0.1009)
		[wide-start] calc(var(--abp-c) * 0.2219)
		[meta-end] calc(var(--abp-c) * 0.0823)
		[text-start] calc(var(--abp-c) * 0.494)
		[text-end wide-end] calc(var(--abp-c) * 0.1009)
		[container-end] minmax(var(--abp-gutter), 1fr) [full-end];
	align-content: start;
	padding: 60px 0 120px;
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
}

@media (max-width: 1023px) {
	.abp-article {
		grid-template-columns:
			[full-start] var(--abp-gutter)
			[container-start wide-start text-start] minmax(0, 1fr)
			[text-end wide-end meta-end container-end] var(--abp-gutter) [full-end];
		padding-top: 32px;
	}
}

.abp-article > * {
	grid-column: text;
	min-width: 0;
}

/* A page or article that ends with a block (the auction banner, say) adds no space of its own before the
   theme's newsletter. The designs give the newsletter equal space above and below: the theme puts 120px
   below it (80px at 1200px and narrower), so on campaign pages its top padding matches. */
.abp-article:has(> .abp-block:last-child) {
	padding-bottom: 0;
}

.abp-article > .abp-block:last-child {
	margin-bottom: 0;
}

.abp-campaign .footer-signup {
	padding-top: 120px;
}

@media (max-width: 1200px) {
	.abp-campaign .footer-signup {
		padding-top: 80px;
	}
}

.abp-article > .abp-article__meta {
	grid-column: container-start / meta-end;
	grid-row: 1 / span 3;
	align-self: start;
	padding-bottom: 40px;
}

.abp-article > .abp-article__intro {
	grid-row: 1;
}

@media (max-width: 1023px) {
	.abp-article > .abp-article__meta,
	.abp-article > .abp-article__intro {
		grid-row: auto;
	}
}

/* ---- Byline, title, share links and intro ---- */

.abp .abp-article__byline {
	margin: 0 0 16px;
	font-size: 12px;
	line-height: 16px;
	font-weight: 400;
	color: var(--abp-navy);
}

.abp .abp-article__byline a {
	color: var(--abp-purple);
	text-decoration: none;
}

.abp-article__divider {
	margin: 0 4px;
}

.abp .abp-article__title {
	margin: 0 0 40px;
	font-family: var(--abp-font);
	font-size: 40px;
	line-height: 48px;
	font-weight: 300;
	letter-spacing: -0.02em;
	color: var(--abp-navy);
}

.abp-share {
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: 12px;
	line-height: 16px;
	font-weight: 400;
}

.abp-share__label {
	margin-right: 4px;
}

.abp .abp-share__link {
	display: inline-flex;
	width: 16px;
	height: 16px;
	color: var(--abp-navy);
}

.abp .abp-share__link:hover,
.abp .abp-share__link:focus-visible {
	color: var(--abp-purple);
}

.abp-share .abp-icon {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

.abp .abp-article__intro p {
	margin: 0 0 46px;
	font-size: 28px; /* Measured from the designs' render: 28px text on a 39px line. */
	line-height: 39px;
	font-weight: 300;
	letter-spacing: -0.01em;
	color: var(--abp-navy);
}

@media (max-width: 767px) {
	.abp .abp-article__title {
		margin-bottom: 24px;
		font-size: 32px;
		line-height: 38px;
	}

	.abp .abp-article__intro p {
		font-size: 20px;
		line-height: 28px;
	}
}

/* ---- The text ---- */

/*
 * The theme's content filters give every paragraph of every post the classes p-r and article__paragraph (20px),
 * and the first one p-l and article__paragraph--big (28px), through ".wp p.p-r" and ".wp p.p-l". These rules
 * carry the same weight and load later. The designs' text, measured from their render on 29 Oct 2026, is 20px on
 * a 28px line with a blank line between paragraphs (the theme's own size), not the 16px used until then.
 */
.abp .abp-article > p,
.abp .abp-article > ul,
.abp .abp-article > ol,
.abp .abp-article > blockquote {
	margin: 0 0 28px;
	font-size: 20px;
	line-height: 28px;
	font-weight: 300;
	color: var(--abp-navy);
}

/* With no excerpt to act as the intro, the first paragraph takes the intro's size. */
.abp .abp-article:not(.abp-article--intro) > p.p-l {
	margin-bottom: 46px;
	font-size: 28px;
	line-height: 39px;
	letter-spacing: -0.01em;
}

.abp .abp-article > ul:not(.browser-default) {
	padding-left: 1.25em;
}

.abp .abp-article > ul:not(.browser-default) > li {
	list-style-type: disc;
}

.abp .abp-article > blockquote {
	padding-left: 20px;
	border-left: 2px solid var(--abp-purple);
}

.abp .abp-article > h2,
.abp .abp-article > h3,
.abp .abp-article > h4 {
	margin: 56px 0 20px;
	font-family: var(--abp-font);
	font-weight: 300;
	letter-spacing: -0.02em;
	color: var(--abp-navy);
}

.abp .abp-article > h2 {
	font-size: 32px;
	line-height: 40px;
}

.abp .abp-article > h3 {
	font-size: 24px;
	line-height: 30px;
	font-weight: 400;
}

.abp .abp-article > h4 {
	font-size: 20px;
	line-height: 28px;
	font-weight: 500;
}

.abp-article strong,
.abp-article b {
	font-weight: 600;
}

.abp .abp-article > p a:not([class]),
.abp .abp-article > ul a:not([class]),
.abp .abp-article > ol a:not([class]) {
	font-weight: inherit !important; /* The theme's link rule makes links bold; the designs keep the text's weight. */
	text-decoration: underline;
	text-underline-offset: 2px;
}

.abp .abp-article > hr {
	margin: 48px 0;
	border: 0;
	border-top: 1px solid var(--abp-purple); /* The EMLA designs' divider (Article-02). */
}

/* Next to a block, the block's own margin is the space on that side and the line takes the same on the other,
   so it sits halfway between the block and the text, as in the designs. */
.abp .abp-article > .abp-block + hr {
	margin-top: 0;
	margin-bottom: 72px;
}

.abp .abp-article > hr:has(+ .abp-block) {
	margin-top: 72px;
	margin-bottom: 0;
}

.abp .abp-article > .abp-block + hr:has(+ .abp-block) {
	margin: 0;
}

@media (min-width: 1024px) {
	.abp .abp-article > .abp-block + hr {
		margin-bottom: 100px;
	}

	.abp .abp-article > hr:has(+ .abp-block) {
		margin-top: 100px;
	}

	.abp .abp-article > .abp-block + hr:has(+ .abp-block) {
		margin: 0;
	}
}

/* ---- Pictures, galleries and videos from the editor ---- */

/* Centred pictures, galleries and videos take the wide column; pictures set to "None" stay in the text. */
.abp-article > p:has(> img.aligncenter),
.abp-article > p:has(> a > img.aligncenter),
.abp-article > .wp-caption.aligncenter,
.abp-article > figure.aligncenter,
.abp-article > .gallery,
.abp-article > p:has(> iframe),
.abp-article > iframe,
.abp-article > .wp-video,
.abp-article > .abp-wide {
	grid-column: wide;
	margin: 56px 0 72px;
}

.abp-article img {
	max-width: 100%;
	height: auto;
}

/* The theme adds article__image to pictures in posts, with 1.65em above and below; the grid does the spacing. */
.abp .abp-article img.article__image {
	padding: 0;
}

.abp-article > p:has(> img.aligncenter) img,
.abp-article > p:has(> a > img.aligncenter) img,
.abp-article > .wp-caption.aligncenter img,
.abp-article > figure.aligncenter img {
	display: block;
	width: 100%;
	margin: 0;
	border-radius: var(--abp-radius);
}

.abp-article .wp-caption {
	width: auto !important; /* WordPress writes the picture's own width inline. */
	max-width: 100%;
	margin-left: 0;
	margin-right: 0;
}

.abp .wp-caption-text,
.abp .gallery-caption {
	margin: 12px 0 0;
	padding: 0;
	font-size: 14px;
	line-height: 20px;
	font-style: italic;
	font-weight: 300;
	text-align: left;
	color: var(--abp-navy);
}

.abp-article > .gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--abp-gap);
}

.abp-article > .gallery-columns-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.abp-article > .gallery-columns-1 {
	grid-template-columns: minmax(0, 1fr);
}

.abp-article > .gallery br {
	display: none;
}

.abp-article > .gallery .gallery-item {
	margin: 0;
}

.abp-article > .gallery .gallery-icon img {
	display: block;
	width: 100%;
	aspect-ratio: 590 / 620;
	object-fit: cover;
	border-radius: var(--abp-radius);
	background: var(--abp-light);
}

@media (max-width: 767px) {
	.abp-article > .gallery {
		grid-template-columns: minmax(0, 1fr);
	}
}

.abp-article > p:has(> iframe) iframe,
.abp-article > iframe {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border: 0;
	border-radius: var(--abp-radius);
}

.abp-article .wp-video {
	width: 100% !important; /* WordPress writes the video's own width inline. */
}

/* ---- Blocks: widths in the article ---- */

.abp-block {
	margin-top: 72px;
	margin-bottom: 72px;
}

@media (min-width: 1024px) {
	.abp-block {
		margin-top: 100px;
		margin-bottom: 100px;
	}
}

/* Starts at the page edge and runs off the right of the window, so the next card shows. */
.abp-article > .abp-bleed {
	grid-column: full;
	padding-left: max(var(--abp-gutter), (100cqi - 1800px) / 2);
}

.abp-article > .abp-full {
	grid-column: full;
}

/* 1800px wide at 1920, with the page's margins. */
.abp-article > .abp-page-wide {
	grid-column: full;
	width: min(1800px, 100% - 2 * var(--abp-gutter));
	margin-left: auto;
	margin-right: auto;
}

/* Starts at the wide column and runs off the right of the window. */
.abp-article > .abp-spotlight {
	grid-column: wide-start / full-end;
}

.abp .abp-block__label,
.abp-block .abp-block__label {
	margin: 0 0 32px;
	font-family: var(--abp-font);
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--abp-navy);
}

.abp-block .abp-block__label--center {
	text-align: center;
}

.abp-block .abp-eyebrow {
	margin: 0;
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.abp-note {
	margin: 24px 0;
	padding: 12px 16px;
	border: 1px dashed var(--abp-purple, #764aaf);
	font-size: 14px;
	line-height: 20px;
	color: var(--abp-purple, #764aaf);
}

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

.abp-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.abp-block .abp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 56px;
	padding: 0 40px; /* The designs' buttons: 214px wide for "Register now", 209px for "See the lots". */
	border: 1px solid var(--abp-purple);
	border-radius: 0;
	background: var(--abp-purple);
	color: #fff;
	font-family: var(--abp-font);
	font-size: 12px;
	line-height: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.15s, border-color 0.15s;
}

.abp-block .abp-btn:hover,
.abp-block .abp-btn:focus-visible {
	border-color: var(--abp-purple-dark);
	background: var(--abp-purple-dark);
	color: #fff;
}

.abp-block .abp-btn--outline {
	border-color: var(--abp-purple);
	background: transparent;
	color: inherit;
}

.abp-block .abp-btn--outline:hover,
.abp-block .abp-btn--outline:focus-visible {
	border-color: var(--abp-purple);
	background: rgba(118, 74, 175, 0.18);
	color: inherit;
}

.abp-block .abp-btn--small {
	min-height: 26px;
	padding: 0 12px;
	font-size: 10px;
	letter-spacing: 0.1em;
}

@media (max-width: 767px) {
	.abp-block .abp-btn {
		min-height: 48px;
		padding: 0 20px;
	}
}

/*
 * Link colours. Materialize, inside propstore-ui.css, colours every link through
 * "a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-extra-small):not(.btn-flat)", which outweighs any
 * ordinary class rule. These are the only places this stylesheet uses !important.
 */
.abp-block .abp-btn {
	background-color: var(--abp-purple) !important;
	color: #fff !important;
}

.abp-block .abp-btn:hover,
.abp-block .abp-btn:focus-visible {
	background-color: var(--abp-purple-dark) !important;
}

.abp-block .abp-btn--outline {
	background-color: transparent !important;
	color: var(--abp-navy) !important;
}

.abp-block .abp-btn--outline:hover,
.abp-block .abp-btn--outline:focus-visible {
	background-color: rgba(118, 74, 175, 0.18) !important;
}

.abp-feature .abp-btn--outline,
.abp-collection .abp-btn--outline,
.abp-story--big .abp-btn--outline {
	color: #fff !important;
}

.abp-story--small .abp-btn--outline,
.abp-story--text .abp-btn--outline {
	color: var(--abp-purple) !important;
}

.abp-block .abp-card__link,
.abp-block .abp-story__link {
	color: inherit !important;
}

.abp-block .abp-btn,
.abp-block .abp-card__link,
.abp-block .abp-story__link {
	text-decoration: none !important;
}

.abp .abp-article__byline a {
	color: var(--abp-purple) !important;
}

.abp .abp-share__link:hover,
.abp .abp-share__link:focus-visible,
.abp .abp-article > p a:not([class]):hover,
.abp .abp-article > ul a:not([class]):hover,
.abp .abp-article > ol a:not([class]):hover {
	color: var(--abp-purple) !important;
}

/* ---- Tags ---- */

.abp-block .abp-tag {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	gap: 8px;
	height: 28px;
	padding: 0 12px;
	border-radius: 4px;
	background: var(--abp-orange);
	color: var(--abp-navy);
	font-size: 12px;
	line-height: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	white-space: nowrap;
}

.abp-tag .abp-icon {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

.abp-block .abp-tag--live {
	background: var(--abp-green);
	color: #fff;
}

.abp-block .abp-tag--sold {
	background: var(--abp-navy);
	color: #fff;
}

.abp-block .abp-tag--small {
	height: 24px; /* The banner's "Just announced" tag in the designs is 148px by 24px. */
	padding: 0 12px;
	border-radius: 2px;
	font-size: 12px;
	letter-spacing: 0.1em;
}

/* ---- Lot cards ---- */

.abp-card {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 356px;
	max-width: 78vw;
	border: 1px solid var(--abp-line);
	border-radius: var(--abp-radius);
	background: #fff;
	color: var(--abp-navy);
	overflow: hidden;
}

.abp-card__media {
	position: relative;
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 360px;
	background: var(--abp-media);
}

.abp-block img.abp-card__img {
	width: 100%;
	height: 100%;
	padding: 16px;
	object-fit: contain;
	mix-blend-mode: multiply; /* White studio backgrounds take the grey of the card, as in the designs. */
}

.abp-card__media .abp-tag {
	position: absolute;
	left: 20px;
	bottom: 20px;
}

.abp-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 20px;
	padding: 20px 24px 30px;
}

.abp-block .abp-card__film {
	margin: 0;
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--abp-purple);
}

.abp-block .abp-card__price {
	margin: 0;
	font-size: 20px;
	line-height: 28px;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--abp-navy);
}

.abp-block .abp-card__title {
	margin: 0;
	font-family: var(--abp-font);
	font-size: 20px;
	line-height: 28px;
	font-weight: 400; /* The designs' card names are regular; only the estimate is bold. */
	letter-spacing: -0.02em;
	color: var(--abp-navy);
}

.abp-block .abp-card__price + .abp-card__title {
	margin-top: -20px; /* The estimate and the name read as one block. */
}

.abp-block .abp-card__link {
	color: inherit;
	font-weight: inherit !important; /* The theme's link rule makes links bold. */
	text-decoration: none;
}

/* The whole card is the link. */
.abp-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.abp-card__link:focus-visible {
	outline: none;
}

.abp-card:focus-within {
	outline: 2px solid var(--abp-purple);
	outline-offset: 2px;
}

.abp-block .abp-card__text {
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
	color: var(--abp-navy);
}

.abp-card__more {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	margin-top: auto;
	padding: 5px 0;
	font-size: 12px;
	line-height: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--abp-purple);
}

.abp-card__more .abp-icon {
	width: 16px;
	height: 16px;
	fill: currentColor;
	transition: transform 0.15s;
}

.abp-card:hover .abp-card__more .abp-icon {
	transform: translateX(4px);
}

.abp-block .abp-card--compact .abp-card__price {
	font-size: 12px;
	line-height: 16px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.abp-block .abp-card--compact .abp-card__price + .abp-card__title {
	margin-top: -12px;
}

.abp-block .abp-card--compact .abp-card__title {
	font-size: 16px;
	line-height: 22px;
	font-weight: 600;
}

.abp-block .abp-card--compact .abp-card__text {
	font-size: 14px;
	line-height: 20px;
}

@media (max-width: 767px) {
	.abp-card {
		width: 280px;
	}

	.abp-card__media {
		height: 280px;
	}
}

/* ---- Scrolling rows ---- */

.abp-carousel {
	position: relative;
}

.abp-carousel__track {
	position: relative;
	display: flex;
	gap: var(--abp-gap);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.abp-carousel__track::-webkit-scrollbar {
	display: none;
}

.abp-carousel__track:focus-visible {
	outline: 2px solid var(--abp-purple);
	outline-offset: 4px;
}

.abp-carousel__item {
	display: flex;
	flex: none;
	scroll-snap-align: start;
}

.abp-carousel__dots {
	display: flex;
	justify-content: flex-end;
	gap: 14px;
	margin-top: 40px;
}

.abp-carousel__dots[hidden] {
	display: none;
}

.abp-block .abp-carousel__dot {
	width: 11px;
	height: 11px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--abp-purple-pale);
	box-shadow: none;
	cursor: pointer;
}

.abp-block .abp-carousel__dot:hover {
	background: #d1c4e9; /* propstore-ui.css: .deep-purple.lighten-4 */
}

.abp-block .abp-carousel__dot[aria-current="true"] {
	background: var(--abp-purple);
}

.abp-block .abp-carousel__dot:focus-visible {
	outline: 2px solid var(--abp-purple);
	outline-offset: 3px;
}

.abp-bleed .abp-carousel__track {
	padding-right: var(--abp-gutter);
}

.abp-bleed .abp-carousel__dots {
	padding-right: var(--abp-gutter);
}

/* In an article, the dots start where the text does (x 818 at 1920, as in the designs), not under the cards. */
@media (min-width: 1024px) {
	.abp-article > .abp-bleed .abp-carousel__dots {
		--abp-c: min(1496px, 100cqi - 2 * var(--abp-gutter));
		justify-content: flex-start;
		margin-left: calc((100cqi - var(--abp-c)) / 2 + var(--abp-c) * 0.4051 - max(var(--abp-gutter), (100cqi - 1800px) / 2));
	}
}

/* ---- Lead card ---- */

.abp-feature {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 808px;
	max-width: 86vw;
	min-height: 662px;
	border-radius: var(--abp-radius);
	background: var(--abp-navy);
	color: #fff;
	overflow: hidden;
}

.abp-feature__media {
	position: relative;
	flex: 1;
	min-height: 240px;
}

.abp-block img.abp-feature__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.abp-feature__panel {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 20px 40px 40px;
	background: var(--abp-navy);
}

.abp-feature--overlay {
	justify-content: flex-end;
}

.abp-feature--overlay .abp-feature__media {
	position: absolute;
	inset: 0;
}

.abp-feature--overlay .abp-feature__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(45, 46, 65, 0) 38%, rgba(45, 46, 65, 0.92) 100%);
}

.abp-feature--overlay .abp-feature__panel {
	background: transparent;
}

.abp-block .abp-feature__title {
	margin: 0;
	font-family: var(--abp-font);
	font-size: 40px;
	line-height: 48px;
	font-weight: 300;
	letter-spacing: -0.02em;
	color: #fff;
}

.abp-block .abp-feature__text {
	max-width: 620px;
	margin: 0 0 12px;
	font-size: 20px; /* Measured from the designs' render: 20px on a 28px line. */
	line-height: 28px;
	font-weight: 300;
	color: #fff;
}

.abp-feature .abp-btn--outline {
	color: #fff;
}

@media (max-width: 767px) {
	.abp-feature {
		min-height: 520px;
	}

	.abp-feature__panel {
		padding: 20px 24px 28px;
	}

	.abp-block .abp-feature__title {
		font-size: 28px;
		line-height: 34px;
	}
}

/* ---- Top lots: large pictures across the window ---- */

.abp-article > .abp-lots--hero {
	display: grid;
	grid-template-columns: subgrid;
}

.abp-lots--hero > .abp-block__label {
	grid-column: text;
}

.abp-lots--hero > .abp-carousel {
	display: contents;
}

.abp-lots--hero .abp-carousel__track {
	grid-column: full;
	gap: 8px;
}

/* Dots start where the text does, as in the designs; the button goes under them. */
.abp-lots--hero .abp-carousel__dots {
	grid-column: text;
	grid-row: 3;
	justify-content: flex-start;
}

.abp-lots--hero > .abp-lots__foot {
	grid-column: text;
	grid-row: 4;
	margin-top: 32px;
}

.abp-hero-slide {
	position: relative;
	width: min(1557px, 81vw);
}

.abp-hero-slide__media {
	aspect-ratio: 1557 / 900;
	border-radius: var(--abp-radius);
	background: var(--abp-light);
	overflow: hidden;
}

.abp-block img.abp-hero-slide__img {
	display: block;
	width: 100%;
	height: 100%;
	padding: 40px;
	object-fit: contain;
	object-position: 75% 50%; /* Clear of the lot card on the left. */
	mix-blend-mode: multiply; /* Catalogue cut-outs: the white takes the panel's grey. */
}

.abp-hero-slide .abp-card--overlay {
	position: absolute;
	left: var(--abp-gutter);
	bottom: 6.5%;
	width: 450px;
	min-height: 302px; /* The design's card is 450px by 302px, 60px in from the picture's corner. */
	max-width: calc(100% - 2 * var(--abp-gutter));
	border: 0;
}

.abp-hero-slide .abp-card--overlay .abp-card__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-height: 302px;
	padding: 20px;
}

.abp-hero-slide .abp-card--overlay .abp-card__film {
	margin-top: 30px;
}

.abp-hero-slide .abp-card--overlay .abp-card__more {
	margin-top: auto;
}

@media (max-width: 1023px) {
	.abp-lots--hero .abp-carousel__dots {
		grid-column: container;
		grid-row: 3;
		justify-content: center;
		padding-right: 0;
	}

	.abp-lots--hero > .abp-lots__foot {
		grid-column: container;
		grid-row: 4;
		display: flex;
		justify-content: center;
	}
}

@media (max-width: 767px) {
	.abp-hero-slide {
		width: 86vw;
	}

	.abp-hero-slide .abp-card--overlay {
		position: static;
		width: auto;
		max-width: none;
		border: 1px solid var(--abp-line);
		border-top: 0;
		border-radius: 0 0 var(--abp-radius) var(--abp-radius);
	}

	.abp-hero-slide__media {
		border-radius: var(--abp-radius) var(--abp-radius) 0 0;
	}
}

/* ---- Spotlight: large pictures in the wide column, card and text below ---- */

.abp-spotlight .abp-carousel__track {
	padding-right: var(--abp-gutter);
}

.abp-spotlight .abp-carousel__dots {
	padding-right: var(--abp-gutter);
}

.abp-spot {
	width: calc(min(1496px, 100cqi - 2 * var(--abp-gutter)) * 0.7981);
}

@media (max-width: 1023px) {
	.abp-spot {
		width: calc(100cqi - 2 * var(--abp-gutter));
	}
}

.abp-spot__media {
	position: relative;
	aspect-ratio: 1194 / 759;
	/* On a short window the picture gets shorter, not the slide narrower, so the card and text below keep their width
	   (and their few lines) and the whole slide fits on screen. */
	width: 100%;
	max-height: max(280px, calc(100svh - 320px));
	border-radius: var(--abp-radius) var(--abp-radius) var(--abp-radius) 0;
	background: var(--abp-light);
	overflow: hidden;
}

.abp-block img.abp-spot__img {
	display: block;
	width: 100%;
	height: 100%;
	padding: 32px;
	object-fit: contain; /* The whole lot shows, as on the cards. */
	mix-blend-mode: multiply;
}

.abp-spot__media .abp-tag {
	position: absolute;
	left: 20px;
	bottom: 20px;
}

.abp-spot__below {
	display: flex;
	align-items: flex-start;
	gap: 40px;
}

.abp-block .abp-card--below {
	flex: none;
	border-top: 0;
	border-radius: 0 0 var(--abp-radius) var(--abp-radius);
}

.abp-spot__text {
	flex: 1;
	max-width: 560px;
	padding-top: 20px;
}

.abp-block .abp-spot__text p {
	margin: 0 0 12px;
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
	color: var(--abp-navy);
}

.abp-block .abp-spot__text .abp-spot__name {
	font-weight: 600;
}

@media (max-width: 767px) {
	.abp-spot__below {
		flex-direction: column;
		gap: 0;
	}

	.abp-block .abp-card--below {
		width: 100%;
		max-width: none;
	}
}

/* ---- Collection banner ---- */

.abp-collection__head {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 256px;
	padding: 48px 40px;
	border-radius: var(--abp-radius) 120px 0 0;
	background: var(--abp-navy);
	color: #fff;
	overflow: hidden;
}

.abp-collection__media {
	position: absolute;
	inset: 0 0 0 38%;
}

.abp-collection__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, #2d2e41 0%, rgba(45, 46, 65, 0.6) 30%, rgba(45, 46, 65, 0) 70%);
}

.abp-block img.abp-collection__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.abp-collection__intro {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 24px;
	max-width: 760px;
}

.abp-block .abp-collection__title {
	margin: 0;
	font-family: var(--abp-font);
	font-size: 40px;
	line-height: 48px;
	font-weight: 300;
	letter-spacing: -0.02em;
	color: #fff;
}

.abp-block .abp-collection__text {
	max-width: 562px;
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
	color: #fff;
}

.abp-collection .abp-btn--outline {
	color: #fff;
}

.abp-collection__box {
	padding: 40px 40px 32px;
	border: 1px solid var(--abp-navy); /* The designs outline the lots box in the dark navy. */
	border-top: 0;
	border-radius: 0 0 var(--abp-radius) var(--abp-radius);
}

.abp-collection--grid .abp-collection__head {
	align-items: flex-end;
	min-height: 500px;
}

.abp-collection--grid .abp-collection__media {
	inset: 0;
}

.abp-collection--grid .abp-collection__media::after {
	background: linear-gradient(90deg, rgba(45, 46, 65, 0.95) 0%, rgba(45, 46, 65, 0.75) 35%, rgba(45, 46, 65, 0.1) 75%);
}

.abp-collection__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(max(260px, (100% - 3 * var(--abp-gap)) / 4), 1fr));
	gap: var(--abp-gap);
	margin-top: 40px;
}

.abp-collection__grid .abp-card {
	width: auto;
	max-width: none;
}

@media (max-width: 767px) {
	.abp-collection__head {
		min-height: 220px;
		padding: 32px 24px;
		border-radius: var(--abp-radius) 60px 0 0;
	}

	.abp-collection__media {
		inset: 0;
	}

	.abp-collection__media::after {
		background: linear-gradient(90deg, rgba(45, 46, 65, 0.95) 0%, rgba(45, 46, 65, 0.7) 100%);
	}

	.abp-block .abp-collection__title {
		font-size: 28px;
		line-height: 34px;
	}

	.abp-collection__box {
		padding: 24px 0 24px 16px;
	}

	.abp-collection__box .abp-carousel__dots {
		padding-right: 16px;
	}
}

/* ---- Auction banner ---- */

.abp-auction {
	display: grid;
	grid-template-columns: minmax(0, 1046fr) minmax(0, 754fr);
	min-height: 500px;
	border-radius: 0 0 140px 0;
	background: var(--abp-navy);
	color: #fff;
	overflow: hidden;
}

.abp-auction__media {
	position: relative;
	min-height: 260px;
}

.abp-block img.abp-auction__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.abp-auction__body {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 40px; /* The design's layers: tag 24px, 40px, two 50px title lines, 40px, a 56px button. */
	padding: 96px 48px 48px 117px;
}

.abp-block .abp-auction__title {
	margin: 0;
	font-family: var(--abp-font);
	font-size: 40px;
	line-height: 50px;
	font-weight: 300;
	letter-spacing: -0.02em;
	color: #fff;
}

@media (max-width: 1023px) {
	.abp-auction {
		grid-template-columns: minmax(0, 1fr);
		border-radius: 0 0 60px 0;
	}

	.abp-auction__media {
		aspect-ratio: 16 / 9;
	}

	.abp-block .abp-auction__title {
		font-size: 30px;
		line-height: 36px;
	}
}

/* ---- Latest stories ---- */

.abp-stories__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--abp-gap);
}

.abp-story {
	position: relative;
	color: var(--abp-navy);
	overflow: hidden;
}

.abp-block .abp-story__link {
	color: inherit;
	font-weight: inherit !important; /* The theme's link rule makes links bold. */
	text-decoration: none;
}

.abp-story__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.abp-story:focus-within {
	outline: 2px solid var(--abp-purple);
	outline-offset: 2px;
}

.abp-block .abp-story__title {
	margin: 0;
	font-family: var(--abp-font);
	font-weight: 300;
	letter-spacing: -0.02em;
	color: inherit;
}

.abp-block img.abp-story__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.abp-block .abp-story__text {
	max-width: 562px;
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
	color: inherit;
}

/* Big: the picture behind the text. */
.abp-story--big {
	grid-column: span 2;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 640px;
	border-radius: var(--abp-radius);
	background: #000;
	color: #fff;
}

.abp-story--big .abp-story__media {
	position: absolute;
	inset: 0;
}

/* Black from the bottom of the frame, clearing by a quarter of the way down, so the text holds on any picture. */
.abp-story--big .abp-story__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0.6) 55%, #000 100%);
}

.abp-story--big .abp-story__body {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	padding: 40px;
}

.abp-block .abp-story--big .abp-story__title {
	font-size: 40px;
	line-height: 48px;
}

.abp-story--big .abp-btn--outline {
	margin-top: 8px;
	color: #fff;
}

.abp-stories--feature .abp-story--big,
.abp-stories--feature-list .abp-story--big {
	grid-row: span 2;
	min-height: 780px;
}

/* Small: the picture beside the text. */
.abp-story--small {
	grid-column: span 2;
	display: grid;
	grid-template-columns: minmax(0, 290px) minmax(0, 1fr);
	border: 1px solid var(--abp-line);
	border-radius: var(--abp-radius);
	background: #fff;
}

.abp-story--small .abp-story__media {
	min-height: 220px;
	background: #000;
}

.abp-story--small .abp-story__body,
.abp-story--text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

.abp-story--small .abp-story__body {
	padding: 24px;
}

.abp-block .abp-story--small .abp-story__title,
.abp-block .abp-story--text .abp-story__title {
	font-size: 24px;
	line-height: 30px;
}

.abp-block .abp-story--small .abp-eyebrow,
.abp-block .abp-story--text .abp-eyebrow {
	font-size: 10px;
	line-height: 14px;
	letter-spacing: 0.1em;
}

.abp-story--small .abp-btn,
.abp-story--text .abp-btn {
	margin-top: auto;
	color: var(--abp-purple);
}

/* Text only: a line on the left. */
.abp-story--text {
	margin-top: 40px;
	padding-left: 12px;
	border-left: 1px solid var(--abp-purple);
}

.abp-stories--list .abp-story--text {
	margin-top: 0;
}

@media (max-width: 1023px) {
	.abp-stories__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.abp-stories--feature .abp-story--big,
	.abp-stories--feature-list .abp-story--big {
		grid-row: auto;
		min-height: 560px;
	}

	.abp-story--text {
		grid-column: span 1;
	}
}

@media (max-width: 767px) {
	.abp-stories__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.abp-story--big,
	.abp-story--small {
		grid-column: auto;
	}

	.abp-story--big {
		min-height: 480px;
	}

	.abp-story--big .abp-story__body {
		padding: 24px;
	}

	.abp-block .abp-story--big .abp-story__title {
		font-size: 28px;
		line-height: 34px;
	}

	.abp-story--small {
		grid-template-columns: minmax(0, 120px) minmax(0, 1fr);
	}

	.abp-story--small .abp-story__media {
		min-height: 160px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.abp-block *,
	.abp-block *::before,
	.abp-block *::after {
		transition: none !important;
	}
}

/* ---- Pictures with captions: [airborne_pictures] ---- */

.abp-article > .abp-pictures--wide {
	grid-column: wide;
}

/* A video's picture: from the container's left edge on to the page's right margin (Article-03). */
.abp-article > .abp-pictures--video {
	grid-column: container-start / full-end;
	margin-right: max(var(--abp-gutter), (100cqi - 1800px) / 2);
}

/* Reaches from the container's left edge to the right of the wide column (Article-04 and Article-05). */
.abp-article > .abp-pictures--extended {
	grid-column: container-start / wide-end;
}

/* The pictures share one height: each takes a width in proportion to its panel's shape (--abp-flex). */
.abp-pictures {
	display: flex;
	align-items: flex-start;
	gap: 20px;
}

@media (max-width: 767px) {
	.abp-pictures {
		flex-direction: column;
	}
}

.abp-picture {
	flex: var(--abp-flex, 1) 1 0;
	min-width: 0;
	width: 100%;
	margin: 0;
}

.abp-picture__media {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: var(--abp-ratio, auto);
	overflow: hidden;
	border-radius: var(--abp-radius);
}

.abp-picture--grey .abp-picture__media {
	background: var(--abp-media);
}

.abp-picture--white .abp-picture__media {
	border: 1px solid #e3e3e6;
	background: #fff;
}

.abp .abp-article .abp-picture__img {
	display: block;
	width: var(--abp-scale, 100%);
	max-width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	border-radius: 0;
}

.abp .abp-article .abp-picture--contain .abp-picture__img {
	max-height: 100%;
	object-fit: contain;
}

.abp .abp-article .abp-picture--cover .abp-picture__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* White studio backgrounds take the grey of the panel, as on the lot cards. */
.abp-picture--grey .abp-picture__img {
	mix-blend-mode: multiply;
}

.abp-picture__caption {
	margin: 20px 0 0;
	font-size: 20px; /* The designs' captions are the body size, 20px on a 28px line, italic. */
	line-height: 28px;
	font-style: italic;
	font-weight: 300;
	color: var(--abp-navy);
}

/* The play button on a video's picture; it opens the video's own address. */
.abp-block .abp-picture__play {
	position: absolute !important; /* The theme's link rules set position, colour and background with more weight. */
	top: 50%;
	left: 50%;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 88px;
	height: 88px;
	margin: -44px 0 0 -44px;
	border-radius: 50%;
	background-color: #0fb9c7 !important;
	color: #fff !important;
	text-decoration: none;
}

.abp-block .abp-picture__play:hover,
.abp-block .abp-picture__play:focus-visible {
	background-color: #0a98a4 !important;
}

.abp-picture__play .abp-icon--play {
	width: 36px;
	height: 36px;
	fill: none;
	stroke: #fff;
	stroke-width: 1.5px;
}

.abp-picture__play .abp-icon--play path {
	fill: none;
	stroke: #fff;
}

/* A picture with a set shape is placed inside its panel: its width is --abp-scale of the panel's, and its corner
   --abp-x, --abp-y from the panel's (centred when they are not given), so a design's crop can be repeated exactly. */
.abp .abp-article .abp-picture--framed .abp-picture__img {
	position: absolute;
	left: var(--abp-x, 50%);
	top: var(--abp-y, 50%);
	width: var(--abp-scale, 100%);
	max-width: none;
	height: auto;
	max-height: none;
	transform: translate(calc(-1 * var(--abp-t, 50%)), calc(-1 * var(--abp-t, 50%)));
}

.abp .abp-article .abp-picture--framed.abp-picture--cover .abp-picture__img {
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: none;
}


/* ======================================================================================================
   The home page (designs: Homepage-pre-auction-hero and Homepage-live-auction-hero). Sizes measured from
   the designs' render on 29 Oct 2026.
   ====================================================================================================== */

/* A page of blocks only: they sit 120px apart. */
.abp .abp-article--page {
	padding-top: 0;
	padding-bottom: 0;
}

.abp-article--page > .abp-block {
	margin-top: 120px;
	margin-bottom: 0;
}

.abp-article--page > .abp-hero {
	margin-top: 1px;
}

.abp-article--page > .abp-hero + .abp-stories {
	margin-top: 136px;
}

/* ---- Hero ---- */

.abp-hero {
	position: relative;
	border-radius: 0 0 140px 0;
	background: var(--abp-navy);
	color: #fff;
	overflow: hidden;
}

.abp-hero__slide {
	display: none;
	grid-template-columns: minmax(0, 1068fr) minmax(0, 732fr);
	min-height: 800px;
}

.abp-hero:not([data-abp-ready]) .abp-hero__slide:first-child,
.abp-hero__slide.is-active {
	display: grid;
}

.abp-hero__media {
	position: relative;
	overflow: hidden;
	background: #000;
}

.abp-block img.abp-hero__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.abp-hero__media::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 240px;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
	pointer-events: none;
}

.abp-hero__panel {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	/* The design's 138px at 1800px wide, narrowing with the window so the title keeps its room. */
	padding: 130px 60px 60px clamp(40px, 100vw * 138 / 1800, 138px);
}

.abp .abp-hero__date {
	margin: 0 0 20px;
	font-size: 14px;
	line-height: 17px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #fff;
}

.abp-block .abp-hero__title {
	max-width: 460px;
	margin: 0 0 20px;
	font-family: var(--abp-font);
	font-size: clamp(36px, 100vw * 52 / 1800, 52px);
	line-height: 1.19;
	font-weight: 300;
	letter-spacing: -0.02em;
	overflow-wrap: break-word;
	color: #fff;
}

.abp .abp-hero__text {
	max-width: 460px;
	margin: 0 0 80px;
	font-size: 20px;
	line-height: 28px;
	font-weight: 300;
	color: #fff;
}

.abp-hero .abp-buttons {
	gap: 21px;
}

.abp-hero .abp-btn--outline {
	color: #fff !important;
}

.abp-hero .abp-btn .abp-icon {
	width: 17px;
	height: 14px;
	fill: currentColor;
}

.abp-hero__tabs {
	position: absolute;
	bottom: 43px;
	/* Kept over the picture: the panel takes 732/1800 of the hero, plus a gap before it. */
	right: calc(100% * 732 / 1800 + 40px);
	left: 76px;
	z-index: 2;
	display: flex;
	gap: 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.abp-hero__tab {
	flex: 0 1 282px;
	min-width: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.abp-block .abp-hero__tab-btn {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none !important;
	color: #fff !important;
	font-family: var(--abp-font);
	font-size: 14px;
	line-height: 14px;
	font-weight: 400;
	text-align: left;
	cursor: pointer;
}

.abp-hero__progress {
	position: relative;
	display: block;
	height: 2px;
	margin-bottom: 22px;
	background: rgba(255, 255, 255, 0.4);
}

.abp-hero__progress::after {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: 0;
	background: #fff;
}

.abp-hero__tab-btn[aria-current="true"] .abp-hero__progress::after {
	width: 100%;
	animation: abp-hero-progress var(--abp-hero-time, 7s) linear;
}

@keyframes abp-hero-progress {
	from {
		width: 0;
	}

	to {
		width: 100%;
	}
}

/* autoplay="off": the current tab's line stays full. */
.abp-hero[data-abp-autoplay="off"] .abp-hero__tab-btn[aria-current="true"] .abp-hero__progress::after {
	animation: none;
}

@media (prefers-reduced-motion: reduce) {
	.abp-hero__tab-btn[aria-current="true"] .abp-hero__progress::after {
		animation: none;
	}
}

@media (max-width: 1023px) {
	.abp-hero {
		border-radius: 0 0 72px 0;
	}

	.abp-hero__slide {
		grid-template-columns: minmax(0, 1fr);
		min-height: 0;
	}

	.abp-hero__media {
		min-height: 360px;
	}

	.abp-hero__panel {
		padding: 40px 24px 120px;
	}

	.abp-block .abp-hero__title {
		font-size: 36px;
		line-height: 44px;
	}

	.abp .abp-hero__text {
		margin-bottom: 40px;
	}

	.abp-hero__tabs {
		right: 24px;
		bottom: 24px;
		left: 24px;
		gap: 12px;
	}

	.abp-hero__tab {
		width: auto;
		flex: 1 1 0;
	}

	.abp-hero__tab-label {
		display: none;
	}
}

/* ---- Auction tiles ---- */

.abp-auctions > .abp-block__label {
	margin: 0 0 72px;
	line-height: 26px;
}

.abp-auctions__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 19px;
}

.abp-auctile {
	display: grid;
	grid-template-columns: 228px minmax(0, 1fr);
	min-height: 286px;
	border: 1px solid #e3e3e6;
	border-radius: var(--abp-radius);
	background: #fff;
	color: var(--abp-navy);
	overflow: hidden;
}

.abp-auctile__media {
	position: relative;
	background: var(--abp-light);
}

.abp-block img.abp-auctile__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.abp-auctile__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 20px 30px;
}

.abp-block .abp-auctile__title {
	margin: 26px 0 0;
	font-family: var(--abp-font);
	font-size: 20px;
	line-height: 28px;
	font-weight: 400;
	letter-spacing: -0.02em;
	color: var(--abp-navy);
}

.abp .abp-auctile__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0 20px;
	margin: 8px 0 20px;
	font-size: 14px;
	line-height: 20px;
	font-weight: 300;
	color: var(--abp-navy);
}

.abp-block .abp-auctile__btn {
	min-height: 40px;
	margin-top: auto;
	flex-shrink: 0;
	padding: 0 24px;
	font-size: 10px;
}

.abp-block .abp-auctile__btn .abp-icon {
	width: 14px;
	height: 12px;
	fill: currentColor;
}

.abp-auctions__foot {
	display: flex;
	justify-content: center;
	margin-top: 66px;
}

/* Picture beside the text only where the text keeps room for the title: below that the three
   tiles stay in a row with the picture on top, and on narrow screens they stack. */
@media (max-width: 1679px) {
	.abp-auctile {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: auto 1fr;
		min-height: 0;
	}

	.abp-auctile__media {
		aspect-ratio: 3 / 2;
	}
}

@media (max-width: 899px) {
	.abp-auctions__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.abp-auctile {
		grid-template-columns: 228px minmax(0, 1fr);
		grid-template-rows: none;
		min-height: 286px;
	}

	.abp-auctile__media {
		aspect-ratio: auto;
	}
}

@media (max-width: 767px) {
	.abp-auctile {
		grid-template-columns: 120px minmax(0, 1fr);
		min-height: 0;
	}

	.abp-auctile__body {
		padding: 16px;
	}
}

/* ---- Three picture panels on a grey band ---- */

.abp-article > .abp-panels {
	grid-column: full;
	margin-bottom: 0;
	padding: 120px 0 296px;
	background: var(--abp-light);
}

.abp-panels__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	width: min(1648px, 100% - 2 * var(--abp-gutter));
	margin: 0 auto;
}

.abp-panel {
	display: flex;
	flex-direction: column;
	min-height: 978px;
	border-radius: var(--abp-radius);
	background: var(--abp-navy);
	color: #fff;
	overflow: hidden;
}

.abp-panel__media {
	position: relative;
	flex: 0 0 630px;
	background: #000;
}

.abp-block img.abp-panel__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.abp-panel__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	padding: 30px 40px 40px;
}

.abp-block .abp-panel__title {
	margin: 0 0 20px;
	font-family: var(--abp-font);
	font-size: 52px;
	line-height: 60px;
	font-weight: 300;
	letter-spacing: -0.02em;
	color: #fff;
}

.abp .abp-panel__text {
	margin: 0 0 40px;
	font-size: 20px;
	line-height: 28px;
	font-weight: 300;
	color: #fff;
}

.abp-panel .abp-btn--outline,
.abp-auction .abp-btn--outline {
	color: #fff !important;
}

/* The buttons sit at the foot of each panel, so they line up across the row whatever the text's length. */
.abp-panel__body > .abp-buttons {
	margin-top: auto;
}

@media (max-width: 1279px) {
	.abp-panels__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.abp-panel {
		min-height: 0;
	}

	.abp-panel__media {
		flex-basis: 420px;
	}
}

/* ---- Four link cards ---- */

.abp-panels + .abp-links {
	margin-top: -176px;
	position: relative;
	z-index: 1;
}

.abp-links__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 356px));
	gap: 20px;
	justify-content: center;
}

.abp-block .abp-linkcard {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: 364px;
	padding: 52px 20px 0;
	border: 1px solid #e3e3e6;
	border-radius: var(--abp-radius);
	background-color: #fff !important; /* The theme's link rule (see Link colours) makes links transparent. */
	text-align: center;
	color: var(--abp-navy) !important;
	text-decoration: none !important;
}

.abp-linkcard__icon .abp-icon--big {
	width: 80px;
	height: 80px;
}

.abp-linkcard__small {
	margin-top: 34px;
	font-size: 14px;
	line-height: 20px;
	font-weight: 300;
}

.abp-linkcard__title {
	margin-top: 8px;
	font-size: 20px;
	line-height: 28px;
	font-weight: 400;
	letter-spacing: -0.02em;
}

.abp-linkcard__link {
	margin-top: 16px;
	padding-bottom: 2px;
	border-bottom: 1px solid var(--abp-purple);
	font-size: 10px;
	line-height: 14px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--abp-purple);
}

@media (max-width: 1279px) {
	.abp-links__grid {
		grid-template-columns: repeat(2, minmax(0, 356px));
	}
}

@media (max-width: 599px) {
	.abp-links__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---- Latest stories as the designs measure them ---- */

.abp-stories > .abp-block__label {
	margin: 0 0 72px;
	line-height: 26px;
}

.abp-story--big .abp-story__body {
	gap: 0;
	padding: 40px;
}

.abp-block .abp-story--big .abp-story__title {
	margin-top: 22px;
	font-size: 52px;
	line-height: 62px;
}

.abp-block .abp-story--big .abp-story__text {
	max-width: 620px;
	margin-top: 28px;
	font-size: 20px;
	line-height: 28px;
}

.abp-story--big .abp-btn {
	margin-top: 38px;
}

.abp-block .abp-story--big .abp-eyebrow {
	font-size: 14px;
	letter-spacing: 0.1em;
	color: #fff;
}

.abp-story--small {
	grid-template-columns: minmax(0, 420fr) minmax(0, 470fr);
	min-height: 380px;
}

.abp-story--small .abp-story__body {
	gap: 0;
	padding: 30px;
}

.abp-block .abp-story--small .abp-eyebrow,
.abp-block .abp-story--text .abp-eyebrow {
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 0.1em;
}

.abp-block .abp-story--small .abp-story__title,
.abp-block .abp-story--text .abp-story__title {
	min-height: 144px;
	margin: 16px 0 36px;
	font-size: 40px;
	line-height: 48px;
}

.abp-story--small .abp-btn,
.abp-story--text .abp-btn {
	margin-top: 0;
}

.abp-block .abp-btn.abp-btn--small {
	min-height: 38px;
	padding: 0 16px;
}

.abp-stories--v-a .abp-story--small {
	border-color: transparent;
}

/* Home page: section labels are 20px (the designs' "LATEST STORIES" is 200px wide), and the big story's text keeps
   the 681px column the design gives it, so its title breaks after "our". */
.abp-article--page .abp-block__label {
	font-size: 20px;
	line-height: 26px;
	font-weight: 500;
}

.abp-block .abp-story--big .abp-story__title {
	max-width: 681px;
}

.abp-block .abp-story--big .abp-story__text {
	max-width: 681px;
}


/* ---- Story cards written out one by one (editorial modules) ---- */

/* The cards flow into two columns, left to right: a big or tall card takes two rows, a small card one. */
.abp-stories--cards .abp-stories__grid {
	grid-auto-rows: minmax(380px, auto);
}

.abp-stories--cards .abp-story--big,
.abp-stories--cards .abp-story--tall {
	grid-row: span 2;
	min-height: 780px;
}

.abp-stories--cards.abp-stories--pair .abp-story--big {
	grid-row: auto;
}

.abp-stories--cards .abp-story--small {
	min-height: 380px;
}

.abp-stories--cards .abp-story--text {
	grid-column: span 1;
	grid-row: auto;
	min-height: 0;
	margin-top: 40px;
}

/* Tall: the picture on a grey panel above, the text on white below. */
.abp-story--tall {
	grid-column: span 2;
	display: flex;
	flex-direction: column;
	border: 1px solid #e3e3e6;
	border-radius: var(--abp-radius);
	background: #fff;
	color: var(--abp-navy);
}

.abp-story--tall .abp-story__media {
	position: relative;
	flex: 0 0 363px;
	background: var(--abp-media);
}

.abp-story--tall .abp-story__media img.abp-story__img {
	position: absolute;
	inset: 0;
}

.abp-story--tall .abp-story__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 30px 40px 40px;
}

.abp-block .abp-story--tall .abp-story__title {
	margin-top: 22px;
	font-size: 52px;
	line-height: 62px;
}

.abp-block .abp-story--tall .abp-story__text {
	max-width: 681px;
	margin-top: 28px;
	font-size: 20px;
	line-height: 28px;
}

.abp-story--tall .abp-btn {
	margin-top: 38px;
}

.abp-block .abp-story--tall .abp-eyebrow {
	font-size: 14px;
	letter-spacing: 0.1em;
}

/* Variant a: the big cards' "Read more" is outlined in white, and the cards beside it have no border. */
.abp-stories--v-a .abp-story--tall {
	border-color: transparent;
}

@media (max-width: 1023px) {
	.abp-stories--cards .abp-story--big,
	.abp-stories--cards .abp-story--tall {
		grid-row: auto;
		min-height: 560px;
	}

	.abp-story--tall {
		grid-column: span 2;
	}
}

@media (max-width: 767px) {
	.abp-story--tall {
		grid-column: auto;
	}

	.abp-block .abp-story--tall .abp-story__title {
		font-size: 32px;
		line-height: 38px;
	}
}

.abp-block .abp-btn .abp-icon--plus {
	width: 16px;
	height: 16px;
}

/* White studio backgrounds take the grey of the panel, as on the lot cards. */
.abp-story--tall .abp-story__media img.abp-story__img {
	mix-blend-mode: multiply;
}

/* The overlay lead card's heading keeps the 536px column the design gives it (it breaks after "people"). */
.abp-feature--overlay .abp-feature__title {
	max-width: 536px;
}

/* ---- Phone widths: the larger sizes measured from the 1920px designs come down ---- */
@media (max-width: 1023px) {
	.abp-stories--cards .abp-stories__grid {
		grid-auto-rows: auto;
	}
}

@media (max-width: 767px) {
	.abp-block .abp-story--big .abp-story__title,
	.abp-block .abp-story--tall .abp-story__title {
		margin-top: 12px;
		font-size: 32px;
		line-height: 38px;
	}

	.abp-block .abp-story--big .abp-story__text,
	.abp-block .abp-story--tall .abp-story__text {
		margin-top: 16px;
		font-size: 16px;
		line-height: 24px;
	}

	.abp-block .abp-story--small .abp-story__title,
	.abp-block .abp-story--text .abp-story__title {
		min-height: 0;
		margin: 8px 0 16px;
		font-size: 24px;
		line-height: 30px;
	}

	.abp-story--small,
	.abp-stories--cards .abp-story--small,
	.abp-stories--cards .abp-story--big,
	.abp-stories--cards .abp-story--tall {
		min-height: 0;
	}

	.abp-story--big {
		min-height: 520px;
	}

	.abp-story--small .abp-story__media {
		min-height: 200px;
	}

	.abp-story--tall .abp-story__media {
		flex-basis: 220px;
	}

	.abp-story--tall .abp-story__body,
	.abp-story--big .abp-story__body {
		padding: 24px;
	}

	.abp-stories--cards .abp-story--text {
		margin-top: 24px;
	}

	.abp-article--page > .abp-block {
		margin-top: 72px;
	}

	.abp-article--page > .abp-hero + .abp-stories {
		margin-top: 72px;
	}

	.abp-auctions > .abp-block__label,
	.abp-stories > .abp-block__label {
		margin-bottom: 32px;
	}

	.abp-article > .abp-panels {
		padding: 72px 0 140px;
	}

	.abp-block .abp-panel__title {
		font-size: 36px;
		line-height: 44px;
	}

	.abp-panel__media {
		flex-basis: 320px;
	}

	.abp-panel__body {
		padding: 24px;
	}

	.abp-block .abp-linkcard {
		min-height: 0;
		padding: 32px 20px;
	}

	.abp-panels + .abp-links {
		margin-top: -100px;
	}

	.abp .abp-article__intro p {
		margin-bottom: 28px;
		font-size: 22px;
		line-height: 32px;
	}

	.abp .abp-article > p,
	.abp .abp-article > ul,
	.abp .abp-article > ol {
		font-size: 18px;
		line-height: 26px;
		margin-bottom: 20px;
	}

	.abp-picture__caption {
		margin-top: 12px;
		font-size: 16px;
		line-height: 24px;
	}

	.abp-block .abp-picture__play {
		width: 64px;
		height: 64px;
		margin: -32px 0 0 -32px;
	}
}

/* ---- Lot pictures that are photos (the lot's Picture setting) ----
   Cut-outs on white are fitted in whole on the grey; a photo fills its frame instead, from its middle. */

.abp-block .abp-media--photo img[class] {
	padding: 0;
	object-fit: cover;
	object-position: 50% 50%;
	mix-blend-mode: normal;
}
