/* Usability-audit corrections. Loaded last so these win over the base styles. */

/* Hero label: sentence case instead of a 43-character all-caps run. */
/* (hero label rule removed: the new hero styles its own label) */

/* Carousels and marquees must never widen the page. */
.work,
.abs-hero__strip,
.testimonials-marquee,
.ic-carousel {
	overflow-x: clip;
}

/* "View All Work" sits under the projects it refers to. */
.work__more {
	display: flex;
	justify-content: center;
	margin: 2rem 0 0;
}

/* Industry cards: stronger scrim so titles stay readable on busy photos. */
.ic-slide__scrim {
	background: linear-gradient(to top, rgb(0 0 0 / 0.9) 0%, rgb(0 0 0 / 0.65) 45%, rgb(0 0 0 / 0.2) 100%);
}

.ic-slide__content h3,
.ic-slide__content p {
	text-shadow: 0 1px 2px rgb(0 0 0 / 0.6);
}

/* Early results: "Read full case study" links line up at the card bottom. */
.result-card .meta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	align-self: stretch;
}

.result-card .meta h3 {
	flex-grow: 1;
}

/* ==========================================================================
   Usability audit, round 2 (12 issues). Numbers match the audit.
   ========================================================================== */

/* 2. Type scale: every size comes from the --fs-* tokens in main.css. */
/* (hero h1 size removed: the new hero sets its own scale) */

/* The serif italic has a smaller x-height; font-size-adjust evens it out
   without introducing an extra font size. */


.founder-photo {
	font-size: var(--fs-h4);
}

.testimonial-card__avatar,
.result-card .btn-text {
	font-size: var(--fs-small);
}

.testimonial-card__quote {
	font-size: var(--fs-body);
	line-height: 1.6;
}

/* 16px also stops iOS zooming the page when a field is focused. */
.field input,
.field select,
.field textarea {
	font-size: 1rem;
}

.abs-stats__eyebrow,
.abs-split__eyebrow {
	font-size: var(--fs-micro);
}

.abs-stats__heading,
.abs-split__heading,
.abs-stat__value {
	font-size: var(--fs-h2);
}

.abs-stats__intro {
	font-size: var(--fs-body);
}

.abs-stat__label {
	font-size: var(--fs-body-lg);
}

/* 3. Corner radii: one card radius (1rem, the palette value), one small
   radius, pills and circles. */
:root {
	--radius: 1rem;
}

.icon-box,
.abs-split__image {
	border-radius: var(--radius);
}

/* 4 + 9. One icon-button for both carousels. */
.work__arrow,
.ic-arrow {
	flex: none;
	width: 44px;
	height: 44px;
	margin-top: 0;
	padding: 0;
	background: #000000;
	border: 1.5px solid #000000;
	color: #fff;
}

.work__arrow:hover,
.ic-arrow:hover {
	background: #fff;
	border-color: #000000;
	color: #000000;
}

.work__arrow:focus-visible,
.ic-arrow:focus-visible {
	outline: 2px solid var(--accent-orange);
	outline-offset: 3px;
}

/* 9. Previous / next sit together beside the section heading. */
.work__nav {
	display: flex;
	gap: 10px;
	align-self: end;
}

@media (max-width: 720px) {
	.work__nav {
		display: none; /* swipe + dots on small screens, as before */
	}
}

/* 5. Section labels: sentence case, so longer labels stay easy to read. */
.label {
	text-transform: none;
	letter-spacing: 0.04em;
}

/* 6. Footer column titles are <h2> now; keep the small-label look. */
.footer-grid .footer-heading {
	margin: 0 0 16px;
	font-family: var(--font-label);
	font-size: var(--fs-micro);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--accent-orange);
}

/* 7. Testimonials: with only a few quotes, show them once in a centred row. */
.testimonial-card__quote p {
	margin: 0;
}

.testimonial-card__quote p + p {
	margin-top: 0.75em;
}

.testimonials-marquee--static .testimonials-track {
	width: auto;
	flex-wrap: wrap;
	justify-content: center;
	animation: none;
}

.testimonials-marquee--static .testimonial-card {
	width: min(100%, 26rem);
}

/* 8. Stats: four matching cards, two per row, four on wide screens. */
.abs-stats__grid--quad {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 60rem) {
	.abs-stats__grid--quad {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (max-width: 26rem) {
	.abs-stats__grid--quad .abs-stat {
		padding: 1.25rem 1rem;
	}
}

/* 10. Industries: neighbouring cards keep their icon and title visible. */
.ic-slide:not([data-pos="center"]) .ic-slide__content {
	opacity: 1;
	transform: none;
}

.ic-slide__content p {
	transition: opacity 400ms var(--ease);
}

.ic-slide:not([data-pos="center"]) .ic-slide__content p {
	opacity: 0;
}

/* 11. Footer contact icons: one size, aligned to the first line of text. */
.footer-contact li {
	align-items: flex-start;
}

.footer-contact img {
	flex: none;
	width: 18px;
	height: 18px;
	margin-top: 3px;
	margin-top: calc((1lh - 18px) / 2);
}

/* 12. Hero: two buttons side by side. */
/* (hero button gap removed: set in hero-light.css) */

/* 13. Nav logo: larger, tightly cropped logo so it reads clearly. */
#cs-navigation .cs-logo {
	width: auto;
	max-width: none;
	height: auto;
	flex-shrink: 0;
}
#cs-navigation .cs-logo img {
	display: block;
	width: auto;
	height: 2.5rem; /* 40px on mobile */
	max-width: 70vw;
	object-fit: contain;
}
@media only screen and (min-width: 1024px) {
	#cs-navigation .cs-logo img {
		height: 2.875rem; /* 46px on desktop */
	}
}

/* 14. Legal: form consent line, footer legal links, text pages, cookie notice. */
.form-consent {
	font-size: 0.8rem;
	line-height: 1.5;
	color: var(--text-muted);
	margin: 4px 0 14px;
}
.form-consent a { text-decoration: underline; color: inherit; }

.footer-legal { display: inline-flex; flex-wrap: wrap; gap: 6px 18px; }
.footer-legal a,
.footer-cookie-link { color: inherit; text-decoration: none; }
.footer-legal a:hover,
.footer-cookie-link:hover { text-decoration: underline; }
.footer-cookie-link { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }

.blog-post-content ul { list-style: disc; }
.blog-post-content ol { list-style: decimal; }
.blog-post-content li { margin: 0.4em 0; }

.abs-cookie {
	position: fixed;
	left: 16px;
	bottom: 16px;
	z-index: 10000;
	max-width: 420px;
	padding: 18px 20px;
	background: #111;
	color: #f5f5f5;
	border-radius: 14px;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
	font-size: 0.875rem;
	line-height: 1.5;
}
.abs-cookie[hidden] { display: none; }
.abs-cookie__text { margin: 0; }
.abs-cookie__text a { color: inherit; text-decoration: underline; margin-left: 4px; }
.abs-cookie__actions { display: flex; gap: 10px; margin-top: 14px; justify-content: flex-end; }
.abs-cookie__btn {
	border: 1px solid #fff;
	background: #fff;
	color: #111;
	border-radius: 999px;
	padding: 8px 18px;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}
.abs-cookie__btn--ghost { background: transparent; color: #fff; border-color: rgba(255, 255, 255, 0.4); }
.abs-cookie__btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
@media (max-width: 600px) {
	.abs-cookie { left: 12px; right: 12px; bottom: 12px; max-width: none; }
}