/*! amiqus-fixes 2026-10-09.5 */

/*
 * Additive fixes, loaded after every other stylesheet (see amiqus_enqueue_fixes in functions.php).
 * Rules:
 *  - Only add or override here. Never edit styles.min.css / stylesheader.min.css, never recompile the SCSS.
 *  - Group fixes by area, each with a short comment saying what it fixes and which pages were checked.
 *  - Bump the marker below (and the comment above) on every upload. Claude checks it in the browser
 *    to confirm the new file is actually being served before validating anything.
 */
:root {
	--amiqus-fixes: "2026-10-09.5";

	/* Side gutter. Steps match .container in styles.min.css, except below 1024px where we use 20px
	   (the theme's 1.2rem = 19.2px is off the 4px grid). Every spacing value here is a multiple of 4px. */
	--amiqus-gutter: 20px;
	/* Indent for list text past the gutter (bullet/number sits in this space) */
	--amiqus-list-indent: 24px;
	/* Gutter for blocks capped at the 1352px content width: once the screen is wider than that, the
	   centring margin already provides part of the gutter, so only top it up to line up with .container */
	--amiqus-content-gutter: max(0px, calc(var(--amiqus-gutter) - max(0px, (100vw - 1352px) / 2)));
}
@media screen and (min-width: 1024px) { :root { --amiqus-gutter: 32px; } }
@media screen and (min-width: 1280px) { :root { --amiqus-gutter: 80px; } }
@media screen and (min-width: 1536px) { :root { --amiqus-gutter: 96px; } }

/* Long URLs / non-breaking-space runs in content pushed pages wider than the screen on mobile.
   break-word only splits a word when it cannot fit on its own line, so normal text is unaffected.
   Seen on: /careers/integrations-engineer, /careers/senior-back-end-engineer-2, /hello-ai,
   /candidate-vetting-process-how-to-screen-new-hires-effectively */
body { overflow-wrap: break-word; }

/* Edge gutters ------------------------------------------------------------------------------- */

/* Core blocks placed straight into a page (not inside an ACF section) had no side gutter, so text,
   buttons, images and cards ran into the screen edge at every width below 1352px.
   ACF sections are .alignfull and bring their own .container, so they are excluded, as is anything
   that already contains a .container. HubSpot forms (.hbspt-form already has a 1.2em margin) and the
   Gravity Forms quiz overlay manage their own spacing, so they are left alone. ~150 pages, e.g. /register-your-interest, /release-notes,
   /help-and-support, /policies, /search, /blog, CTA lines on /legal and /right-to-rent. */
main > .wp-block-post-content > :is(
	p, h1, h2, h3, h4, h5, h6, figure, blockquote, pre,
	.wp-block-buttons, .wp-block-group, .wp-block-columns, .wp-block-table, .wp-block-quote,
	.meetings-iframe-container
):not(.alignfull):not(:has(.container)) {
	padding-inline: var(--amiqus-content-gutter);
	box-sizing: border-box;
}
/* Groups that mix an ACF .container with loose text (e.g. "Every route, one evidence store" on /right-to-work):
   gutter the loose text only */
main > .wp-block-post-content > .wp-block-group:has(.container) > :is(p, h1, h2, h3, h4, h5, h6, .wp-block-buttons) {
	padding-inline: var(--amiqus-content-gutter);
	box-sizing: border-box;
}
/* Lists keep their bullet indent on top of the gutter */
main > .wp-block-post-content > :is(ul, ol) {
	padding-inline-start: calc(var(--amiqus-content-gutter) + var(--amiqus-list-indent));
	padding-inline-end: var(--amiqus-content-gutter);
	box-sizing: border-box;
}

/* Post/page titles (e.g. long job titles on /careers/*) sat 2px from the edges on mobile */
.pagetitle-cont {
	padding-inline: var(--amiqus-gutter);
	box-sizing: border-box;
}

/* Wide data tables (/policies/privacy) were clipped on mobile with no way to see the hidden columns:
   let the wrapper scroll sideways instead */
.table-wrapper {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
