/*
 * Components — the repeating pieces of the approved design.
 *
 * Each block here maps to a shape that recurs across the .dc.html pages, so a
 * pattern composes classes rather than restating inline style.
 */

/* --- eyebrow ---------------------------------------------------------------
 * "01 — WHO WE ARE". Mono, wide tracking, red on light. The design uses rose
 * on ink and gold where the section is about awards or certification.
 */
.ants-eyebrow {
	display: block;
	margin-bottom: var(--ants-gap-sm);
	font-family: var(--ants-font-mono);
	font-size: var(--ants-eyebrow);
	font-weight: 400;
	letter-spacing: var(--ants-track-mono);
	text-transform: uppercase;
	color: var(--ants-red-deep);
}
.ants-dark .ants-eyebrow,
.ants-dark-2 .ants-eyebrow { color: var(--ants-rose); }
.ants-eyebrow--gold { color: var(--ants-gold-deep); }
.ants-dark .ants-eyebrow--gold,
.ants-dark-2 .ants-eyebrow--gold { color: var(--ants-gold); }

/* Small mono label — tags, codes, column heads. Tighter tracking than eyebrow. */
.ants-label {
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-text-mute);
}
.ants-dark .ants-label,
.ants-dark-2 .ants-label { color: var(--ants-on-dark-mute); }

/* --- lead and serif accents ------------------------------------------------ */
.ants-lead {
	font-size: var(--ants-lead);
	line-height: var(--ants-lh-lead);
	color: var(--ants-text-lead);
}
.ants-dark .ants-lead,
.ants-dark-2 .ants-lead { color: var(--ants-on-dark-lead); }

/* The italic serif word that closes a display heading. */
.ants-accent {
	font-family: var(--ants-font-serif);
	font-style: italic;
	font-weight: 400;
	color: var(--ants-rose);
}
.ants-serif {
	font-family: var(--ants-font-serif);
	font-size: 1.031rem;
	line-height: 1.56;
	color: var(--ants-text-soft);
}

/* --- buttons ---------------------------------------------------------------
 * Square corners, generous padding, no shadow. Minimum 44px target height.
 */
.ants-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: var(--ants-target);
	padding: 16px 30px;
	border: 1px solid transparent;
	font-family: inherit;
	font-size: 0.969rem;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--ants-transition), border-color var(--ants-transition), color var(--ants-transition);
}

.ants-btn--primary { background: var(--ants-red); color: #fff; }
.ants-btn--primary:hover { background: var(--ants-red-deep); color: #fff; }

.ants-btn--ink { background: var(--ants-ink-2); color: #fff; }
.ants-btn--ink:hover { background: var(--ants-ink); color: #fff; }

.ants-btn--ghost {
	background: none;
	border-color: var(--ants-rule-3);
	color: var(--ants-text);
	font-weight: 500;
}
.ants-btn--ghost:hover { border-color: var(--ants-ink-2); color: var(--ants-text); }

.ants-dark .ants-btn--ghost,
.ants-dark-2 .ants-btn--ghost {
	border-color: rgba(255, 255, 255, 0.28);
	color: var(--ants-paper);
}
.ants-dark .ants-btn--ghost:hover,
.ants-dark-2 .ants-btn--ghost:hover {
	border-color: rgba(255, 255, 255, 0.7);
	color: var(--ants-paper);
}

.ants-btns { display: flex; flex-wrap: wrap; gap: 14px; }

/*
 * Text link with a red rule under it — the design's tertiary action.
 * "READ OUR FULL STORY →"
 */
.ants-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	align-self: flex-start;
	padding-bottom: 5px;
	border-bottom: 1px solid var(--ants-red);
	font-family: var(--ants-font-mono);
	font-size: 0.75rem;
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
}
/* Long link labels wrap on narrow screens rather than push the page sideways. */
@media (max-width: 599px) {
	.ants-link { max-width: 100%; white-space: normal; }
}
.ants-dark .ants-link,
.ants-dark-2 .ants-link { border-bottom-color: rgba(255, 255, 255, 0.3); }
.ants-dark .ants-link:hover,
.ants-dark-2 .ants-link:hover { border-bottom-color: var(--ants-red); }

/* --- credentials bar -------------------------------------------------------
 * The dark strip of metrics under the hero. Columns divided by a right rule,
 * with the last divider suppressed.
 */
.ants-metrics {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}
.ants-metrics__item {
	display: flex;
	flex-direction: column;
	gap: 7px;
	padding: 34px 26px 36px;
	border-inline-end: 1px solid var(--ants-rule-dark);
}
.ants-metrics__item:last-child { border-inline-end: 0; }
.ants-metrics__value {
	font-size: 1.875rem;
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--ants-paper);
}
.ants-metrics__label {
	font-family: var(--ants-font-mono);
	font-size: var(--ants-eyebrow);
	letter-spacing: var(--ants-track-tag);
	line-height: 1.6;
	text-transform: uppercase;
	color: var(--ants-on-dark-mute);
}

/* --- cards ----------------------------------------------------------------
 * Inside a hairline grid the card carries padding but no border of its own.
 */
.ants-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 30px 26px 34px;
	transition: background var(--ants-transition);
}
.ants-card > :last-child { margin-bottom: 0; }
.ants-card__body { font-size: var(--ants-sm); line-height: 1.58; color: var(--ants-text-mute); }
.ants-dark .ants-card__body,
.ants-dark-2 .ants-card__body { color: var(--ants-on-dark-soft); }

/* Push the closing action to the foot so cards of unequal length still align. */
.ants-card__cta {
	margin-block-start: auto;
	padding-block-start: 4px;
	font-family: var(--ants-font-mono);
	font-size: var(--ants-eyebrow);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-red-deep);
}
.ants-dark .ants-card__cta,
.ants-dark-2 .ants-card__cta { color: var(--ants-rose); }

a.ants-card { color: inherit; text-decoration: none; }
a.ants-card:hover { background: var(--ants-paper); color: inherit; }
.ants-dark a.ants-card:hover,
.ants-dark-2 a.ants-card:hover { background: rgba(255, 255, 255, 0.03); }

/*
 * Bordered card — used where cards sit on a spaced grid rather than a hairline
 * one, so each needs its own outline.
 */
.ants-tile {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 26px 22px 28px;
	border: 1px solid var(--ants-rule-2);
	color: inherit;
	text-decoration: none;
	transition: border-color var(--ants-transition), background var(--ants-transition);
}
.ants-tile:hover { border-color: var(--ants-text); color: inherit; }
.ants-dark .ants-tile,
.ants-dark-2 .ants-tile { border-color: rgba(255, 255, 255, 0.16); }
.ants-dark .ants-tile:hover,
.ants-dark-2 .ants-tile:hover {
	border-color: var(--ants-red-deep);
	background: rgba(255, 255, 255, 0.03);
}
.ants-tile__tag {
	margin-block-start: auto;
	padding-block-start: 6px;
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-text-mute);
}
.ants-dark .ants-tile__tag,
.ants-dark-2 .ants-tile__tag { color: var(--ants-on-dark-mute); }

/* --- media frames ----------------------------------------------------------
 * Every image in the design sits in a 1px frame. Aspect ratio is set inline per
 * use so the box reserves space before the image decodes.
 */
.ants-frame {
	border: 1px solid var(--ants-rule-2);
	overflow: hidden;
	background: var(--ants-tinted);
}
.ants-frame img { width: 100%; height: 100%; object-fit: cover; }
.ants-dark .ants-frame,
.ants-dark-2 .ants-frame {
	border-color: rgba(255, 255, 255, 0.16);
	background: rgba(255, 255, 255, 0.02);
}
.ants-frame--contain { background: #fff; }
.ants-frame--contain img { object-fit: contain; }

/* --- chips and flags ------------------------------------------------------- */
.ants-chip {
	display: inline-block;
	padding: 7px 11px;
	border: 1px solid var(--ants-rule-3);
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ants-text-soft);
	text-decoration: none;
	transition: border-color var(--ants-transition), color var(--ants-transition);
}
a.ants-chip:hover { border-color: var(--ants-red-deep); color: var(--ants-red-deep); }
.ants-dark .ants-chip,
.ants-dark-2 .ants-chip { border-color: var(--ants-rule-dark-3); color: var(--ants-on-dark); }
.ants-dark a.ants-chip:hover,
.ants-dark-2 a.ants-chip:hover { border-color: var(--ants-red); color: var(--ants-paper); }

.ants-chips { display: flex; flex-wrap: wrap; gap: 8px; }

/*
 * Dashed flag — the design's device for "held back until evidenced". It is a
 * visible editorial state, not a styling accident.
 */
.ants-flag {
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding: 12px 15px;
	border: 1px dashed var(--ants-rule-dash);
	font-size: var(--ants-xs);
	line-height: 1.6;
	color: var(--ants-text-soft);
}
.ants-flag__tag {
	flex: none;
	font-family: var(--ants-font-mono);
	font-size: 0.594rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ants-red-deep);
}
.ants-dark .ants-flag,
.ants-dark-2 .ants-flag {
	border-color: rgba(255, 255, 255, 0.3);
	color: var(--ants-on-dark-soft);
}
.ants-dark .ants-flag__tag,
.ants-dark-2 .ants-flag__tag { color: var(--ants-gold); }

/* --- rule lists ------------------------------------------------------------
 * Rows separated by a top rule: numbered commitments, label/value pairs,
 * country lists. The design uses this shape more than any other.
 */
.ants-rows { display: flex; flex-direction: column; }

.ants-row {
	display: grid;
	grid-template-columns: 32px 1fr;
	gap: 16px;
	align-items: start;
	padding-block: 17px;
	border-top: 1px solid var(--ants-rule-2);
}
.ants-dark .ants-row,
.ants-dark-2 .ants-row { border-top-color: var(--ants-rule-dark-2); }
.ants-row__n {
	padding-block-start: 3px;
	font-family: var(--ants-font-mono);
	font-size: 0.688rem;
	color: var(--ants-text-mute);
}
.ants-dark .ants-row__n,
.ants-dark-2 .ants-row__n { color: var(--ants-on-dark-mute); }
.ants-row__title { font-size: 0.969rem; font-weight: 600; letter-spacing: -0.008em; }
.ants-row__body { margin: 5px 0 0; font-size: var(--ants-sm); line-height: 1.55; color: var(--ants-text-soft); }
.ants-dark .ants-row__body,
.ants-dark-2 .ants-row__body { color: var(--ants-on-dark-soft); }

/* label left, value right */
.ants-pair {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	padding-block: 14px;
	border-top: 1px solid var(--ants-rule-2);
}
.ants-dark .ants-pair,
.ants-dark-2 .ants-pair { border-top-color: var(--ants-rule-dark-2); }
.ants-pair__k { font-size: 0.938rem; }
.ants-pair__v {
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ants-text-mute);
	text-align: end;
}
.ants-dark .ants-pair__v,
.ants-dark-2 .ants-pair__v { color: var(--ants-on-dark-mute); }

/* two-up column list, e.g. markets served */
.ants-cols-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); column-gap: 28px; }

/* --- awards ----------------------------------------------------------------
 * A gold rail runs down the year column, with a node at each award; then the
 * photograph, the title and the awarding body. The photograph's link is
 * stretched over the row, so the whole row opens the lightbox.
 */
.ants-award {
	--ants-award-year: 0px;
	position: relative;
	display: grid;
	grid-template-columns: 96px 1fr;
	grid-template-areas: "thumb year" "thumb text";
	column-gap: 16px;
	row-gap: 4px;
	align-items: start;
	padding-block: 16px;
	/* The rule starts at the photograph, so the rail runs through unbroken. */
	background: linear-gradient(var(--ants-rule), var(--ants-rule)) right bottom / calc(100% - var(--ants-award-year)) 1px no-repeat;
}
@media (min-width: 600px) {
	.ants-award {
		--ants-award-year: 94px;
		grid-template-columns: 72px 132px 1fr;
		grid-template-areas: "year thumb text";
		column-gap: 22px;
		align-items: center;
		padding-block: 18px;
	}
	.ants-award::before,
	.ants-award::after {
		content: "";
		position: absolute;
		pointer-events: none;
	}
	/* rail */
	.ants-award::before {
		inset-block: 0;
		inset-inline-start: 4px;
		width: 1px;
		background: rgba(201, 162, 39, 0.45);
	}
	.ants-award:first-of-type::before { inset-block-start: 50%; }
	.ants-award:last-of-type::before  { inset-block-end: 50%; }
	.ants-award:only-of-type::before  { display: none; }
	/* node */
	.ants-award::after {
		inset-block-start: calc(50% - 4.5px);
		inset-inline-start: 0;
		width: 9px;
		height: 9px;
		background: var(--ants-paper);
		border: 1px solid var(--ants-gold);
		transition: background var(--ants-transition);
	}
	.ants-tinted .ants-award::after { background: var(--ants-tinted); }
	.ants-award:hover::after,
	.ants-award:focus-within::after { background: var(--ants-gold); }
}
.ants-award__year {
	grid-area: year;
	font-family: var(--ants-font-mono);
	font-size: 0.813rem;
	letter-spacing: 0.04em;
	color: var(--ants-gold-deep);
}
@media (min-width: 600px) {
	.ants-award__year { padding-inline-start: 22px; font-size: 0.938rem; letter-spacing: 0.02em; }
}
.ants-dark .ants-award__year,
.ants-dark-2 .ants-award__year { color: var(--ants-gold); }
.ants-award__thumb {
	grid-area: thumb;
	display: block;
	padding: 4px;
	background: #fff;
	border: 1px solid var(--ants-rule-2);
	transition: border-color var(--ants-transition);
}
.ants-award__thumb .ants-zoomable { aspect-ratio: 4 / 3; background: var(--ants-tinted); }
.ants-award__thumb img { height: 100%; object-fit: cover; }
.ants-award__text { grid-area: text; min-width: 0; }
.ants-award__title {
	margin: 0 0 5px;
	font-size: 1.094rem;
	line-height: 1.32;
	letter-spacing: -0.01em;
	font-weight: 600;
	transition: color var(--ants-transition);
}
.ants-award__org { font-size: var(--ants-sm); color: var(--ants-text-mute); }
.ants-dark .ants-award__org,
.ants-dark-2 .ants-award__org { color: var(--ants-on-dark-mute); }

/* Beside the ISO card, the first award starts level with the card's top edge. */
.ants-split > .ants-awards > .ants-award:first-child { padding-block-start: 0; }

/* The photograph's link is stretched over the row, so the whole row opens it. */
a.ants-award__thumb { cursor: zoom-in; }
a.ants-award__thumb::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.ants-award:has(a.ants-award__thumb:hover) .ants-award__thumb,
.ants-award:focus-within .ants-award__thumb { border-color: var(--ants-gold); }
.ants-award:has(a.ants-award__thumb:hover) .ants-award__title { color: var(--ants-gold-deep); }
.ants-dark .ants-award:has(a.ants-award__thumb:hover) .ants-award__title,
.ants-dark-2 .ants-award:has(a.ants-award__thumb:hover) .ants-award__title { color: var(--ants-gold); }

/* --- zoomable photograph ------------------------------------------------------
 * Any image that opens in the lightbox (assets/js/lightbox.js): a slow zoom and an
 * expand chip on hover and focus. The chip stays visible on touch screens, where
 * there is no hover to reveal it.
 */
.ants-zoomable { position: relative; display: block; overflow: hidden; }
.ants-zoomable img {
	display: block;
	width: 100%;
	transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.ants-zoom {
	position: absolute;
	inset-block-end: 0;
	inset-inline-end: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	background: var(--ants-ink);
	color: var(--ants-gold);
	opacity: 0;
	transform: translateY(4px);
	transition: opacity var(--ants-transition), transform var(--ants-transition);
}
.ants-award:has(a.ants-award__thumb:hover) .ants-zoomable img,
.ants-award:focus-within .ants-zoomable img,
.ants-frame--zoom:hover .ants-zoomable img,
.ants-frame--zoom:focus-visible .ants-zoomable img { transform: scale(1.06); }
.ants-award:has(a.ants-award__thumb:hover) .ants-zoom,
.ants-award:focus-within .ants-zoom,
.ants-frame--zoom:hover .ants-zoom,
.ants-frame--zoom:focus-visible .ants-zoom { opacity: 1; transform: none; }
@media (hover: none) {
	.ants-zoom { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.ants-zoomable img { transition: none; transform: none !important; }
}

/* Awards page: the large photograph frame opens the lightbox too. */
.ants-frame--zoom { display: block; padding: 16px; cursor: zoom-in; transition: border-color var(--ants-transition); }
.ants-frame--zoom:hover { border-color: var(--ants-gold); }
.ants-frame--zoom img { height: auto; }
.ants-frame--zoom .ants-zoom { width: 34px; height: 34px; }

/* --- case study card ------------------------------------------------------- */
.ants-case {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--ants-rule);
	background: var(--ants-paper);
	color: inherit;
	text-decoration: none;
	transition: border-color var(--ants-transition);
}
.ants-case:hover { border-color: var(--ants-text-mute); color: inherit; }
.ants-case__media {
	aspect-ratio: 16 / 10;
	border-bottom: 1px solid var(--ants-rule);
	overflow: hidden;
	background: var(--ants-tinted);
}
.ants-case__media img { width: 100%; height: 100%; object-fit: cover; }
.ants-case__body { display: flex; flex-direction: column; gap: 12px; flex: 1; padding: 24px 24px 28px; }
.ants-case__outcome {
	margin-block-start: auto;
	padding-block-start: 16px;
	border-top: 1px solid var(--ants-rule);
	font-family: var(--ants-font-serif);
	font-size: 0.969rem;
	line-height: 1.45;
	color: var(--ants-text);
}

/* --- closing CTA band ------------------------------------------------------
 * The one place red covers a full band. White text on #E1251B is 4.6:1, so
 * body copy sits at full opacity — never tinted down.
 */
.ants-cta {
	background: var(--ants-red);
	color: #fff;
}
.ants-cta .ants-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ants-gap-xl);
	flex-wrap: wrap;
	padding-block: 84px 88px;
}
.ants-cta h2 {
	margin: 0 0 16px;
	max-width: 700px;
	font-size: clamp(1.875rem, 1.2rem + 2.6vw, 2.875rem);
	line-height: 1.08;
	letter-spacing: -0.032em;
	color: #fff;
}
.ants-cta p { margin: 0; max-width: 700px; font-size: 1.125rem; line-height: 1.58; color: #fff; }
.ants-cta__actions { display: flex; flex-direction: column; gap: 12px; }
.ants-cta__alt {
	padding: 6px;
	font-family: var(--ants-font-mono);
	font-size: 0.781rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-align: center;
	color: #fff;
}
.ants-cta__alt:hover { color: #fff; text-decoration: underline; }
.ants-cta .ants-btn--ink:hover { background: #000; }

/* --- breadcrumb ------------------------------------------------------------ */
.ants-crumb {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: var(--ants-gap-sm);
	font-family: var(--ants-font-mono);
	font-size: 0.688rem;
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-on-dark-mute);
}
.ants-crumb a { color: var(--ants-on-dark-mute); }
.ants-crumb a:hover { color: var(--ants-paper); }
.ants-crumb [aria-current] { color: var(--ants-on-dark); }

/* --- hero stat ticks -------------------------------------------------------
 * The red-ruled facts beside a page hero.
 */
.ants-ticks { display: flex; flex-wrap: wrap; gap: 26px; }
.ants-tick {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 3px 0 3px 16px;
	border-inline-start: 2px solid var(--ants-red);
}
.ants-tick--gold { border-inline-start-color: var(--ants-gold); }
.ants-tick__v { font-size: 1.5rem; font-weight: 600; letter-spacing: -0.02em; }
.ants-tick__k {
	font-family: var(--ants-font-mono);
	font-size: 0.625rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--ants-on-dark-mute);
}

/* --- badge strip ----------------------------------------------------------- */
.ants-badges {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	padding: 9px 16px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	font-family: var(--ants-font-mono);
	font-size: 0.719rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--ants-on-dark-soft);
}
.ants-badges__sep { width: 1px; height: 12px; background: rgba(255, 255, 255, 0.4); flex: none; }
.ants-badges strong { color: var(--ants-gold); font-weight: 400; }

/* --- quote ----------------------------------------------------------------- */
.ants-quote {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 28px 26px 30px;
	border: 1px solid var(--ants-rule-2);
}
.ants-quote blockquote { font-size: 1.094rem; }
figure.ants-quote { margin: 0; background: var(--ants-paper); }
.ants-quote blockquote p { margin: 0; }
.ants-quote blockquote p::before { content: "\201C"; }
.ants-quote blockquote p::after { content: "\201D"; }
.ants-quote figcaption {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-top: auto;
	padding-top: 16px;
	border-top: 1px solid var(--ants-rule);
}
.ants-quote figcaption strong { font-size: var(--ants-sm); font-weight: 600; }
.ants-quote figcaption span {
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-text-mute);
}

/* --- outcome figures (signed-off case-study results) ----------------------- */
.ants-outcomes {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 18px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ants-outcomes li { display: flex; flex-direction: column; gap: 4px; margin: 0; }
.ants-outcomes strong {
	font-size: 1.625rem;
	line-height: 1.1;
	letter-spacing: var(--ants-track-head);
	font-weight: 600;
	color: var(--ants-red-deep);
}
.ants-outcomes span { font-size: var(--ants-xs); line-height: 1.45; color: var(--ants-text-body); }
.ants-case__outcome strong { font-weight: 600; }

/* --- forms ----------------------------------------------------------------- */
.ants-field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 20px; }
.ants-field > span { font-size: 0.813rem; font-weight: 600; }
.ants-field .req { color: var(--ants-red-deep); }

.ants-input,
.ants-select,
.ants-textarea {
	width: 100%;
	padding: 13px 14px;
	background: var(--ants-paper);
	border: 1px solid var(--ants-rule-dash);
	border-radius: 0;
	color: var(--ants-text);
	font-size: 0.938rem;
	min-height: var(--ants-target);
}
.ants-textarea { resize: vertical; min-height: 150px; }
.ants-input:focus,
.ants-select:focus,
.ants-textarea:focus {
	outline: var(--ants-focus);
	outline-offset: -1px;
	border-color: var(--ants-red-deep);
}
.ants-input::placeholder,
.ants-textarea::placeholder { color: var(--ants-text-mute); }

.ants-consent { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.ants-consent input {
	width: 18px;
	height: 18px;
	flex: none;
	margin-block-start: 2px;
	accent-color: var(--ants-red-deep);
}
.ants-consent span { font-size: var(--ants-xs); line-height: 1.6; color: var(--ants-text-body); }

.ants-form__note {
	margin: 0;
	font-family: var(--ants-font-mono);
	font-size: var(--ants-eyebrow);
	letter-spacing: 0.08em;
	line-height: 1.7;
	color: var(--ants-text-mute);
}
.ants-form__status {
	padding-inline-start: 12px;
	border-inline-start: 2px solid var(--ants-red);
	font-size: var(--ants-sm);
	line-height: 1.5;
}

/* --- utility --------------------------------------------------------------- */
.ants-stack   { display: flex; flex-direction: column; gap: var(--ants-gap-md); align-items: flex-start; }
.ants-stack--sm { gap: var(--ants-gap-sm); }
/* The stack's gap is the spacing; paragraphs would otherwise add their own on top. */
.ants-stack > p { margin-block: 0; }
.ants-stack > :last-child { margin-bottom: 0; }
.ants-flow > * + * { margin-block-start: var(--ants-gap-md); }

/* --- homepage hero ---------------------------------------------------------
 * Single column until a hero image exists; the design's 1.15/0.85 split only
 * makes sense with something in the right-hand frame.
 */
.ants-hero {
	display: grid;
	gap: var(--ants-gap-xl);
	align-items: center;
	padding-block: clamp(3.5rem, 1.5rem + 8vw, 6.75rem) clamp(3rem, 1.5rem + 6vw, 6rem);
}
@media (min-width: 900px) {
	.ants-hero--split { grid-template-columns: 1.15fr 0.85fr; gap: 72px; }
}

.ants-hero__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 30px;
}
.ants-hero__title {
	margin: 0;
	font-size: var(--ants-h1-hero);
	line-height: 1.02;
	letter-spacing: var(--ants-track-hero);
	font-weight: 600;
	color: var(--ants-paper);
}
.ants-hero__lead {
	margin: 0;
	max-width: 620px;
	font-size: var(--ants-lead);
	line-height: var(--ants-lh-lead);
	color: var(--ants-on-dark-lead);
}
.ants-hero__sub {
	margin: 0;
	font-family: var(--ants-font-mono);
	font-size: 0.75rem;
	letter-spacing: 0.04em;
	color: var(--ants-on-dark-mute);
}
.ants-hero__media { aspect-ratio: 4 / 5; max-height: 440px; }
@media (max-width: 899px) {
	.ants-hero__media { aspect-ratio: 16 / 10; max-height: none; }
}

/* --- breadcrumb list ------------------------------------------------------- */
.ants-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 var(--ants-gap-sm);
	padding: 0;
	list-style: none;
	font-family: var(--ants-font-mono);
	font-size: 0.688rem;
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
}
.ants-breadcrumbs li { margin: 0; display: flex; gap: 10px; align-items: center; }
.ants-breadcrumbs li + li::before { content: "/"; opacity: 0.5; }
.ants-dark .ants-breadcrumbs a { color: var(--ants-on-dark-mute); text-decoration: none; }
.ants-dark .ants-breadcrumbs a:hover { color: var(--ants-paper); }
.ants-dark .ants-breadcrumbs [aria-current] { color: var(--ants-on-dark); }

/* --- legal document aside --------------------------------------------------- */
@media (min-width: 900px) {
	.ants-legal__aside { position: sticky; top: 140px; }
}

/* --- awards index row ------------------------------------------------------- */
.ants-awardrow { display: grid; gap: var(--ants-gap-lg); align-items: start; }
@media (min-width: 900px) {
	.ants-awardrow { grid-template-columns: 132px 1fr 300px; }
}
.ants-awardrow__year {
	font-size: 2.5rem;
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1;
	color: var(--ants-gold-deep);
}

/* --- solutions hub ------------------------------------------------------------
 * One section per platform: intro on the left, held in view while the module grid
 * scrolls past on wide screens; stacked on narrow ones, where sticky would only
 * fight the reader.
 */
.ants-card--tight { gap: 7px; padding: 20px 20px 22px; }

.ants-platform__intro { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.ants-platform__intro .ants-eyebrow { margin-bottom: 0; }
@media (min-width: 900px) {
	.ants-platform__intro { position: sticky; top: 140px; }
}
.ants-platform__title { margin: 0; font-size: clamp(1.625rem, 1.3rem + 1vw, 2rem); line-height: 1.14; letter-spacing: -0.028em; }
.ants-platform__body  { margin: 0; font-size: 1.063rem; line-height: 1.66; color: var(--ants-text-body); }
.ants-platform__shot  { width: 100%; aspect-ratio: 7 / 2; }

.ants-steps { margin: 0; padding: 0; list-style: none; }
.ants-steps > li { margin: 0; }
/* Stretch, unlike .ants-stack: a grid in a flex-start column shrinks to one track. */
.ants-platform__detail { display: flex; flex-direction: column; gap: 22px; min-width: 0; }

/* --- about: milestones, disciplines, leadership ------------------------------ */
.ants-milestone { min-height: 200px; gap: 12px; }
.ants-milestone__year { font-size: 1.625rem; font-weight: 600; letter-spacing: -0.02em; line-height: 1; color: var(--ants-red-deep); }

/*
 * Process — a sequence on a rail (service "How it works", printing, implementation,
 * history). Steps sit in one row on a hairline rail, each marked by a node, with the
 * step number set large; the last node is filled, as the outcome. Where the browser
 * supports scroll-driven animation, a red line draws along the rail as the section
 * comes into view. Below 960px the rail turns vertical. Replaces the hairline-box grid
 * for sequences only — lists without an order keep .ants-hairgrid.
 */
.ants-process {
	--rail: var(--ants-rule-3);
	--node-bg: var(--ants-paper);
	--accent: var(--ants-red-deep);
	--numeral: var(--ants-text);
	--process-gap: clamp(20px, 2.4vw, 40px);
	position: relative;
	display: grid;
	grid-template-columns: none;
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
	gap: 0 var(--process-gap);
	margin: 0;
	padding: 0;
	list-style: none;
	background: none;
}
.ants-tinted .ants-process { --node-bg: var(--ants-tinted); }
.ants-dark .ants-process,
.ants-dark-2 .ants-process { --rail: var(--ants-rule-dark-3); --accent: var(--ants-rose); --numeral: var(--ants-paper); }
.ants-dark .ants-process { --node-bg: var(--ants-ink); }
.ants-dark-2 .ants-process { --node-bg: var(--ants-ink-2); }

/* The rail runs on past the last node and fades: the work continues after delivery. */
.ants-process::after {
	content: "";
	position: absolute;
	top: 6px;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, var(--rail) 0 88%, transparent);
}

.ants-process > *,
.ants-hairgrid.ants-process > * {
	position: relative;
	z-index: 1; /* above both rails, so each node's ring knocks the line out */
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-height: 0;
	margin: 0;
	padding: 46px 0 0;
	background: none;
}
.ants-process > * > * { margin: 0; }

/* The node — a ring that knocks the rail out around it. */
.ants-process > *::after {
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	box-sizing: border-box;
	width: 13px;
	height: 13px;
	border: 1px solid var(--accent);
	border-radius: 50%;
	background: var(--node-bg);
	box-shadow: 0 0 0 6px var(--node-bg);
	transition: background var(--ants-transition), transform var(--ants-transition);
}
.ants-process > :last-child::after { background: var(--accent); }

/* The step number (or year), set large. */
.ants-process > * > .ants-label:first-child,
.ants-process .ants-milestone__year {
	margin-bottom: 8px;
	font-family: var(--ants-font);
	font-size: clamp(2.25rem, 1.7rem + 1.3vw, 3rem);
	font-weight: 400;
	font-variant-numeric: tabular-nums;
	line-height: 1;
	letter-spacing: -0.045em;
	text-transform: none;
	color: var(--numeral);
	transition: color var(--ants-transition);
}
/* The last step is the outcome: its number takes the accent, like its node. */
.ants-process > :last-child > .ants-label:first-child,
.ants-process > :last-child .ants-milestone__year { color: var(--accent); }
.ants-process .ants-row__title { font-size: 1.094rem; line-height: 1.3; }
.ants-dark .ants-process .ants-row__title,
.ants-dark-2 .ants-process .ants-row__title { color: var(--ants-paper); }
.ants-process .ants-card__body { max-width: 34ch; }

@media (hover: hover) {
	.ants-process > :hover::after { background: var(--accent); transform: scale(1.25); }
	.ants-process > :hover > .ants-label:first-child,
	.ants-process > :hover .ants-milestone__year { color: var(--accent); }
}

/* Scroll-driven progress line: draws along the rail as the steps come into view. */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.ants-process::before {
			content: "";
			position: absolute;
			z-index: 0;
			top: 6px;
			left: 0;
			right: 0;
			height: 1px;
			background: linear-gradient(90deg, var(--accent) 0 88%, transparent);
			transform-origin: left center;
			animation: ants-process-draw linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 100%;
		}
		/* Each step rises in just behind the line, and all have landed by the time the row
		   is fully on screen. */
		.ants-process > * {
			animation: ants-process-rise linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 60%;
		}
		.ants-process > :nth-child(2) { animation-range: entry 10% entry 70%; }
		.ants-process > :nth-child(3) { animation-range: entry 20% entry 80%; }
		.ants-process > :nth-child(4) { animation-range: entry 30% entry 90%; }
		.ants-process > :nth-child(n+5) { animation-range: entry 40% entry 100%; }
	}
}
@keyframes ants-process-rise {
	from { opacity: 0; transform: translateY(14px); }
	to   { opacity: 1; transform: none; }
}
@media print {
	.ants-process > *,
	.ants-reason { animation: none !important; opacity: 1 !important; transform: none !important; }
}
@keyframes ants-process-draw {
	from { transform: scale(0, 1); }
	to   { transform: scale(1, 1); }
}

/* Vertical below 960px: the rail runs down the left, a node beside each number. */
@media (max-width: 959px) {
	.ants-process {
		grid-auto-flow: row;
		grid-auto-columns: auto;
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
	}
	.ants-process::after,
	.ants-process::before {
		top: 14px;
		bottom: 0;
		left: 6px;
		right: auto;
		width: 1px;
		height: auto;
		background: linear-gradient(180deg, var(--rail) 0 90%, transparent);
	}
	.ants-process::before {
		background: linear-gradient(180deg, var(--accent) 0 90%, transparent);
		transform-origin: center top;
		animation-name: ants-process-draw-down;
		animation-range: entry 0% cover 50%;
	}
	.ants-process > *,
	.ants-hairgrid.ants-process > * { padding: 0 0 34px 40px; }
	.ants-process > :last-child { padding-bottom: 0; }
	.ants-process > *::after { top: 8px; }
	.ants-process > *:nth-child(n) { animation-range: entry 0% entry 100%; }
	.ants-process > * > .ants-label:first-child,
	.ants-process .ants-milestone__year { margin-bottom: 2px; font-size: 1.875rem; }
	.ants-process .ants-card__body { max-width: 52ch; }
}
@keyframes ants-process-draw-down {
	from { transform: scale(1, 0); }
	to   { transform: scale(1, 1); }
}

.ants-portrait img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border: 1px solid var(--ants-rule-dark-2);
}

/* Founder: portrait beside the biography, ruled off from the team below. */
.ants-founder {
	display: grid;
	gap: var(--ants-gap-xl);
	align-items: start;
	padding-bottom: var(--ants-gap-lg);
	margin-bottom: var(--ants-gap-lg);
	border-bottom: 1px solid var(--ants-rule-dark-2);
}
@media (min-width: 900px) {
	.ants-founder { grid-template-columns: 380px 1fr; }
}
.ants-founder__name { margin: 0; font-size: clamp(1.75rem, 1.4rem + 1vw, 2.25rem); line-height: 1.12; letter-spacing: -0.025em; color: var(--ants-paper); }
.ants-founder__bio { max-width: 680px; }
.ants-founder__bio p { margin: 0 0 1em; color: var(--ants-on-dark-lead); }
.ants-founder__bio p:last-child { margin-bottom: 0; }

.ants-leaders { gap: 28px; }
.ants-leader {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 26px 24px 28px;
	border: 1px solid var(--ants-rule-dark-2);
}
.ants-leader__name { margin: 0 0 6px; font-size: 1.125rem; letter-spacing: -0.01em; color: var(--ants-paper); }

.ants-disciplines { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ants-disciplines li {
	margin: 0;
	padding: 11px 18px;
	border: 1px solid var(--ants-rule-3);
	font-size: 0.906rem;
	color: var(--ants-text-body);
}

.ants-markets { margin: 0; padding: 0; list-style: none; }
.ants-markets > li { margin: 0; }

/* --- enquiry form -------------------------------------------------------------
 * The field styles above were written against class names the form markup
 * (inc/enquiry-form.php) never used, so the form rendered as bare browser controls
 * with its honeypot showing. These selectors bind the styles to the real markup.
 */
.ants-hp {
	position: absolute !important;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.ants-enquiry__form { display: grid; gap: 0 20px; }
@media (min-width: 700px) {
	.ants-enquiry__form { grid-template-columns: 1fr 1fr; }
}
.ants-enquiry__form > .ants-field--textarea,
.ants-enquiry__form > .ants-field--checkbox,
.ants-enquiry__form > .ants-field--submit,
.ants-enquiry__form > .ants-privacy { grid-column: 1 / -1; }

.ants-enquiry__form .ants-field { margin: 0 0 20px; }
.ants-enquiry__form .ants-field > label { font-size: 0.813rem; font-weight: 600; }
.ants-req { margin-inline-start: 2px; color: var(--ants-red-deep); }
.ants-opt { font-weight: 400; color: var(--ants-text-mute); }

.ants-enquiry__form input[type="text"],
.ants-enquiry__form input[type="email"],
.ants-enquiry__form input[type="tel"],
.ants-enquiry__form select,
.ants-enquiry__form textarea {
	width: 100%;
	min-height: var(--ants-target);
	padding: 13px 14px;
	background: var(--ants-paper);
	border: 1px solid var(--ants-rule-dash);
	border-radius: 0;
	color: var(--ants-text);
	font: inherit;
	font-size: 0.938rem;
}
.ants-enquiry__form textarea { min-height: 150px; resize: vertical; }
.ants-enquiry__form :is(input, select, textarea):focus {
	outline: var(--ants-focus);
	outline-offset: -1px;
	border-color: var(--ants-red-deep);
}
.ants-enquiry__form ::placeholder { color: var(--ants-text-mute); }
.ants-enquiry__form .is-invalid :is(input, select, textarea) { border-color: var(--ants-red-deep); }

.ants-check { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.ants-check input { width: 18px; height: 18px; flex: none; margin: 2px 0 0; accent-color: var(--ants-red-deep); }
.ants-check span { font-size: var(--ants-xs); line-height: 1.6; color: var(--ants-text-body); }

.ants-err { font-size: var(--ants-xs); line-height: 1.5; color: var(--ants-red-deep); }
.ants-field--submit { align-items: flex-start; }
.ants-field--submit .ants-btn { min-width: 220px; }
.ants-privacy { margin: 0; font-size: var(--ants-xs); color: var(--ants-text-mute); }

.ants-alert { margin: 0 0 20px; padding: 14px 16px; border-left: 3px solid var(--ants-ink-2); background: var(--ants-tinted); font-size: 0.938rem; }
.ants-alert--error { border-left-color: var(--ants-red-deep); }

/* --- contact page --------------------------------------------------------------- */
.ants-contact { display: grid; gap: var(--ants-gap-xl); align-items: start; }
.ants-contact > * { margin-block: 0; }
@media (min-width: 1000px) {
	.ants-contact { grid-template-columns: 1.15fr 0.85fr; gap: 72px; }
}
.ants-contact__title { margin: 0 0 var(--ants-gap-md); }
.ants-contact__aside { display: flex; flex-direction: column; gap: 36px; }

.ants-lines { margin: 0; padding: 0; list-style: none; width: 100%; }
.ants-lines li { margin: 0; }
.ants-lines a {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 12px;
	padding-block: 14px;
	border-top: 1px solid var(--ants-rule-2);
	color: inherit;
	text-decoration: none;
}
.ants-lines a:hover .ants-lines__v { color: var(--ants-red-deep); }
.ants-lines__k {
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-text-mute);
}
.ants-lines__v { font-size: 1rem; font-weight: 600; }

.ants-office { display: flex; flex-direction: column; gap: 10px; width: 100%; padding: 20px 22px; border: 1px solid var(--ants-rule-2); }
.ants-office address { font-style: normal; line-height: 1.6; }


.ants-commitment { padding-top: 18px; border-top: 2px solid var(--ants-red); }
.ants-commitment__lead { margin: 8px 0; font-size: 1.125rem; font-weight: 600; letter-spacing: -0.01em; }

/*
 * Questions and answers — ruled rows, as the reasons band: a red tab on each rule, the
 * question set firm, the answer in the serif. The grid's own rule closes the last row.
 */
.ants-qa { gap: 0 clamp(32px, 4.5vw, 64px); border-bottom: 1px solid var(--ants-rule-2); }
.ants-qa__item {
	position: relative;
	padding: 26px 0 30px;
	border-top: 1px solid var(--ants-rule-2);
}
.ants-qa__item::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 0;
	width: 36px;
	height: 2px;
	background: var(--ants-red);
}
.ants-qa__item h3 { margin: 0 0 10px; font-size: 1.125rem; line-height: 1.35; letter-spacing: -0.015em; }
.ants-qa__item p {
	margin: 0;
	font-family: var(--ants-font-serif);
	font-size: 1.063rem;
	line-height: 1.62;
	color: var(--ants-text-soft);
	text-wrap: pretty;
}
.ants-dark .ants-qa,
.ants-dark-2 .ants-qa,
.ants-dark .ants-qa__item,
.ants-dark-2 .ants-qa__item { border-color: var(--ants-rule-dark-2); }
.ants-dark .ants-qa__item p,
.ants-dark-2 .ants-qa__item p { color: var(--ants-on-dark-soft); }

/* --- quality page ------------------------------------------------------------------ */
.ants-certfields { margin: 0; }
.ants-certfields dt { margin: 0; }
.ants-certfields dd { margin: 0; font-size: 0.969rem; font-weight: 600; line-height: 1.4; color: var(--ants-paper); overflow-wrap: anywhere; }

/* Splits built from blocks (rather than wp:html) carry flow-layout margins; grid
   columns must start level. */
.wp-block-group.ants-split > * { margin-block: 0; }

.ants-policy > p { margin: 0 0 1em; color: var(--ants-text-body); }
.ants-policy > p.ants-lead { color: var(--ants-text); }
.ants-policy__list { counter-reset: ants-policy; margin: var(--ants-gap-md) 0 0; padding: 0; list-style: none; }
.ants-policy__list > li {
	counter-increment: ants-policy;
	display: grid;
	grid-template-columns: 40px 1fr;
	gap: 12px;
	margin: 0;
	padding-block: 14px;
	border-top: 1px solid var(--ants-rule-2);
	line-height: 1.6;
}
.ants-policy__list > li::before {
	content: counter(ants-policy, decimal-leading-zero);
	padding-top: 4px;
	font-family: var(--ants-font-mono);
	font-size: 0.688rem;
	color: var(--ants-red-deep);
}
/* Bulleted, as the signed policy is: a square marker, no implied order. */
ul.ants-policy__list > li { grid-template-columns: 24px 1fr; }
ul.ants-policy__list > li::before { content: ""; width: 7px; height: 7px; margin-top: 10px; padding: 0; background: var(--ants-red); }
.ants-policy > p.ants-policy__issued {
	margin: var(--ants-gap-md) 0 0;
	padding-top: 14px;
	border-top: 1px solid var(--ants-rule-2);
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-text-mute);
}

/* --- platform credential (e.g. Meta Tech Provider) ------------------------------- */
.ants-credential {
	display: flex;
	align-items: center;
	gap: 18px;
	width: 100%;
	padding: 18px 20px;
	border: 1px solid var(--ants-rule-2);
	border-left: 3px solid var(--ants-gold-deep);
	background: var(--ants-paper);
}
.ants-tinted .ants-credential { background: var(--ants-paper); }
/* The partner logo sits on its own white tile — the official file has a white ground, and
   a deliberate tile reads cleanly on paper, tinted and dark bands alike. */
.ants-credential__mark {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 168px;
	padding: 10px 12px;
	background: #fff;
	border: 1px solid var(--ants-rule);
}
.ants-credential__mark img { display: block; width: 100%; height: auto; max-height: 52px; object-fit: contain; }
.ants-dark .ants-credential__mark,
.ants-dark-2 .ants-credential__mark { border-color: transparent; }
@media (max-width: 420px) {
	.ants-credential.has-logo { flex-direction: column; align-items: flex-start; }
}
.ants-credential__copy { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ants-credential__copy .ants-label { color: var(--ants-gold-deep); }
.ants-credential__copy strong { font-size: 1.063rem; letter-spacing: -0.01em; }
.ants-credential__copy p { margin: 4px 0 0; font-size: var(--ants-sm); line-height: 1.55; color: var(--ants-text-body); }
/* ISO 9001 card: gold top rule, then the certification marks or, until they are uploaded, the certifying body. */
.ants-iso {
	display: flex;
	flex-direction: column;
	padding: 38px 34px 34px;
	border-top: 3px solid var(--ants-gold);
}
.ants-iso > .ants-eyebrow { margin-bottom: 18px; }
.ants-iso__title { max-width: 24ch; margin: 0 0 16px; font-size: 1.688rem; line-height: 1.2; }
.ants-iso .ants-card__body { max-width: 46ch; margin: 0; }
.ants-iso__facts { margin: 24px 0 26px; }
.ants-iso__facts > div {
	display: grid;
	grid-template-columns: 9.5rem 1fr;
	gap: 12px;
	align-items: baseline;
	padding-block: 11px;
	border-top: 1px solid var(--ants-rule-dark-2);
}
.ants-iso__facts > div:last-child { border-bottom: 1px solid var(--ants-rule-dark-2); }
.ants-iso__facts dt {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-on-dark-mute);
}
.ants-iso__facts dt::before { content: ""; flex: none; width: 5px; height: 5px; background: var(--ants-gold); }
.ants-iso__facts dd { margin: 0; font-size: 0.938rem; color: var(--ants-on-dark); }
.ants-iso .ants-isomarks { margin: 26px 0 28px; }
.ants-iso .ants-link { align-self: flex-start; }
@media (max-width: 420px) {
	.ants-iso { padding: 30px 22px 26px; }
	.ants-iso__facts > div { grid-template-columns: 1fr; gap: 4px; }
}

/* ISO certification marks (ants_render_iso_marks()): the supplied file on a white
 * plate, so the marks keep their own colours on light and dark bands. */
.ants-isomarks { display: flex; flex-direction: column; gap: 12px; max-width: 460px; margin: 0; }
.ants-isomarks__plate { padding: 14px 18px; background: #fff; border: 1px solid var(--ants-rule-2); }
.ants-dark .ants-isomarks__plate,
.ants-dark-2 .ants-isomarks__plate { border-color: #fff; }
.ants-isomarks__plate img { display: block; width: 100%; height: auto; }
.ants-isomarks--single .ants-isomarks__plate { align-self: flex-start; width: 104px; padding: 8px; }
.ants-isomarks figcaption { font-size: var(--ants-xs); line-height: 1.55; color: var(--ants-text-mute); }
.ants-dark .ants-isomarks figcaption,
.ants-dark-2 .ants-isomarks figcaption { color: var(--ants-on-dark-mute); }

.ants-office__hours { display: flex; flex-direction: column; gap: 6px; padding-top: 12px; border-top: 1px solid var(--ants-rule); }
.ants-office__hours ul { margin: 0; padding: 0; list-style: none; font-size: var(--ants-sm); line-height: 1.6; color: var(--ants-text-body); }

/* --- service pages ------------------------------------------------------------------ */
/* Block-built grids carry flow-layout margins; items must start level. */
.ants-qa > *,
.wp-block-group.ants-grid > *,
.wp-block-group.ants-hairgrid > *,
.wp-block-group.ants-process > * { margin-block: 0; }
.ants-qa__item p { margin: 0 0 0.75em; }
.ants-qa__item p:last-child { margin-bottom: 0; }

/*
 * Reasons — the "Why Ants Creation" band on service pages. The heading and a call to
 * action hold the left column (sticky on wide screens); the reasons run down the right
 * as ruled rows, title beside a serif description. A red tab sits on each row's rule
 * and sweeps across it on hover.
 */
.ants-reasons {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--ants-gap-lg);
}
.wp-block-group.ants-reasons > *,
.wp-block-group.ants-reasons__head > *,
.wp-block-group.ants-reasons__list > *,
.wp-block-group.ants-reason > * { margin-block: 0; }
.ants-reasons__head { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
.ants-reasons__head .ants-eyebrow { margin-bottom: var(--ants-gap-sm); }
.wp-block-group.ants-reasons__head > .ants-reasons__aside {
	margin-top: 22px;
	max-width: 36ch;
	font-family: var(--ants-font-serif);
	font-size: 1.125rem;
	line-height: 1.58;
	color: var(--ants-text-soft);
}
.wp-block-group.ants-reasons__head > .ants-reasons__cta { margin-top: 32px; }
.ants-reasons__cta .ants-btn { text-decoration: none; }

.ants-reasons__list { border-bottom: 1px solid var(--ants-rule-2); }
.ants-reason {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 8px;
	padding: 28px 0 30px;
	border-top: 1px solid var(--ants-rule-2);
}
.ants-reason::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 0;
	width: 36px;
	height: 2px;
	background: var(--ants-red);
	transition: width 520ms cubic-bezier(0.2, 0.7, 0.2, 1);
}
.ants-reason__title {
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.018em;
}
.ants-reason__body {
	font-family: var(--ants-font-serif);
	font-size: 1.063rem;
	line-height: 1.62;
	color: var(--ants-text-soft);
	text-wrap: pretty;
}
.ants-reason__title { transition: color var(--ants-transition); }
@media (hover: hover) {
	.ants-reason:hover::before { width: 100%; }
	.ants-reason:hover .ants-reason__title { color: var(--ants-red-deep); }
}

@media (min-width: 900px) {
	.ants-reasons {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: clamp(48px, 6vw, 96px);
		align-items: start;
	}
	.ants-reasons__head { position: sticky; top: 140px; }
	.ants-reason {
		grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
		gap: 32px;
		align-items: baseline;
		padding: 34px 0 36px;
	}
}

/* Rows rise in as they scroll into view, where supported. */
@supports (animation-timeline: view()) {
	@media screen and (prefers-reduced-motion: no-preference) {
		.ants-reason {
			animation: ants-process-rise linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 100%;
		}
	}
}

/*
 * Offers — "What is included" on service pages. Each card opens with a red plus (it is
 * included), the title is set larger and the description darker than a plain card.
 */
.ants-offers > .ants-card { gap: 12px; padding: 32px 30px 36px; }
.ants-offers > .ants-card::before {
	content: "+";
	font-family: var(--ants-font-mono);
	font-size: 1.375rem;
	font-weight: 400;
	line-height: 1;
	color: var(--ants-red-deep);
}
.ants-offers .ants-row__title { font-size: 1.125rem; line-height: 1.3; letter-spacing: -0.015em; }
.ants-offers .ants-card__body { font-size: 0.969rem; color: var(--ants-text-body); }

/*
 * Sweep — on hover, a red line runs along the top of a card, as on the reasons rows.
 * For card grids that respond to the pointer (offers, service links, recent work).
 */
.ants-sweep > *,
.ants-offers > * { position: relative; transition: background var(--ants-transition); }
.ants-sweep > *::after,
.ants-offers > *::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 2px;
	background: var(--ants-red);
	transition: width 520ms cubic-bezier(0.2, 0.7, 0.2, 1);
}
@media (hover: hover) {
	.ants-sweep > :hover::after,
	.ants-offers > :hover::after { width: 100%; }
	.ants-tinted .ants-offers > :hover,
	.ants-tinted .ants-sweep > :hover { background: var(--ants-paper); }
	.ants-offers > :hover .ants-row__title { color: var(--ants-red-deep); }
}
.ants-offers .ants-row__title { transition: color var(--ants-transition); }

/* Service links: the title carries an arrow that moves with the pointer. */
.ants-servicelinks .ants-card--link { gap: 12px; padding: 30px 28px 32px; }
.ants-servicelinks .ants-row__title { font-size: 1.125rem !important; line-height: 1.3; letter-spacing: -0.015em; }
.ants-servicelinks .ants-card__cta { transition: letter-spacing 300ms ease, color var(--ants-transition); }
@media (hover: hover) {
	.ants-servicelinks .ants-card--link:hover .ants-card__cta { letter-spacing: 0.24em; }
}

a.ants-card--link { color: inherit; text-decoration: none; }
a.ants-card--link:hover { background: var(--ants-tinted); }
a.ants-card--link:hover .ants-row__title { color: var(--ants-red-deep); }
.ants-tinted a.ants-card--link:hover { background: var(--ants-paper); }

/* Jump links and offering lists (services index, hubs). */
.ants-jump { display: flex; flex-wrap: wrap; gap: 8px 10px; padding-block: 22px; }
.ants-jump a {
	padding: 8px 12px;
	border: 1px solid var(--ants-rule-dark-2);
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-on-dark);
	text-decoration: none;
}
.ants-jump a:hover { border-color: var(--ants-rose); color: var(--ants-paper); }

.ants-offerings { display: grid; align-content: start; gap: 0 28px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 640px) { .ants-offerings { grid-template-columns: 1fr 1fr; } }
.ants-offerings > li { margin: 0; border-top: 1px solid var(--ants-rule-2); }
.ants-offerings > li > a,
.ants-offerings > li > span { display: block; padding: 12px 0; font-size: 0.938rem; line-height: 1.45; }
.ants-offerings > li > a { color: var(--ants-text); text-decoration: none; font-weight: 600; }
.ants-offerings > li > a::after { content: " →"; color: var(--ants-red-deep); }
.ants-offerings > li > a:hover { color: var(--ants-red-deep); }
.ants-offerings > li > span { color: var(--ants-text-body); }
.ants-offerings--plain { grid-template-columns: 1fr; }
.ants-dark .ants-offerings > li { border-top-color: var(--ants-rule-dark-2); }
.ants-dark .ants-offerings > li > span { color: var(--ants-on-dark-lead); }

.ants-bestfor { margin: 0; font-size: var(--ants-sm); line-height: 1.55; color: var(--ants-text-body); }
.ants-bestfor .ants-label { margin-inline-end: 6px; color: var(--ants-red-deep); }
.ants-specs { margin: 0; }
.ants-specs dt { margin: 0; }
.ants-specs dd { margin: 0; }
.ants-modules { width: 100%; margin: 0; padding: 0; list-style: none; }
.ants-modules > li { margin: 0; }

/* Components built from core group blocks (service pages) space their children with
   gap; WordPress's flow-layout margins would double it. */
.wp-block-group.ants-card > *,
.wp-block-group.ants-stack > *,
.wp-block-group.ants-sechead > *,
.wp-block-group.ants-sechead__main > *,
.wp-block-group.ants-container > .wp-block-group.ants-split { margin-block: 0; }
.wp-block-group.ants-sechead__main > .ants-eyebrow { margin-bottom: var(--ants-gap-sm); }
.wp-block-group.ants-container > .ants-sechead + * { margin-block-start: 0; }
/* WordPress's flow layout zeroes block-end margins at equal specificity, which left every
   block-built section heading flush against its content. */
.wp-block-group.ants-container > .ants-sechead { margin-block-end: var(--ants-gap-lg); }

/* --- case studies index ----------------------------------------------------------- */
.ants-casepolicy { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; padding-block: 22px 12px; }
.ants-casepolicy p { margin: 0; max-width: 820px; font-size: var(--ants-sm); color: var(--ants-on-dark-lead); }
.ants-casebody { width: 100%; }
@media (max-width: 599px) {
	.ants-casebody .ants-row { grid-template-columns: 1fr !important; gap: 6px; }
}

/* --- insights index (templates/home.html) ----------------------------------------- */
/* Hairlines drawn on the items rather than shown through a grey grid background, so a
   part-filled last row leaves blank paper instead of a grey block. */
.ants-insights__grid { gap: 0 !important; margin: 0; padding: 0; border-top: 1px solid var(--ants-rule); list-style: none; }
.ants-insights__grid > li { margin: 0; background: var(--ants-paper); box-shadow: inset -1px -1px 0 var(--ants-rule); }
.ants-insights__grid > li > .ants-insight { height: 100%; }
@media (min-width: 900px) {
	/* The newest article leads, two columns wide. */
	.ants-insights__grid > li:first-child { grid-column: span 2; }
	.ants-insights__grid > li:first-child .ants-insight__title { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
}
@media (max-width: 899px) {
	.ants-insights__grid { grid-template-columns: 1fr !important; }
}
.ants-insight__cat { font-family: var(--ants-font-mono); font-size: var(--ants-tag); letter-spacing: var(--ants-track-tag); text-transform: uppercase; color: var(--ants-red-deep); }
.ants-insight__cat a { color: inherit; text-decoration: none; }
.ants-insight__title { margin: 0; font-size: 1.188rem; line-height: 1.3; letter-spacing: -0.012em; }
.ants-insight__title a { color: var(--ants-text); text-decoration: none; }
.ants-insight__title a:hover { color: var(--ants-red-deep); }
.ants-insight .wp-block-post-excerpt__excerpt { margin: 0; }
.ants-insight__date { margin-top: auto; font-family: var(--ants-font-mono); font-size: var(--ants-tag); letter-spacing: var(--ants-track-tag); text-transform: uppercase; color: var(--ants-text-mute); }
.ants-pagination { margin-top: var(--ants-gap-lg); gap: 12px; font-family: var(--ants-font-mono); font-size: var(--ants-tag); text-transform: uppercase; }

/* --- lightbox -------------------------------------------------------------------
 * Built by assets/js/lightbox.js on a native <dialog>. Full-screen ink, the photograph
 * centred, caption and controls along the foot. Square controls, gold on hover —
 * it shows award photographs, the one place gold belongs.
 */
html.has-lightbox { overflow: hidden; }
.ants-lightbox {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: rgba(8, 17, 32, 0.96);
	color: var(--ants-on-dark);
}
.ants-lightbox[open] {
	display: grid;
	grid-template-rows: 1fr auto;
	animation: ants-lightbox-in 220ms ease-out;
}
.ants-lightbox::backdrop { background: rgba(8, 17, 32, 0.6); backdrop-filter: blur(8px); }
@keyframes ants-lightbox-in { from { opacity: 0; } }
.ants-lightbox__stage {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 0;
	padding: 72px 16px 16px;
}
@media (min-width: 900px) {
	.ants-lightbox__stage { padding: 72px 96px 20px; }
}
.ants-lightbox__img {
	display: block;
	width: auto;
	height: auto;
	max-width: min(100%, 1200px);
	max-height: 100%;
	object-fit: contain;
	background: #fff;
	box-shadow: 0 30px 90px rgba(0, 0, 0, 0.55);
	transition: opacity 200ms ease;
}
.ants-lightbox.is-loading .ants-lightbox__img { opacity: 0.25; }
.ants-lightbox__bar {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px 32px;
	flex-wrap: wrap;
	width: 100%;
	max-width: 1296px;
	margin-inline: auto;
	padding: 18px 16px 24px;
	border-top: 1px solid var(--ants-rule-dark-2);
}
@media (min-width: 900px) {
	.ants-lightbox__bar { padding: 22px 48px 30px; }
}
.ants-lightbox__caption { display: flex; flex-direction: column; gap: 8px; min-width: 0; max-width: 760px; }
.ants-lightbox__meta {
	font-family: var(--ants-font-mono);
	font-size: var(--ants-eyebrow);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-gold);
}
.ants-lightbox__title {
	font-size: clamp(1.125rem, 0.95rem + 0.8vw, 1.5rem);
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.015em;
	color: var(--ants-paper);
}
.ants-lightbox__nav { display: flex; align-items: center; gap: 10px; }
.ants-lightbox__count {
	margin-inline-end: 8px;
	font-family: var(--ants-font-mono);
	font-size: var(--ants-xs);
	letter-spacing: 0.08em;
	color: var(--ants-on-dark-mute);
}
.ants-lightbox__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 1px solid var(--ants-rule-dark-3);
	background: transparent;
	color: var(--ants-paper);
	cursor: pointer;
	transition: border-color var(--ants-transition), color var(--ants-transition), background var(--ants-transition);
}
.ants-lightbox__btn:hover { border-color: var(--ants-gold); color: var(--ants-gold); }
.ants-lightbox__btn[hidden] { display: none; }
.ants-lightbox__close {
	position: absolute;
	inset-block-start: 14px;
	inset-inline-end: 14px;
	border-color: transparent;
}
@media (min-width: 900px) {
	.ants-lightbox__close { inset-block-start: 20px; inset-inline-end: 24px; }
}
@media (prefers-reduced-motion: reduce) {
	.ants-lightbox[open] { animation: none; }
	.ants-lightbox__img { transition: none; }
}


/* --- solution pages: modules head --------------------------------------------- */
/* The heading on the left; who the platform is built for, and any partner credential,
   on the right; the modules run full width beneath in three columns. */
.ants-modhead {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 24px var(--ants-gap-lg);
	align-items: start;
	margin-bottom: var(--ants-gap-lg);
}
.ants-modhead h2 { margin: 0; }
.ants-modhead__meta { display: flex; flex-direction: column; gap: 14px; }
.ants-modhead__meta .ants-label { display: block; margin-bottom: 2px; }
.ants-modhead .ants-credential { margin: 0; }
@media (min-width: 900px) {
	.ants-modhead { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); }
}

/* --- WhatsApp automation band -------------------------------------------------- */
.ants-wa {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--ants-gap-xl);
	align-items: center;
}
@media (min-width: 960px) {
	.ants-wa { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); }
}
.ants-wa__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
.ants-wa__copy h2 { margin: 0 0 18px; max-width: 18ch; color: var(--ants-paper); }
.ants-wa__copy .ants-lead { margin: 0 0 30px; max-width: 58ch; color: var(--ants-on-dark-lead); }
.ants-wa__points {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0 32px;
	width: 100%;
	margin: 0 0 32px;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--ants-rule-dark-2);
}
@media (min-width: 600px) {
	.ants-wa__points { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.ants-wa__points li {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
	padding: 20px 0 22px;
	border-top: 1px solid var(--ants-rule-dark-2);
}
.ants-wa__points li::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 0;
	width: 28px;
	height: 2px;
	background: var(--ants-red);
}
.ants-wa__points strong { font-size: 1.063rem; font-weight: 600; letter-spacing: -0.01em; color: var(--ants-paper); }
.ants-wa__points span { font-size: var(--ants-sm); line-height: 1.55; color: var(--ants-on-dark-soft); }
.ants-wa__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-bottom: 28px; }
.ants-wa__actions .ants-btn { text-decoration: none; }
.ants-dark .ants-wa .ants-link { color: var(--ants-paper); }
.ants-dark .ants-credential { background: rgba(255, 255, 255, 0.04); border-color: var(--ants-rule-dark-2); }
.ants-dark .ants-credential__copy .ants-label { color: var(--ants-gold); }
.ants-dark .ants-credential__copy strong { color: var(--ants-paper); }

/* The sample lead timeline. */
.ants-wa__demo {
	position: relative;
	padding: 22px 22px 26px;
	background: var(--ants-ink-2);
	border: 1px solid var(--ants-rule-dark-2);
	box-shadow: 0 40px 80px -40px rgba(0, 0, 0, 0.6);
}
.ants-wa__bar {
	display: flex;
	align-items: center;
	gap: 10px;
	padding-bottom: 16px;
	margin-bottom: 18px;
	border-bottom: 1px solid var(--ants-rule-dark-2);
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: var(--ants-track-tag);
	text-transform: uppercase;
	color: var(--ants-on-dark-mute);
}
.ants-wa__live {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #25d366;
	box-shadow: 0 0 0 4px rgba(37, 211, 102, 0.16);
}
.ants-wa__chat { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin-bottom: 22px; }
.ants-wa__bubble {
	position: relative;
	max-width: 88%;
	margin: 0;
	padding: 12px 14px;
	border-radius: 2px 12px 12px 12px;
	background: var(--ants-paper);
	font-size: var(--ants-sm);
	line-height: 1.45;
	color: var(--ants-text);
}
.ants-wa__meta { font-family: var(--ants-font-mono); font-size: var(--ants-tag); letter-spacing: 0.06em; color: var(--ants-on-dark-mute); }
.ants-wa__events { position: relative; margin: 0; padding: 0; list-style: none; }
.ants-wa__events::before {
	content: "";
	position: absolute;
	top: 8px;
	bottom: 8px;
	left: 5px;
	width: 1px;
	background: var(--ants-rule-dark-3);
}
.ants-wa__events li {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 2px 12px;
	margin: 0;
	padding: 0 0 18px 30px;
}
.ants-wa__events li:last-child { padding-bottom: 0; }
.ants-wa__events li::before {
	content: "";
	position: absolute;
	top: 3px;
	left: 0;
	box-sizing: border-box;
	width: 11px;
	height: 11px;
	border: 1px solid var(--ants-rose);
	border-radius: 50%;
	background: var(--ants-ink-2);
	box-shadow: 0 0 0 4px var(--ants-ink-2);
}
.ants-wa__events li:last-child::before { background: var(--ants-red); border-color: var(--ants-red); }
.ants-wa__events strong { grid-column: 1; font-size: 0.938rem; font-weight: 600; color: var(--ants-paper); }
.ants-wa__events span { grid-column: 1; font-size: var(--ants-xs); color: var(--ants-on-dark-soft); }
.ants-wa__events time,
.ants-wa__events .ants-wa__step {
	grid-column: 2;
	grid-row: 1;
	font-family: var(--ants-font-mono);
	font-size: var(--ants-tag);
	letter-spacing: 0.06em;
	color: var(--ants-on-dark-mute);
}
.ants-wa__events li:last-child strong { color: var(--ants-rose); }

/* The timeline plays in as the band scrolls into view, where supported. */
@supports (animation-timeline: view()) {
	@media screen and (prefers-reduced-motion: no-preference) {
		/* Each event has its own timeline and they stack, so one range staggers them; every
		   reveal completes as soon as its element is fully on screen. */
		.ants-wa__events li {
			animation: ants-process-rise linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 100%;
		}
	}
}
@media print {
	.ants-wa__events li { animation: none !important; opacity: 1 !important; transform: none !important; }
}

/* --- case study pages ------------------------------------------------------------ */
.ants-casefacts {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 22px 40px;
	margin: 0;
}
.ants-casefacts > div { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ants-casefacts dt { margin: 0; }
.ants-casefacts dd { margin: 0; font-size: 1.063rem; line-height: 1.45; font-weight: 500; }
.ants-casefacts dd.ants-chips { font-size: inherit; font-weight: 400; }
@media (min-width: 900px) {
	.ants-casefacts { grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.8fr) minmax(0, 0.6fr); }
	.ants-casefacts__wide { grid-column: 1 / -1; }
}
.ants-casehead { padding-block: 34px 38px; }

.ants-caseresults .ants-eyebrow { display: block; margin-bottom: 22px; }
.ants-bigfigures {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--ants-rule-dark-2);
}
.ants-bigfigures li {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 24px 24px 26px 0;
	border-bottom: 1px solid var(--ants-rule-dark-2);
}
.ants-bigfigures strong {
	font-size: clamp(2rem, 1.5rem + 1.6vw, 2.75rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.04em;
	font-variant-numeric: tabular-nums;
	color: var(--ants-paper);
}
.ants-bigfigures span { max-width: 26ch; font-size: var(--ants-sm); line-height: 1.5; color: var(--ants-on-dark-soft); }

.ants-caseclient {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: 10px;
	padding: 18px 20px;
	border: 1px solid var(--ants-rule-2);
	border-left: 3px solid var(--ants-red);
	background: var(--ants-paper);
}
.wp-block-group.ants-caseclient > * { margin: 0; }
.ants-caseclient__name { font-weight: 600; }
.ants-caseclient p:not(.ants-label) { font-size: var(--ants-sm); line-height: 1.55; color: var(--ants-text-body); }

.ants-card__list { margin: 0; padding-left: 1.1em; font-size: 0.969rem; line-height: 1.55; color: var(--ants-text-body); }
.ants-card__list li { margin: 0 0 6px; }
.ants-card__list li:last-child { margin-bottom: 0; }
.ants-card__list li::marker { color: var(--ants-red-deep); }
ul.ants-reason__body {
	margin: 0;
	padding-left: 1.1em;
	font-family: var(--ants-font-serif);
	font-size: 1.063rem;
	line-height: 1.62;
	color: var(--ants-text-soft);
}
ul.ants-reason__body li { margin: 0 0 8px; }
ul.ants-reason__body li:last-child { margin-bottom: 0; }
ul.ants-reason__body li::marker { color: var(--ants-red-deep); }

.ants-conclusion__text {
	margin: 0;
	font-family: var(--ants-font-serif);
	font-size: 1.25rem;
	line-height: 1.6;
	color: var(--ants-text-lead);
	text-wrap: pretty;
}

/*
 * Fill — a three-up card grid whose last row stretches to the full width, so a count that
 * is not a multiple of three never leaves an empty grey cell. Six tracks: each card spans
 * two; a last row of two spans three each; a lone last card spans all six.
 */
.ants-fill3 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 600px) and (max-width: 899px) {
	.ants-fill3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ants-fill3 > :last-child:nth-child(odd) { grid-column: span 2; }
}
@media (min-width: 900px) {
	.ants-fill3 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.ants-fill3 > * { grid-column: span 2; }
	.ants-fill3 > :nth-last-child(2):nth-child(3n+1),
	.ants-fill3 > :last-child:nth-child(3n+2) { grid-column: span 3; }
	.ants-fill3 > :last-child:nth-child(3n+1) { grid-column: span 6; }
}

/* --- award items ------------------------------------------------------------------ */
.ants-awarddetail { align-items: start; }
.ants-awarddetail__about > p { margin: 0 0 0.85em; line-height: 1.65; color: var(--ants-text-body); }
.ants-awarddetail__about > p:first-child { font-size: var(--ants-lead); line-height: var(--ants-lh-lead); color: var(--ants-text-lead); }
.ants-awarddetail__about > p:last-child { margin-bottom: 0; }
.ants-awarddetail__photo { margin: 0; padding: 10px; background: #fff; border: 1px solid var(--ants-rule-2); }
.ants-awarddetail__photo a { display: block; }
.ants-awarddetail__photo img { display: block; width: 100%; height: auto; }
.ants-awardfacts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 0 28px;
	width: 100%;
	margin: 6px 0 4px;
	border-top: 1px solid var(--ants-rule-2);
}
.ants-awardfacts > div { display: flex; flex-direction: column; gap: 6px; padding: 16px 0 18px; border-bottom: 1px solid var(--ants-rule-2); }
.ants-awardfacts dt { margin: 0; }
.ants-awardfacts dd { margin: 0; font-weight: 500; line-height: 1.4; }
.ants-awardcard__year {
	font-family: var(--ants-font-mono);
	font-size: var(--ants-eyebrow);
	letter-spacing: var(--ants-track-tag);
	color: var(--ants-gold-deep);
}
.ants-chips--lg .ants-chip { padding: 10px 14px; font-size: 0.75rem; }

/* --- search results ----------------------------------------------------------------- */
.ants-results__list { margin: 0; padding: 0; list-style: none; border-bottom: 1px solid var(--ants-rule-2); }
.ants-results__list > li { margin: 0; }
.ants-result {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 24px 0 26px;
	border-top: 1px solid var(--ants-rule-2);
}
.wp-block-group.ants-result > * { margin: 0; }
.ants-result::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 0;
	width: 36px;
	height: 2px;
	background: var(--ants-red);
}
.ants-result__kind { color: var(--ants-red-deep); }
.ants-result__title { font-size: 1.375rem; line-height: 1.3; letter-spacing: -0.02em; }
.ants-result__title a { color: inherit; text-decoration: none; }
.ants-result__title a:hover { color: var(--ants-red-deep); }
.ants-result__body p { margin: 0; max-width: 72ch; font-family: var(--ants-font-serif); font-size: 1.063rem; line-height: 1.6; color: var(--ants-text-soft); }
.ants-result__date { font-family: var(--ants-font-mono); font-size: var(--ants-tag); letter-spacing: var(--ants-track-tag); text-transform: uppercase; color: var(--ants-text-mute); }
.ants-results .ants-pagination { margin-top: 28px; }

/* Awards page: certification and Meta Tech Provider side by side (patterns/awards-page.php). */
.ants-quality { display: grid; gap: 32px; margin-top: 1.75rem; }
.ants-quality__iso,
.ants-quality__meta { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
@media (min-width: 900px) {
	.ants-quality.has-meta { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 40px; align-items: stretch; }
}
.ants-quality__meta .ants-credential { flex-direction: column; align-items: flex-start; gap: 16px; height: 100%; padding: 22px 24px; }
.ants-quality__meta .ants-credential__mark { width: 200px; }
.ants-quality__meta .ants-credential__mark img { max-height: 64px; }
.ants-dark .ants-quality__meta .ants-credential__copy p { color: var(--ants-on-dark-soft); }

/* Insights cards: the article's image across the top (templates/home.html, archive.html). */
/* Specific enough to beat core's flow-layout first-child margin. */
.ants-card.ants-insight > .ants-insight__img { margin: -30px -26px 4px; }
.ants-insight__img a { display: block; height: 100%; }
.ants-insight__img img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; transition: transform 400ms ease; }
.ants-insights__grid > li:hover .ants-insight__img img { transform: scale(1.03); }
@media (min-width: 900px) {
	/* The leading article: image on the left, text on the right. */
	.ants-insights__grid > li:first-child .ants-insight:has(> .ants-insight__img) {
		display: grid;
		grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
		grid-template-rows: auto auto 1fr auto;
		gap: 14px 32px;
		padding: 0 30px 0 0;
	}
	.ants-insights__grid > li:first-child .ants-card.ants-insight > .ants-insight__img { grid-column: 1; grid-row: 1 / -1; margin: 0; }
	.ants-insights__grid > li:first-child .ants-insight__img img { height: 100%; min-height: 340px; aspect-ratio: auto; }
	.ants-insights__grid > li:first-child .ants-insight > :not(.ants-insight__img) { grid-column: 2; }
	.ants-insights__grid > li:first-child .ants-insight__cat { margin-top: 34px; }
	.ants-insights__grid > li:first-child .ants-insight__date { margin-bottom: 34px; }
}
@media (prefers-reduced-motion: reduce) {
	.ants-insight__img img { transition: none; }
	.ants-insights__grid > li:hover .ants-insight__img img { transform: none; }
}

/* An article's own image, under the byline (templates/single.html): rounded, and wide
   rather than tall, so the opening paragraph stays near the top of the screen. */
.single-post .wp-block-post-featured-image { margin-block: 8px 34px; }
.single-post .wp-block-post-featured-image img { display: block; width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: cover; border-radius: var(--ants-r-lg); }