/* =======================================================================
   A.N.I Child Theme: Component Styles
   Ported from homepage-proto/style.css: same class names so Elementor
   sections just need the matching CSS class assigned.
   RTL-safe: logical CSS only (margin-inline / inset-inline-* / block-*).
   Link colour: --ani-blue (#1D66F0): never pink.
   ======================================================================= */

/* ---------------------------------------------------------------- reset / base */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	font-family: var(--ani-font);
	color: var(--ani-body);
	background: var(--ani-white);
	line-height: 1.65;
	font-size: 17px;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}

img, svg { display: block; max-width: 100%; }

/* Fix: override Hello Elementor / WP default link colour: must be blue, not pink */
a { color: inherit; text-decoration: none; }

h1, h2, h3 { margin: 0; color: var(--ani-ink); line-height: 1.18; font-weight: 800; }

p { margin: 0; }

ul { margin: 0; padding: 0; list-style: none; }

:focus-visible {
	outline: 3px solid var(--ani-blue);
	outline-offset: 3px;
	border-radius: 4px;
}

/* LTR isolation for latin/numbers/codes inside RTL */
[dir="ltr"] { unicode-bidi: isolate; }

/* ---------------------------------------------------------------- utilities */
.ani-container,
.container {
	width: 100%;
	max-width: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
}

.skip-link,
.ani-skip-link {
	position: absolute;
	inset-inline-start: 16px;
	inset-block-start: -60px;
	z-index: 100;
	background: var(--ani-blue);
	color: var(--ani-white);
	padding: 10px 18px;
	border-radius: var(--ani-radius-btn);
	transition: inset-block-start .15s ease;
}
.skip-link:focus,
.ani-skip-link:focus { inset-block-start: 16px; }

.section { padding-block: 88px; }
.section--surface { background: var(--ani-surface); }

.section-title {
	font-size: clamp(1.6rem, 1.1rem + 1.7vw, 2.1rem);
	letter-spacing: -0.01em;
	font-family: var(--ani-font);
	position: relative;
	padding-block-end: 18px;
}

/* Blue accent underline: 48px centered bar beneath every section title */
.section-title::after {
	content: "";
	display: block;
	width: 48px;
	height: 3px;
	background: var(--ani-blue);
	border-radius: 2px;
	margin-block-start: 12px;
}

.section-title--center {
	text-align: center;
	margin-block-end: 48px;
}

/* Center the underline for centered titles */
.section-title--center::after {
	margin-inline: auto;
}

.eyebrow {
	color: var(--ani-blue);
	font-weight: 600;
	font-size: 0.85rem;
	margin-block-end: 10px;
}

/* ---------------------------------------------------------------- buttons */
.btn,
.ani-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 48px;
	padding: 13px 28px;
	border-radius: 4px;   /* squared, professional/industrial: not rounded/toyish */
	font-weight: 700;
	font-size: 1rem;
	font-family: var(--ani-font);
	border: 1px solid transparent;
	cursor: pointer;
	text-decoration: none;
	transition: background .15s ease, transform .15s ease, box-shadow .15s ease;
	white-space: nowrap;
}
.btn--primary,
.ani-btn--primary {
	background: var(--ani-blue);
	color: var(--ani-white) !important;
	box-shadow: 0 8px 20px rgba(31, 109, 255, .28);
}
.btn--primary:hover,
.ani-btn--primary:hover {
	background: var(--ani-blue-deep);
	transform: translateY(-2px);
	box-shadow: 0 12px 26px rgba(31, 109, 255, .34);
}
.btn--primary:active,
.ani-btn--primary:active {
	transform: translateY(0);
	box-shadow: 0 4px 12px rgba(31, 109, 255, .24);
}

/* Outline / secondary button: used for per-card CTAs (real button look) */
.btn--outline {
	background: var(--ani-white);
	color: var(--ani-blue) !important;
	border-color: var(--ani-border);
}
.btn--outline:hover {
	background: var(--ani-blue);
	color: var(--ani-white) !important;
	border-color: var(--ani-blue);
	transform: translateY(-2px);
	box-shadow: 0 10px 22px rgba(31, 109, 255, .22);
}
.btn--outline:active {
	transform: translateY(0);
}
.btn--outline .arrow { transition: transform .15s ease; }
.btn--outline:hover .arrow { transform: translateX(-3px); }

/* Inline SVG arrow inside buttons */
.btn-arrow,
.ani-btn-arrow {
	display: inline-block;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	transition: transform .15s ease;
}
.btn--primary:hover .btn-arrow,
.ani-btn--primary:hover .ani-btn-arrow {
	transform: translateX(-3px);
}

/* Legacy text arrow (keep for backward-compat with existing Elementor HTML) */
.arrow,
.ani-arrow { font-size: 1.05em; line-height: 1; }

.link-arrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--ani-blue);
	font-weight: 600;
}
.link-arrow:hover { color: var(--ani-blue-deep); }

/* ================================================================ header */
.site-header,
.ani-site-header {
	position: sticky;
	inset-block-start: 0;
	z-index: 1000;
	background: var(--ani-white);
	border-block-end: 1px solid var(--ani-border);
	transition: transform .28s ease, box-shadow .28s ease;
	will-change: transform;
}

/* JS-driven hide/show: translateY off screen when hidden */
.ani-header--hidden {
	transform: translateY(-100%);
}

/* Subtle shadow + blur when user has scrolled past the fold */
.ani-header--scrolled {
	box-shadow: 0 2px 16px rgba(13, 20, 27, .10);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

.header-inner,
.ani-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 76px;
	gap: 24px;
	width: 100%;
	max-width: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
}

.brand,
.ani-brand {
	display: inline-flex;
	align-items: center;
	gap: 12px;
}

.logo-mark,
.ani-logo-mark {
	display: inline-flex;
	color: var(--ani-blue);
	flex: none;
}

.brand__text,
.ani-brand__text { display: flex; flex-direction: column; line-height: 1.15; }

.brand__name,
.ani-brand__name {
	font-weight: 800;
	font-size: 1.25rem;
	color: var(--ani-ink);
	letter-spacing: 0.01em;
}

.brand__tagline,
.ani-brand__tagline {
	font-size: 0.72rem;
	color: var(--ani-muted);
	font-weight: 500;
}

.header-nav ul,
.ani-header-nav ul,
.ani-nav-list {
	display: flex;
	align-items: center;
	gap: 32px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.header-nav a,
.ani-header-nav a,
.ani-nav-list a {
	color: var(--ani-body);
	font-weight: 500;
	font-size: 0.98rem;
	padding-block: 8px;
	transition: color .15s ease;
	text-decoration: none;
}

.header-nav a:hover,
.ani-header-nav a:hover,
.ani-nav-list a:hover { color: var(--ani-blue); }

/* Contact button in header: compact, pill-shaped, vertically centered */
.ani-btn--contact {
	font-size: 0.92rem;
	padding: 10px 22px;
	min-height: 40px;
	border-radius: 4px;
	white-space: nowrap;
	flex-shrink: 0;
	/* Override the taller default min-height for the header context */
	line-height: 1;
}

/* ================================================================= hero */
/* ===================================================================== HERO
   1-for-1 with client-approved reference (hero-reference-liked.png):
   copy zone LEFT (~38%): blueprint bg wash, H1 + sub + rule + tagline + 2 btns.
   mosaic RIGHT (~62%): 2-row photo grid, thin white gaps, diagonal left seam.
   Stats bar (s1b): full-width, 4 stat items with icons + dividers. */

/* --- hero wrapper --------------------------------------------------- */
.hero {
	position: relative;
	overflow: hidden;
	background: var(--ani-white);
	padding-block: 0;
}

/* --- two-column layout --------------------------------------------- */
/* RTL: col-1 renders on the RIGHT visually, col-2 on the LEFT.
   We want: mosaic RIGHT, copy LEFT → mosaic=col-1(DOM first), copy=col-2(DOM second).
   Fixed block-size: rich copy zone (spec table + para) needs ~740px.
   Mosaic fills via align-items: stretch; overflow: hidden clips at the seam. */
.hero__inner {
	display: grid;
	grid-template-columns: 62fr 38fr; /* col-1 (mosaic, right) | col-2 (copy, left) */
	block-size: clamp(660px, 55vw, 780px);
	align-items: stretch;
	overflow: hidden;
}

/* --- copy zone (LEFT in RTL: appears on the right side visually) -- */
.hero__copy {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;       /* RTL: cross-axis end = hug right visual edge */
	text-align: end;
	overflow: hidden;            /* clip spec table if hero is constrained */
	padding-block: clamp(32px, 3.5vw, 56px);
	padding-inline: clamp(24px, 4vw, 60px) clamp(32px, 5vw, 72px);
	/* faint blueprint wash */
	background-color: var(--ani-blueprint);
	background-image: url("../blueprint.webp");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	/* blueprint is a pattern: layer white wash on top so it's barely visible */
	isolation: isolate;
}
.hero__copy::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: rgba(243, 246, 251, .87);
	pointer-events: none;
}
.hero__copy > * { position: relative; z-index: 1; }

.hero h1 {
	font-size: clamp(2rem, 1rem + 3vw, 3.2rem);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.02em;
	color: var(--ani-ink);
	margin: 0;
}

.hero__sub {
	margin-block-start: 10px;
	font-size: clamp(.92rem, .82rem + .3vw, 1.05rem);
	line-height: 1.55;
	color: var(--ani-muted);
}

/* short blue rule */
.hero__rule {
	display: block;
	inline-size: 48px;
	block-size: 3px;
	background: var(--ani-blue);
	margin-block: 14px;
	border-radius: 2px;
}

.hero__tagline {
	font-size: clamp(.9rem, .8rem + .3vw, 1.05rem);
	font-weight: 700;
	color: var(--ani-ink);
	line-height: 1.5;
}

/* buttons row */
.hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-block-start: 18px;
	align-items: center;
	justify-content: flex-end; /* RTL: visual left */
}

/* outline variant: thin border, blue text, icon */
.btn--outline-hero {
	background: transparent;
	color: var(--ani-ink) !important;
	border: 1.5px solid var(--ani-border);
}
.btn--outline-hero:hover {
	border-color: var(--ani-blue);
	color: var(--ani-blue) !important;
}
.btn--outline-hero .hero-play {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--ani-blue);
	color: var(--ani-white);
	font-size: .6rem;
	flex-shrink: 0;
}

/* --- mosaic (RIGHT visually = col-1 in RTL grid) ------------------- */
.hero__mosaic {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 3px;
	block-size: 100%;  /* fill the grid row height */
	background: var(--ani-white); /* gap colour between tiles */
	/* diagonal seam on the LEFT edge (facing the copy zone, which is right in RTL) */
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
	overflow: hidden;
}

.hero__mosaic-row {
	display: flex;
	gap: 3px;
	flex: 1;
	align-items: stretch;
	min-block-size: 0;
}

/* top row: t1-cnc wider, t2-carbon narrower */
.hero__mosaic-row--top { flex: 1.1; }
.hero__mosaic-row--top .hero__tile:first-child  { flex: 1.55; }
.hero__mosaic-row--top .hero__tile:last-child   { flex: 1; }

/* bottom row: 3 equal tiles */
.hero__mosaic-row--btm { flex: 1; }
.hero__mosaic-row--btm .hero__tile { flex: 1; }

.hero__tile {
	overflow: hidden;
	position: relative;
	display: flex;        /* ensure tile stretches to fill row height */
	flex: 1;
}
.hero__tile img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	display: block;
	flex: 1;             /* img fills the tile */
	min-block-size: 0;
}

/* entrance animations */
@media (prefers-reduced-motion: no-preference) {
	.hero__copy { animation: hero-rise .65s cubic-bezier(.19,1,.22,1) both; }
	.hero__mosaic { animation: hero-rise .65s cubic-bezier(.19,1,.22,1) .08s both; }
	@keyframes hero-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
}

/* kill Elementor's default 10px widget-wrap/column padding in the hero -
   it leaves a white strip above and below the full-bleed hero content */
.hero .elementor-widget-wrap,
.hero .elementor-element-populated,
.hero .elementor-widget-container { padding: 0 !important; }

/* --- stats bar (s1b): seamlessly continues the hero block ---------- */
.hero-stats {
	display: flex;
	align-items: stretch;
	justify-content: center;
	background: var(--ani-surface);
	border-block-start: 1px solid var(--ani-border); /* single hairline tying it to the hero */
}

.hero-stats__item {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	padding: 28px clamp(16px, 3vw, 40px);
	position: relative;
}

/* hairline divider between items (RTL-safe) */
.hero-stats__item + .hero-stats__item::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	inset-block: 24%;
	inline-size: 1px;
	background: var(--ani-border);
}

/* icon to the LEFT of the number (matches reference): text first (right), icon last (left) */
.hero-stats__icon {
	order: 2;
	flex-shrink: 0;
	color: var(--ani-blue);
	display: flex;
	align-items: center;
}

.hero-stats__text {
	order: 1;
	display: flex;
	flex-direction: column;
	gap: 3px;
	text-align: start;
}

.hero-stats__num {
	font-family: var(--ani-mono);
	font-size: clamp(1.5rem, 1.2rem + .8vw, 2rem);
	font-weight: 700;
	color: var(--ani-ink);
	line-height: 1;
	direction: ltr;
	display: inline-block;
}

.hero-stats__label {
	font-size: .94rem;
	color: var(--ani-body);
	white-space: nowrap;
}

/* ---- mobile: stack to single column, mosaic as 2x3 grid ---------- */
@media (max-width: 760px) {
	.hero__inner {
		grid-template-columns: 1fr;
		block-size: auto;
	}
	/* copy (DOM-second) appears first on mobile */
	.hero__copy {
		order: -1;
		padding-block: 40px;
		padding-inline: 24px;
	}
	.hero__mosaic {
		block-size: 340px;
		clip-path: none;
	}
	.hero__mosaic-row--top { flex: 1.2; }

	/* D-2: 3 tiles across while they still fit, then a tidy centred 1-per-row
	   stack. The old 48% basis produced an orphan third tile on a second row. */
	.hero-stats {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}
	.hero-stats__item {
		padding-inline: 8px;
		padding-block: 20px;
	}
}

/* ================================================== trusted-by strip / marquee */
.trusted {
	background: var(--ani-white);
	border-block-end: 1px solid var(--ani-border);
	padding-block: 28px 32px;
	overflow: hidden;
}

.trusted__title {
	text-align: center;
	color: var(--ani-muted);
	font-size: .92rem;
	margin: 0 0 20px;
}

/* Marquee track: two identical logo sets end-to-end for seamless loop */
.trusted__track {
	display: flex;
	align-items: center;
	width: max-content;
	animation: ani-marquee 34s linear infinite;
	will-change: transform;
}

@keyframes ani-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

/* Pause on hover for accessibility */
.trusted:hover .trusted__track {
	animation-play-state: paused;
}

/* Each logo set: trailing space lives INSIDE the set so the loop seam spacing
   equals the inter-logo spacing → perfectly seamless, no jump. translateX(-50%)
   then equals exactly one set width (track = two identical sets). */
.trusted__set {
	display: flex;
	align-items: center;
	gap: 0 52px;
	padding-inline-end: 52px;
	flex-shrink: 0;
}

/* Legacy static row: kept for fallback / no-JS */
.trusted__row {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 18px 44px;
	padding: 0;
	margin: 0;
}

.trusted__name {
	color: var(--ani-muted);
	font-weight: 700;
	font-size: 1.05rem;
	opacity: 1;
	transition: opacity .2s, color .2s;
}

.trusted__name:hover { opacity: 1; color: var(--ani-ink); }

.trusted__logo,
.elementor .trusted__logo,
.elementor-widget-container .trusted__logo {
	height: 28px !important;
	width: auto !important;
	max-width: 118px !important;
	min-width: 0 !important;
	object-fit: contain !important;
	filter: grayscale(1);
	opacity: .55;
	transition: filter .2s, opacity .2s;
	display: block !important;
	flex: 0 0 auto !important;
}

.trusted__logo:hover { filter: grayscale(0); opacity: 1; }

/* Marquee mode (JS-upgraded from the static row): clip overflow + larger logos */
.trusted--static.is-marquee { overflow: hidden; }
.trusted--static.is-marquee .trusted__row { display: none; }
.trusted__track .trusted__logo,
.elementor .trusted__track .trusted__logo,
.elementor-widget-container .trusted__track .trusted__logo {
	height: 40px !important;
	max-width: 150px !important;
	opacity: .62;
}
.trusted__track .trusted__name { font-size: 1.25rem; }

/* real photo fills the media box */
.media-box--photo {
	border: 0;
	padding: 0;
	overflow: hidden;
	background: transparent;
	place-items: stretch;
}

.media-box--photo img {
	width: 100%;
	height: 100%;
	min-height: inherit;
	object-fit: cover;
	border-radius: var(--ani-radius-card);
	display: block;
}

.logo-mark img, img.logo-mark { object-fit: contain; }

/* ================================================= what we do / cards */
.cards-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}

.card {
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	box-shadow: var(--ani-shadow-card);
	padding: 36px 28px;
	text-align: center;
}

.card__icon {
	display: inline-flex;
	color: var(--ani-blue);
	margin-block-end: 18px;
}

.card__title {
	font-size: 1.2rem;
	font-weight: 700;
	margin-block-end: 12px;
}

.card__blurb {
	color: var(--ani-muted);
	font-size: 0.98rem;
	line-height: 1.6;
}

/* ===================================== what we do: clean static capability grid
   Homepage "מה אנחנו עושים". On-brand per design-language.md: clean-technical,
   one blue accent, no scroll-jacking. 5 tiles centre-balanced (3 + 2). Each tile
   is a card with a photo, title, one-line description and a button-styled CTA;
   the whole tile is a single stretched link. RTL is the default. */
.cap-eyebrow {
	display: block;
	text-align: center;
	color: var(--ani-blue);
	font-weight: 700;
	font-size: 0.82rem;
	letter-spacing: 0.04em;
	margin: 0 0 10px;
}

.cap-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 26px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.cap-tile {
	position: relative;
	flex: 1 1 300px;
	max-inline-size: 360px;
	display: flex;
	flex-direction: column;
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	box-shadow: var(--ani-shadow-card);
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}
.cap-tile:hover,
.cap-tile:focus-within {
	box-shadow: 0 12px 30px rgba(31, 109, 255, 0.14);
	transform: translateY(-4px);
	border-color: rgba(31, 109, 255, 0.35);
}

.cap-tile__media {
	display: block;
	aspect-ratio: 3 / 2;
	background: var(--ani-blueprint);
	overflow: hidden;
}
.cap-tile__media img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.35s ease;
}
.cap-tile:hover .cap-tile__media img {
	transform: scale(1.04);
}

.cap-tile__body {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px 24px 26px;
	flex: 1 1 auto;
	text-align: start;
}
.cap-tile__title {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--ani-ink);
	margin: 0;
}
.cap-tile__desc {
	color: var(--ani-muted);
	font-size: 0.96rem;
	line-height: 1.55;
	margin: 0;
	flex: 1 1 auto;
}
.cap-tile__cta {
	margin-block-start: 16px;
	align-self: flex-start;
}
/* stretched link: the whole tile is clickable; the CTA stays a real button */
.cap-tile__cta::after {
	content: "";
	position: absolute;
	inset: 0;
}

@media (prefers-reduced-motion: reduce) {
	.cap-tile,
	.cap-tile__media img { transition: none; }
	.cap-tile:hover { transform: none; }
	.cap-tile:hover .cap-tile__media img { transform: none; }
}

/* ================================================== materials pills (legacy, kept for compat) */
.pills {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
}

.pill {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: 999px;
	padding: 12px 22px;
	min-height: 48px;
	box-shadow: 0 1px 2px rgba(13, 20, 27, .04);
}

.pill__icon { display: inline-flex; color: var(--ani-blue); flex: none; }

.pill__label {
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--ani-ink);
}

/* ================================================== materials SPEC CARDS: 6-up grid, swatch + specs */

/* Legacy pill/old card styles kept dormant for compat: new grid replaces them */
.mat-cards--legacy {
	display: flex;
	flex-wrap: nowrap;
	gap: 20px;
	justify-content: center;
	align-items: stretch;
}

/* --- New spec-card grid --- */
.mat-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.mat-card {
	display: flex;
	flex-direction: column;
	gap: 0;
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: 14px;
	box-shadow: 0 2px 12px rgba(13, 20, 27, .06);
	overflow: hidden;
	transition: box-shadow .18s ease, transform .18s ease;
}

.mat-card:hover {
	box-shadow: 0 8px 28px rgba(31, 109, 255, .14);
	transform: translateY(-3px);
}

/* Swatch image: fills top of card, fixed height, object-cover */
.mat-card__swatch {
	display: block;
	width: 100%;
	height: 140px;
	object-fit: cover;
	flex-shrink: 0;
}

/* Card body: padding below swatch */
.mat-card__body {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 20px 22px 22px;
	flex: 1 1 auto;
}

/* Material name: Latin, LTR-isolated, bold */
.mat-card__name {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--ani-ink);
	direction: ltr;
	unicode-bidi: isolate;
	margin: 0;
}

/* Spec / property line: monospace, muted, small */
.mat-card__spec {
	font-family: var(--ani-mono);
	font-size: 0.8rem;
	font-weight: 400;
	color: var(--ani-muted);
	line-height: 1.5;
	margin: 0;
}

/* "Best for" line */
.mat-card__bestfor {
	font-size: 0.88rem;
	color: var(--ani-body);
	line-height: 1.5;
	margin: 0;
}

.mat-card__bestfor strong {
	color: var(--ani-ink);
	font-weight: 600;
}

/* ================================================== materials LIST: expand-on-hover (replaces swatch cards) */

/* Outer list: tight vertical stack */
.mat-list {
	display: flex;
	flex-direction: column;
	gap: 0;
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	overflow: hidden;
	background: var(--ani-white);
	box-shadow: var(--ani-shadow-card);
}

/* Each row */
.mat-row {
	display: flex;
	flex-direction: column;
	border-block-end: 1px solid var(--ani-border);
	transition: background .18s ease;
	cursor: default;
}

.mat-row:last-child { border-block-end: none; }

/* Collapsed header: always visible */
.mat-row__head {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px 22px;
	min-block-size: 58px;
}

/* SVG icon */
.mat-row__icon {
	display: inline-flex;
	color: var(--ani-blue);
	flex-shrink: 0;
	width: 28px;
	height: 28px;
}

.mat-row__icon svg {
	width: 28px;
	height: 28px;
}

/* Material name: Latin, LTR, semibold */
.mat-row__name {
	font-size: 1rem;
	font-weight: 700;
	color: var(--ani-ink);
	direction: ltr;
	unicode-bidi: isolate;
	flex: 1 1 auto;
}

/* Expand indicator: rotates on hover, RTL-safe */
.mat-row__caret {
	display: inline-flex;
	color: var(--ani-muted);
	flex-shrink: 0;
	transition: transform .22s ease;
}

/* Detail panel: hidden by default via max-height + opacity */
.mat-row__detail {
	max-block-size: 0;
	overflow: hidden;
	opacity: 0;
	padding-inline: 22px;
	padding-block: 0;
	transition:
		max-block-size .28s ease,
		opacity .22s ease,
		padding-block .22s ease;
}

/* Expand on hover and :focus-within (keyboard a11y) */
.mat-row:hover,
.mat-row:focus-within {
	background: var(--ani-surface);
}

.mat-row:hover .mat-row__detail,
.mat-row:focus-within .mat-row__detail {
	max-block-size: 120px;
	opacity: 1;
	padding-block: 0 18px;
}

.mat-row:hover .mat-row__caret,
.mat-row:focus-within .mat-row__caret {
	transform: rotate(90deg);
}

/* Spec line inside detail: monospace */
.mat-row__spec {
	font-family: var(--ani-mono);
	font-size: 0.78rem;
	color: var(--ani-muted);
	line-height: 1.6;
	margin: 0 0 4px;
}

/* Best-for line inside detail */
.mat-row__bestfor {
	font-size: 0.88rem;
	color: var(--ani-body);
	line-height: 1.5;
	margin: 0;
}

.mat-row__bestfor strong {
	color: var(--ani-ink);
	font-weight: 600;
}

/* prefers-reduced-motion: skip the transition, show detail statically */
@media (prefers-reduced-motion: reduce) {
	.mat-row__detail {
		max-block-size: none !important;
		opacity: 1 !important;
		padding-block: 0 14px !important;
		transition: none !important;
	}
	.mat-row__caret { display: none; }
}

/* ================================================== industries SPLIT: text + logos 2-col */

/* Outer wrapper */
.ind-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 64px;
	align-items: center;
}

/* Text side */
.ind-split__text { }

.ind-split__title {
	font-size: clamp(1.6rem, 1.1rem + 1.7vw, 2.1rem);
	font-weight: 800;
	color: var(--ani-ink);
	position: relative;
	padding-block-end: 18px;
	margin-block-end: 20px;
}

/* Accent underline: same pattern as .section-title::after */
.ind-split__title::after {
	content: "";
	display: block;
	width: 48px;
	height: 3px;
	background: var(--ani-blue);
	border-radius: 2px;
	margin-block-start: 12px;
}

.ind-split__para {
	font-size: 1rem;
	color: var(--ani-body);
	line-height: 1.72;
	margin-block-end: 16px;
	max-width: 46ch;
}

.ind-split__sectors {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	margin-block-start: 4px;
}

.ind-split__sector {
	font-size: 0.83rem;
	font-weight: 600;
	color: var(--ani-muted);
}

/* Logo grid: right side in RTL (inline-end), left in LTR */
.ind-split__logos {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px 16px;
	align-items: center;
}

/* Each logo cell: centered, fixed height box */
.ind-split__logo-cell {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 12px 8px;
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: 8px;
	min-block-size: 64px;
	transition: border-color .18s ease, box-shadow .18s ease;
}

.ind-split__logo-cell:hover {
	border-color: rgba(31, 109, 255, .3);
	box-shadow: 0 2px 12px rgba(31, 109, 255, .1);
}

/* Logo image: always grayscale, uniform contained size, defensive !important against Elementor blowup */
.ind-split__logo,
.elementor .ind-split__logo,
.elementor-widget-container .ind-split__logo {
	max-block-size: 40px !important;
	max-inline-size: 120px !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain !important;
	display: block !important;
	filter: grayscale(1);
	opacity: .6;
	transition: filter .2s ease, opacity .2s ease;
	margin-inline: auto !important;
}

.ind-split__logo-cell:hover .ind-split__logo,
.ind-split__logo-cell:focus-within .ind-split__logo {
	filter: grayscale(0);
	opacity: 1;
}

/* Responsive */
@media (max-width: 880px) {
	.ind-split {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.ind-split__logos {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 600px) {
	.ind-split__logos {
		grid-template-columns: repeat(3, 1fr);
	}
	.ind-split__para { max-width: none; }
}

/* ================================================== spec strip: tolerances + file formats */
.spec-strip {
	background: var(--ani-blueprint);
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	padding: 22px 28px;
	margin-block-start: 36px;
	text-align: center;
	font-family: var(--ani-mono);
	font-size: 0.82rem;
	color: var(--ani-muted);
	line-height: 1.65;
}

/* Typical-values pill badge: amber outline, signals "placeholder to confirm" */
.spec-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-family: var(--ani-mono);
	font-size: 0.7rem;
	font-weight: 500;
	color: #92601A;               /* amber-brown: NOT a brand colour, only used here for warning */
	background: rgba(217, 145, 30, .1);
	border: 1px solid rgba(217, 145, 30, .45);
	border-radius: 999px;
	padding: 2px 10px;
	vertical-align: middle;
	margin-inline-start: 6px;
	white-space: nowrap;
}

/* File-format chips inside spec strip */
.spec-formats {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	margin-block-start: 8px;
}

.spec-fmt {
	font-family: var(--ani-mono);
	font-size: 0.78rem;
	font-weight: 500;
	color: var(--ani-blue);
	background: rgba(31, 109, 255, .07);
	border: 1px solid rgba(31, 109, 255, .22);
	border-radius: 6px;
	padding: 3px 10px;
	direction: ltr;
	unicode-bidi: isolate;
	letter-spacing: 0.02em;
}

/* ================================================== materials CHIP GRID: grouped (replaces mat-list) */

/* Outer container: stacks three groups vertically */
.mat-chip-grid {
	display: flex;
	flex-direction: column;
	gap: 28px;
}

/* One group: label + flex-wrap chip row */
.mat-chip-group {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* Group label: small, muted, Hebrew, no letter-spacing */
.mat-chip-group__label {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--ani-muted);
	line-height: 1;
}

/* Chip row: wraps naturally */
.mat-chip-row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* Individual chip: pill, subtle surface bg or 1px border */
.mat-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--ani-surface);
	border: 1px solid var(--ani-border);
	border-radius: 999px;
	padding: 6px 14px 6px 10px;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.mat-chip:hover {
	border-color: rgba(31, 109, 255, .35);
	box-shadow: 0 1px 6px rgba(31, 109, 255, .1);
}

/* Icon inside chip: 20×20, blue stroke */
.mat-chip__icon {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	color: var(--ani-blue);
}

/* Material name: Latin, LTR-isolated, small, semibold */
.mat-chip__name {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--ani-ink);
	direction: ltr;
	unicode-bidi: isolate;
	white-space: nowrap;
}

/* ================================================== industries logos: bare (no card cells) */

/* Override the grid so bare logos space evenly */
.ind-bare-logos {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px 20px;
	align-items: center;
	justify-items: center;
}

/* Bare logo img: grayscale, capped, no borders/shadows */
.ind-bare-logo,
.elementor .ind-bare-logo,
.elementor-widget-container .ind-bare-logo {
	max-block-size: 36px !important;
	max-inline-size: 130px !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain !important;
	display: block !important;
	filter: grayscale(1);
	opacity: .55;
	transition: filter .2s ease, opacity .2s ease;
}

.ind-bare-logo:hover {
	filter: grayscale(0);
	opacity: 1;
}

@media (max-width: 880px) {
	.ind-bare-logos {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 600px) {
	.ind-bare-logos {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* mat-card__label kept for old cards in compat HTML */
.mat-card__label {
	font-weight: 600;
	font-size: 1rem;
	color: var(--ani-ink);
	direction: ltr;
	unicode-bidi: isolate;
	white-space: nowrap;
}

.mat-ico {
	width: 30px;
	height: 30px;
	flex-shrink: 0;
	color: var(--ani-blue);
}

/* ================================================== process / "איך זה עובד" strip */
.process { padding-block: 88px; }

.process__steps {
	display: flex;
	align-items: flex-start;
	gap: 0;
	overflow-x: auto;
	padding-block-end: 8px;
}

.process__step {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	flex: 1 1 0;
	min-width: 100px;
	position: relative;
	padding-inline: 8px;
}

/* Connector arrow between steps: logical so RTL works */
.process__step:not(:last-child)::after {
	content: "";
	position: absolute;
	inset-block-start: 22px;
	inset-inline-end: -2px;
	width: 24px;
	height: 2px;
	background: var(--ani-blue);
	opacity: .35;
}

/* In RTL the arrow tip should point the other way: handled by dir=rtl on html */
[dir="rtl"] .process__step:not(:last-child)::after {
	inset-inline-end: auto;
	inset-inline-start: -2px;
}

.process__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--ani-blue);
	color: var(--ani-white);
	font-size: 1rem;
	font-weight: 700;
	margin-block-end: 12px;
	flex-shrink: 0;
}

.process__label {
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--ani-ink);
	line-height: 1.3;
}

/* ================================================== industries & clients: "התעשיות והלקוחות שלנו" */
.industries { padding-block: 88px; background: var(--ani-surface); }

/* Old icon-tile layout: kept dormant for compat */
.industries__row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 24px 40px;
}

.industry-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-align: center;
	min-width: 90px;
}

.industry-item__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 16px;
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	color: var(--ani-blue);
	box-shadow: var(--ani-shadow-card);
}

.industry-item__icon svg {
	width: 32px;
	height: 32px;
}

.industry-item__label {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--ani-body);
}

/* ---- New sector-card grid (5 cards × equal columns) ---- */
.ind-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
}

.ind-card {
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	box-shadow: var(--ani-shadow-card);
	padding: 24px 20px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	transition: box-shadow .18s ease, transform .18s ease;
}

.ind-card:hover {
	box-shadow: 0 6px 24px rgba(31, 109, 255, .12);
	transform: translateY(-2px);
}

.ind-card__header {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ind-card__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: rgba(31, 109, 255, .08);
	color: var(--ani-blue);
	flex-shrink: 0;
}

.ind-card__icon svg {
	width: 22px;
	height: 22px;
}

.ind-card__title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--ani-ink);
	margin: 0;
}

/* Logo row inside each sector card */
.ind-card__logos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 16px;
	min-block-size: 52px;       /* consistent card height */
}

.ind-logo,
.elementor .ind-logo,
.elementor-widget-container .ind-logo {
	height: 24px !important;
	width: auto !important;
	max-width: 80px !important;
	min-width: 0 !important;
	object-fit: contain !important;
	filter: grayscale(1);
	opacity: .55;
	transition: filter .2s, opacity .2s;
	display: block !important;
}

.ind-logo:hover { filter: grayscale(0); opacity: 1; }

/* Text-only logo badge (for firms without an image asset) */
.ind-logo-text {
	font-size: 0.78rem;
	font-weight: 700;
	color: var(--ani-muted);
	opacity: 1;
	direction: ltr;
	unicode-bidi: isolate;
}

/* General placeholder for sectors with no named client */
.ind-general {
	font-size: 0.85rem;
	color: var(--ani-muted);
	font-style: italic;
	line-height: 1.5;
}

/* ====================================================== project split: balanced 52/48 */
.project {
	display: grid;
	grid-template-columns: 52fr 48fr;
	gap: 48px;
	align-items: center;
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	box-shadow: var(--ani-shadow-card);
	padding: 40px;
}

.project__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.project__heading {
	font-size: 1.5rem;
	font-weight: 700;
	margin-block: 6px 14px;
}

.project__blurb {
	color: var(--ani-muted);
	margin-block-end: 22px;
}

/* Constrained landscape photo frame */
.project__photo {
	border-radius: var(--ani-radius-card);
	overflow: hidden;
	aspect-ratio: 16 / 10;
	max-block-size: 340px;
	width: 100%;
}

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

/* ====================================================== CTA band */
.cta-band {
	position: relative;
	overflow: hidden;
	background-color: var(--ani-blueprint);
	background-image:
		linear-gradient(rgba(247,249,253,.74), rgba(247,249,253,.74)),
		url("../blueprint.webp");
	background-size: cover, cover;
	background-position: center;
	background-repeat: no-repeat;
	border-block: 1px solid var(--ani-border);
	padding-block: 88px;
}

.cta-band__inner {
	position: relative;
	z-index: 1;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	max-width: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
}

.cta-band__title {
	font-size: clamp(1.7rem, 1.1rem + 2vw, 2.3rem);
	letter-spacing: -0.01em;
}

.cta-band__sub {
	margin-block: 16px 30px;
	font-size: 1.1rem;
	color: var(--ani-body);
	max-width: 46ch;
}

/* ====================================================== footer */
.site-footer,
.ani-site-footer {
	background: var(--ani-ink);
	border-block-start: 1px solid rgba(255, 255, 255, .08);
}

.ani-footer-full {
	padding: 0;
}

/* Multi-column grid */
.ani-footer-columns {
	display: grid;
	grid-template-columns: 1.45fr 1fr 1.15fr;
	gap: 40px;
	width: 100%;
	max-width: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
	padding-block: 56px 40px;
}

.ani-footer-col--brand { grid-column: 1; }

.ani-footer-col__heading {
	font-size: 0.94rem;
	font-weight: 700;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .82);
	letter-spacing: normal;
	margin: 0 0 18px;
}

.ani-footer-blurb {
	color: rgba(255, 255, 255, .72);
	font-size: 1rem;
	line-height: 1.65;
	margin-block-start: 14px;
	max-width: 30ch;
}

/* Link lists in footer columns */
.ani-footer-links,
.ani-footer-contact {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ani-footer-links a,
.ani-footer-contact a,
.ani-footer-contact li {
	color: rgba(255, 255, 255, .82);
	font-size: 1rem;
	font-weight: 400;
	text-decoration: none;
	transition: color .15s ease;
}

.ani-footer-links a,
.ani-footer-contact a {
	display: inline-flex;
	align-items: center;
	min-block-size: 44px;
}

.ani-footer-contact li {
	display: flex;
	align-items: center;
	min-block-size: 44px;
	overflow-wrap: anywhere;
}

.ani-footer-links a:hover,
.ani-footer-contact a:hover { color: var(--ani-white); }

/* Brand inside dark footer */
.ani-brand--footer .ani-brand__name { color: var(--ani-white); font-size: 1.1rem; }
.ani-brand--footer .ani-brand__tagline { color: rgba(255, 255, 255, .68); }

/* Bottom bar */
.ani-footer-bottom {
	border-block-start: 1px solid rgba(255,255,255,.08);
}

.ani-footer-bottom__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	width: 100%;
	max-width: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
	padding-block: 18px;
}

.footer-copy,
.ani-footer-copy {
	color: rgba(255, 255, 255, .76);
	font-size: 0.94rem;
}

.ani-footer-legal {
	display: flex;
	align-items: center;
	gap: 6px 18px;
	flex-wrap: wrap;
}

.ani-footer-legal a {
	display: inline-flex;
	align-items: center;
	min-block-size: 44px;
	color: rgba(255,255,255,.68);
	font-size: 0.82rem;
	text-decoration: none;
	transition: color .15s ease;
}

.ani-footer-legal a:hover { color: var(--ani-white); }

/* Legacy single-row footer: still used if old footer HTML is present */
.footer-inner,
.ani-footer-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	width: 100%;
	max-width: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
}

.brand--footer .brand__name,
.ani-brand--footer .ani-brand__name { font-size: 1.1rem; }

.footer-nav ul,
.ani-footer-nav ul,
.ani-footer-nav__list {
	display: flex;
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-nav a,
.ani-footer-nav a,
.ani-footer-nav__list a {
	color: var(--ani-body);
	font-weight: 500;
	font-size: 0.95rem;
	padding-block: 6px;
	transition: color .15s ease;
	text-decoration: none;
}

.footer-nav a:hover,
.ani-footer-nav a:hover,
.ani-footer-nav__list a:hover { color: var(--ani-blue); }

/* ================================================ Elementor container reset */
/* Prevent Elementor from adding extra padding/margin inside hero and CTA sections */
.hero .elementor-container,
.hero .e-con,
.cta-band .elementor-container,
.cta-band .e-con {
	max-width: none !important;
	padding: 0 !important;
}

/* Elementor widgets inside sections that use our classes should not override text colour */
.hero .elementor-widget-text-editor a,
.cta-band .elementor-widget-text-editor a,
.elementor a.btn--primary,
.elementor a.ani-btn--primary {
	color: var(--ani-white) !important;
}

/* Fix Elementor default link colour that may be inherited as pink/red */
.elementor a:not(.btn):not(.ani-btn):not(.btn--primary) {
	color: var(--ani-blue);
}

/* ================================================ Heebo enforcement
   Belt-and-suspenders: Elementor's kit defaults load Roboto/Roboto Slab;
   we dequeue those handles in functions.php AND force Heebo here for any
   that slip through (e.g. inlined kit CSS). */
body,
h1, h2, h3, h4, h5, h6,
p, a, span, li, label, button, input, select, textarea,
.elementor-widget-container,
.elementor-widget-container *,
.elementor-heading-title,
.elementor-text-editor,
.elementor-text-editor *,
.section-title,
.card__title,
.card__blurb,
.pill__label,
.mat-card__label,
.industry-item__label,
.ind-card__title,
.ind-general,
.ani-site-header,
.ani-site-header *,
.ani-site-footer,
.ani-site-footer * {
	font-family: var(--ani-font) !important;
}

/* Monospace override: runs after Heebo enforcement block so !important above is countered */
.mat-card__spec,
.spec-strip,
.spec-badge,
.spec-fmt {
	font-family: var(--ani-mono) !important;
}

/* ================================================ responsive */
@media (max-width: 1100px) {
	.ani-footer-columns { grid-template-columns: 1fr 1fr; }
	.ani-footer-col--brand { grid-column: 1 / -1; }
	/* Collapse ind-grid from 5 to 3 columns on medium screens */
	.ind-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 880px) {
	.cards-3 { grid-template-columns: 1fr; gap: 20px; max-width: 440px; margin-inline: auto; }
	.mat-cards--legacy { flex-wrap: wrap; gap: 12px; }
	.mat-grid { grid-template-columns: repeat(2, 1fr); }
	.ind-grid { grid-template-columns: repeat(2, 1fr); }
	.project__photo { max-block-size: none; }
}

@media (max-width: 760px) {
	.section { padding-block: 64px; }
	.industries { padding-block: 56px; }

	/* hero: mobile overrides now live in the hero block above */

	.project { grid-template-columns: 1fr; padding: 28px; gap: 28px; }
	.project__photo { order: -1; }

	.header-nav ul,
	.ani-header-nav ul,
	.ani-nav-list { gap: 20px; }

	.ani-footer-columns {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 32px 20px;
		padding-block: 36px 28px;
	}
	.ani-footer-col--brand { grid-column: 1 / -1; }
	.ani-footer-blurb { max-width: 42ch; }
	.ani-footer-bottom__inner { align-items: flex-start; }

	.footer-inner,
	.ani-footer-inner { flex-direction: column; text-align: center; }

	.ind-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 700px) {
	.trusted__row { gap: 14px 26px; }
	.trusted__name { font-size: .9rem; }
	.trusted__logo { height: 26px; }
	.mat-cards--legacy { flex-direction: column; align-items: stretch; }
	.mat-grid { grid-template-columns: 1fr; }
	.industries__row { gap: 16px 24px; }
	.ind-grid { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
	body { font-size: 16px; }
	.ani-container, .container { padding-inline: 18px; }
	.pills { gap: 12px; }
	.pill { padding: 10px 16px; }
}

/* prefers-reduced-motion: stop marquee animation, show static row */
@media (prefers-reduced-motion: reduce) {
	.trusted__track {
		animation: none !important;
	}
	/* Show only the first set when motion is disabled */
	.trusted__set:last-child {
		display: none;
	}
	* { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ============================================================ ELEVATION 2026 */

/* ---------------------------------------------------------------- trusted STATIC (replaces marquee) */
.trusted--static {
	background: var(--ani-white);
	border-block-end: 1px solid var(--ani-border);
	padding-block: 24px 32px;
}

.trusted--static .trusted__eyebrow {
	text-align: center;
	color: var(--ani-muted);
	font-size: .82rem;
	font-weight: 500;
	margin: 0 0 18px;
}

/* Single static line of all logos (client request). nowrap on desktop; the
   logos shrink to fit so all 8 sit on one row. Wraps only on small screens. */
.trusted--static .trusted__row {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	gap: clamp(12px, 2.2vw, 32px);
	list-style: none;
	padding: 0;
	margin: 0;
}
.trusted--static .trusted__row .trusted__logo {
	height: 26px !important;
	max-width: 100px !important;
	flex: 0 1 auto !important;
	min-width: 0 !important;
}
.trusted--static .trusted__row .trusted__name {
	flex: 0 1 auto;
	white-space: nowrap;
	font-size: 1rem;
}
@media (max-width: 700px) {
	/* one line is unreadable on phones → allow wrap there */
	.trusted--static .trusted__row { flex-wrap: wrap; justify-content: center; gap: 14px 28px; }
}

/* ---------------------------------------------------------------- editorial rows (replaces 3-card grid) */
.editorial-rows {
	padding-block: 112px;
	background: var(--ani-white);
}

.editorial-rows + .editorial-rows { padding-block-start: 0; }

.editorial-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 64px;
	align-items: center;
	max-width: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
	padding-block: 72px 0;
}

.editorial-row:first-child { padding-block-start: 0; }

/* Hairline divider between rows */
.editorial-row + .editorial-row {
	border-block-start: 1px solid var(--ani-border);
	padding-block-start: 72px;
}

/* RTL: odd rows → text right (natural), image left. Even rows → image right, text left. */
.editorial-row--flip .editorial-row__copy { order: 2; }
.editorial-row--flip .editorial-row__media { order: 1; }

.editorial-row__copy {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.editorial-row__eyebrow {
	font-size: .82rem;
	font-weight: 600;
	color: var(--ani-blue);
	font-family: var(--ani-mono);
	direction: ltr;
	unicode-bidi: isolate;
}

.editorial-row__heading {
	font-size: clamp(1.5rem, 1rem + 2vw, 2rem);
	font-weight: 800;
	color: var(--ani-ink);
	line-height: 1.12;
	margin: 0;
}

.editorial-row__blurb {
	font-size: 1rem;
	color: var(--ani-body);
	line-height: 1.72;
	max-width: 42ch;
}

.editorial-row__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--ani-blue);
	font-weight: 600;
	font-size: .95rem;
	transition: color .15s ease;
}

.editorial-row__link:hover { color: var(--ani-blue-deep); }

.editorial-row__media {
	border-radius: 14px;
	overflow: hidden;
	aspect-ratio: 4 / 3;
}

.editorial-row__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 14px;
}

@media (max-width: 860px) {
	.editorial-row {
		grid-template-columns: 1fr;
		gap: 36px;
	}
	.editorial-row--flip .editorial-row__copy { order: 0; }
	.editorial-row--flip .editorial-row__media { order: 0; }
	.editorial-row__blurb { max-width: none; }
}

/* ---------------------------------------------------------------- showcase band (dark, full-bleed) */
.showcase-band {
	background: #0D141B;
	padding-block: 80px;
}

.showcase-band__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 64px;
	align-items: center;
	max-width: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
}

/* Image side: right in RTL */
.showcase-band__image {
	order: 2;
	border-radius: 12px;
	overflow: hidden;
	aspect-ratio: 4 / 3;
}

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

/* Copy side: left in RTL (natural) */
.showcase-band__copy {
	order: 1;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.showcase-band__heading {
	font-size: clamp(1.7rem, 1rem + 2.6vw, 2.6rem);
	font-weight: 800;
	color: #fff;
	line-height: 1.1;
	margin: 0;
}

.showcase-band__sub {
	font-size: 1rem;
	color: rgba(255,255,255,.65);
	line-height: 1.65;
}

.showcase-band__chain {
	font-family: var(--ani-mono);
	font-size: .85rem;
	color: rgba(255,255,255,.45);
	direction: rtl;
	unicode-bidi: isolate;
	line-height: 1.8;
}

/* LTR-isolate the latin labels inside the chain */
.showcase-band__chain span[dir="ltr"] {
	direction: ltr;
	unicode-bidi: isolate;
}

@media (max-width: 860px) {
	.showcase-band__inner {
		grid-template-columns: 1fr;
		gap: 36px;
	}
	.showcase-band__image { order: 0; }
	.showcase-band__copy { order: 0; }
}

/* ---------------------------------------------------------------- project gallery (captioned 3-up) */
.proj-gallery {
	padding-block: 112px;
	background: var(--ani-surface);
}

.proj-gallery__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	max-width: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
}

.proj-card {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.proj-card__img {
	aspect-ratio: 4 / 3;
	border-radius: 10px 10px 0 0;
	overflow: hidden;
}

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

.proj-card__caption {
	background: var(--ani-ink);
	border-radius: 0 0 10px 10px;
	padding: 12px 16px;
}

.proj-card__meta {
	font-family: var(--ani-mono);
	font-size: .75rem;
	color: rgba(255,255,255,.55);
	direction: rtl;
	unicode-bidi: isolate;
	line-height: 1.6;
}

/* LTR isolation for latin specs within caption */
.proj-card__meta [dir="ltr"] {
	direction: ltr;
	unicode-bidi: isolate;
}

.proj-card__name {
	font-size: .9rem;
	font-weight: 700;
	color: rgba(255,255,255,.9);
	margin-block-end: 2px;
}

@media (max-width: 860px) {
	.proj-gallery__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
	.proj-gallery__grid { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------- CTA band: dark, facility-image-backed */
.cta-band--dark {
	position: relative;
	overflow: hidden;
	background-color: #0D141B;
	background-image: url("../sections/facility.webp");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	padding-block: 96px;
}

/* Solid dark overlay (not a gradient) */
.cta-band--dark::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(13, 20, 27, 0.72);
	z-index: 0;
}

.cta-band--dark .cta-band__inner {
	position: relative;
	z-index: 1;
	border: none;
}

.cta-band--dark .cta-band__title {
	color: #fff;
}

.cta-band--dark .cta-band__sub {
	color: rgba(255,255,255,.72);
}

/* ---------------------------------------------------------------- reveal motion */
.reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity .55s ease-out, transform .55s ease-out;
}

.reveal--visible {
	opacity: 1;
	transform: translateY(0);
}

/* Staggered delay for multi-child reveals */
.reveal:nth-child(2) { transition-delay: .10s; }
.reveal:nth-child(3) { transition-delay: .20s; }

@media (prefers-reduced-motion: reduce) {
	.reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ---------------------------------------------------------------- industries section: tighten rhythm */
.industries--tight { padding-block: 72px; }

/* ---------------------------------------------------------------- mono font enforcement (within showcase chain, proj caption) */
.showcase-band__chain,
.proj-card__meta {
	font-family: var(--ani-mono) !important;
}

/* ================================================================ NEW HOMEPAGE SECTIONS 2026-06-22 */

/* ---------------------------------------------------------------- cap-tile bullets (s3 capability grid) */
.cap-tile__bullets {
	list-style: disc;
	padding-inline-start: 1.2em;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 5px;
	color: var(--ani-muted);
	font-size: 0.9rem;
	line-height: 1.5;
	flex: 1 1 auto;
}

/* ---------------------------------------------------------------- sector icons row (s4b) */
.ind-sectors {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px 32px;
	margin-block-end: 32px;
}

.ind-sector {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	min-width: 80px;
}

.ind-sector__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 14px;
	background: rgba(31, 109, 255, .08);
	color: var(--ani-blue);
}

.ind-sector__icon svg { width: 26px; height: 26px; }

.ind-sector__label {
	font-size: 0.94rem;
	font-weight: 600;
	color: var(--ani-body);
	text-align: center;
}

.ind-actions {
	text-align: center;
}

/* ---------------------------------------------------------------- client logos row (s4b) */
.ind-clients__eyebrow {
	text-align: center;
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--ani-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin: 0 0 20px;
}

.ind-clients-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 16px 40px;
}


/* ================================================================ POLISH 2026-06-22 */

/* ---------------------------------------------------------------- hero mosaic v2: asymmetric editorial grid
   4-tile layout in CSS grid-areas:
     | cnc (large, 2 rows)  | carbon (portrait, top-right) |
     | cnc (large, 2 rows)  | scan (sq) | print (landscape) |
   RTL: grid renders naturally (starts from inline-start = right side in RTL).
*/
.hero__mosaic--v2 {
	display: grid;
	/* 2 columns in the mosaic: left-col is wide (feature CNC), right-col is narrower */
	grid-template-columns: 1.45fr 1fr;
	grid-template-rows: 1.3fr 1fr;
	grid-template-areas:
		"cnc carbon"
		"cnc bottom";
	gap: 4px;
	block-size: 100%;
	overflow: hidden;
}

/* Override flex from hero__tile for the v2 grid */
.hero__mosaic--v2 .hero__tile {
	flex: none; /* grid handles sizing */
	overflow: hidden;
	position: relative;
}

.hero__tile--feature   { grid-area: cnc; }
.hero__tile--portrait  { grid-area: carbon; }

/* Bottom-right: scan (square, ~half-width) + print (landscape, ~half-width) side-by-side */
.hero__tile--square,
.hero__tile--wide      { grid-area: none; }

/* The "bottom" area is itself a sub-flex row containing scan + print */
.hero__mosaic--v2 .hero__tile--square {
	grid-area: bottom;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-column: 2;
	grid-row: 2;
	gap: 4px;
	overflow: hidden;
}
/* scan is the first child of the bottom cell trick:
   We use a different approach: the bottom-right uses a wrapper */

/* Reset: simplify using the wrapper approach in the HTML we already wrote.
   The 4 tiles map directly to grid-areas via :nth-child. */
.hero__mosaic--v2 .hero__tile:nth-child(1) { grid-area: cnc; }
.hero__mosaic--v2 .hero__tile:nth-child(2) { grid-area: carbon; }
/* tiles 3 and 4 go into the implicit bottom-right slot using the sub-grid trick */
.hero__mosaic--v2 {
	grid-template-areas:
		"cnc carbon"
		"cnc scan-print";
	grid-template-rows: 1.25fr 1fr;
}
.hero__mosaic--v2 .hero__tile:nth-child(3),
.hero__mosaic--v2 .hero__tile:nth-child(4) {
	grid-area: scan-print;
}

/* For tiles 3+4 in the same cell, use CSS subgrid via nested flex */
.hero__mosaic--v2 .hero__tile:nth-child(3) {
	grid-area: auto;
	grid-column: 2;
	grid-row: 2;
	z-index: 1;
}
.hero__mosaic--v2 .hero__tile:nth-child(4) {
	grid-column: 2;
	grid-row: 2;
	z-index: 2;
}

/* Cleaner approach: use a single scan-print container via the grid re-spec below.
   tiles 3+4 share the bottom-right cell via display:flex inside. */
.hero__mosaic--v2 {
	grid-template-columns: 1.45fr 1fr;
	grid-template-rows: 1.25fr 1fr;
	grid-template-areas:
		"cnc carbon"
		"cnc small";
}
.hero__mosaic--v2 .hero__tile:nth-child(1) { grid-area: cnc; }
.hero__mosaic--v2 .hero__tile:nth-child(2) { grid-area: carbon; }
.hero__mosaic--v2 .hero__tile:nth-child(3) {
	grid-area: small;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4px;
	overflow: hidden;
	/* this tile becomes a container for both scan & print */
}

/* scan img fills left half; print img fills right half: handled via wrapper in HTML.
   Since the HTML has separate tile divs, use absolute+relative positioning as fallback. */
.hero__mosaic--v2 .hero__tile:nth-child(3),
.hero__mosaic--v2 .hero__tile:nth-child(4) {
	display: flex;
}

/* Final clean approach: use explicit grid placement */
.hero__mosaic--v2 {
	display: grid;
	grid-template-columns: 1.4fr 0.6fr 0.6fr;
	grid-template-rows: 1.25fr 1fr;
	gap: 4px;
	block-size: 100%;
	overflow: hidden;
}

/* cnc: col 1, spans both rows */
.hero__mosaic--v2 .hero__tile:nth-child(1) {
	grid-column: 1;
	grid-row: 1 / 3;
}

/* carbon: col 2-3, row 1 (portrait: tall) */
.hero__mosaic--v2 .hero__tile:nth-child(2) {
	grid-column: 2 / 4;
	grid-row: 1;
}

/* scan: col 2, row 2 */
.hero__mosaic--v2 .hero__tile:nth-child(3) {
	grid-column: 2;
	grid-row: 2;
}

/* print: col 3, row 2 */
.hero__mosaic--v2 .hero__tile:nth-child(4) {
	grid-column: 3;
	grid-row: 2;
}

/* All tiles: img fills the cell */
.hero__mosaic--v2 .hero__tile img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.55s ease-out;
}
.hero__mosaic--v2 .hero__tile:hover img {
	transform: scale(1.04);
}
@media (prefers-reduced-motion: reduce) {
	.hero__mosaic--v2 .hero__tile img { transition: none; }
	.hero__mosaic--v2 .hero__tile:hover img { transform: none; }
}

/* Mobile: stack mosaic as 2x2 grid */
@media (max-width: 760px) {
	.hero__mosaic--v2 {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: repeat(2, 140px);
		block-size: 300px;
	}
	.hero__mosaic--v2 .hero__tile:nth-child(1) { grid-column: 1; grid-row: 1; }
	.hero__mosaic--v2 .hero__tile:nth-child(2) { grid-column: 2; grid-row: 1; }
	.hero__mosaic--v2 .hero__tile:nth-child(3) { grid-column: 1; grid-row: 2; }
	.hero__mosaic--v2 .hero__tile:nth-child(4) { grid-column: 2; grid-row: 2; }
}

/* ---------------------------------------------------------------- hero copy zone: upgraded elements */
.hero__para {
	margin-block-start: 10px;
	font-size: clamp(.84rem, .78rem + .22vw, .96rem);
	line-height: 1.6;
	color: var(--ani-body);
	max-width: 38ch;
	text-align: end;
}

/* Hero spec table: inline engineering credential */
.hero__spec-table {
	margin-block-start: 18px;
	border-collapse: collapse;
	width: 100%;
	font-size: 0.82rem;
	direction: rtl;
}

.hero__spec-table th,
.hero__spec-table td {
	padding: 7px 0;
	vertical-align: top;
	text-align: start;
}

.hero__spec-table th {
	font-family: var(--ani-mono);
	font-weight: 600;
	color: var(--ani-muted);
	white-space: nowrap;
	padding-inline-end: 16px;
	font-size: 0.76rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	min-width: 72px;
}

.hero__spec-table td {
	color: var(--ani-ink);
	font-weight: 500;
	line-height: 1.5;
}

.hero__spec-table tr + tr th,
.hero__spec-table tr + tr td {
	border-block-start: 1px solid var(--ani-border);
}

/* Hide spec table on very small screens */
@media (max-width: 440px) {
	.hero__spec-table { display: none; }
}

/* ---------------------------------------------------------------- trusted-by strip: positioned under stats */
.trusted--static-section {
	background: var(--ani-white);
	border-block-end: 1px solid var(--ani-border);
}

.trusted--static-section .trusted--static {
	padding-block: 20px 28px;
}

/* ---------------------------------------------------------------- shared discrete carousels */
.cap-section {
	padding-block: 96px;
}

.cap-section__head {
	text-align: center;
}

.cap-intro {
	max-inline-size: 62ch;
	margin: 14px auto 42px;
	color: var(--ani-body);
	font-size: 1.02rem;
	line-height: 1.7;
	text-align: center;
}

.ani-carousel {
	max-inline-size: var(--ani-container);
	margin-inline: auto;
	padding-inline: 24px;
}

.ani-carousel__toolbar {
	display: none;
	align-items: center;
	gap: 18px;
	margin-block-end: 18px;
}

.ani-js .ani-carousel__toolbar {
	display: flex;
}

.ani-carousel__rule {
	flex: 1 1 auto;
	block-size: 1px;
	background: var(--ani-border);
}

.ani-carousel__nav {
	display: inline-grid;
	grid-template-columns: 48px minmax(78px, auto) 48px;
	align-items: stretch;
	overflow: hidden;
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-btn);
	background: var(--ani-white);
	box-shadow: 0 4px 16px rgba(13, 20, 27, .06);
}

.ani-carousel__button {
	box-sizing: border-box;
	inline-size: 48px;
	block-size: 46px;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--ani-ink);
	display: grid;
	place-items: center;
	cursor: pointer;
	transition: background .18s ease, color .18s ease, opacity .18s ease;
}

.ani-carousel__button:hover:not(:disabled) {
	background: var(--ani-blue);
	color: var(--ani-white);
}

.ani-carousel__button:focus-visible {
	position: relative;
	z-index: 1;
	outline: 3px solid var(--ani-blue);
	outline-offset: -3px;
}

.ani-carousel__button:disabled {
	cursor: default;
	opacity: .28;
}

.ani-carousel__status {
	box-sizing: border-box;
	min-inline-size: 78px;
	padding-inline: 12px;
	border-inline: 1px solid var(--ani-border);
	color: var(--ani-body);
	font-family: var(--ani-mono);
	font-size: .78rem;
	font-weight: 500;
	display: grid;
	place-items: center;
	white-space: nowrap;
}

[dir="rtl"] .ani-carousel__button svg {
	transform: scaleX(-1);
}

.ani-carousel.is-static .ani-carousel__toolbar {
	display: none;
}

.ani-carousel__track {
	display: flex;
	align-items: stretch;
	gap: 24px;
	inline-size: 100%;
	min-inline-size: 0;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	padding-block: 4px 18px;
}

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

.ani-carousel__track:focus-visible {
	outline: 3px solid var(--ani-blue);
	outline-offset: 4px;
}

.ani-carousel-card {
	box-sizing: border-box;
	flex: 0 0 calc((100% - 48px) / 3);
	min-inline-size: 0;
	overflow: hidden;
	scroll-snap-align: start;
	position: relative;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	background: var(--ani-white);
	box-shadow: var(--ani-shadow-card);
	transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.ani-carousel-card__link {
	block-size: 100%;
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	color: inherit;
	text-decoration: none;
}

.ani-carousel-card__link:focus-visible {
	outline: 3px solid var(--ani-blue);
	outline-offset: -4px;
}

.ani-carousel-card__media {
	aspect-ratio: 16 / 10;
	overflow: hidden;
	flex-shrink: 0;
	background: var(--ani-blueprint);
}

.ani-carousel-card__media img {
	inline-size: 100%;
	block-size: 100%;
	display: block;
	object-fit: cover;
	transition: transform .5s cubic-bezier(.22, 1, .36, 1);
}

.ani-carousel-card__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 10px;
	min-block-size: 188px;
	padding: 24px;
	text-align: start;
}

.ani-carousel-card__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.ani-carousel-card__index {
	color: var(--ani-blue);
	font-family: var(--ani-mono);
	font-size: .76rem;
	font-weight: 500;
	letter-spacing: .08em;
}

.ani-carousel-card__title {
	margin: 0;
	color: var(--ani-ink);
	font-size: clamp(1.16rem, 1.02rem + .3vw, 1.34rem);
	font-weight: 750;
	line-height: 1.3;
}

.ani-carousel-card__description {
	margin: 0;
	color: var(--ani-body);
	font-size: .96rem;
	line-height: 1.65;
}

.ani-carousel-card__more {
	margin-block-start: auto;
	padding-block-start: 12px;
	color: var(--ani-blue);
	font-size: 1rem;
	font-weight: 650;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

[dir="ltr"] .ani-carousel-card__more svg {
	transform: scaleX(-1);
}

.ani-carousel-card:hover,
.ani-carousel-card:focus-within {
	border-color: rgba(31, 109, 255, .38);
	box-shadow: 0 18px 42px rgba(13, 20, 27, .1);
	transform: translateY(-4px);
}

.ani-carousel-card:hover .ani-carousel-card__media img,
.ani-carousel-card:focus-within .ani-carousel-card__media img {
	transform: scale(1.035);
}

.equip-card__tag {
	margin-inline-start: auto;
	padding: 3px 9px;
	border: 1px solid rgba(31, 109, 255, .24);
	border-radius: 4px;
	background: rgba(31, 109, 255, .07);
	color: var(--ani-blue);
	font-family: var(--ani-mono);
	font-size: .72rem;
	font-weight: 500;
	white-space: nowrap;
}

@media (max-width: 980px) {
	.cap-section {
		padding-block: 76px;
	}

	.ani-carousel-card {
		flex-basis: calc((100% - 20px) / 2);
	}

	.ani-carousel__track {
		gap: 20px;
	}
}

@media (max-width: 640px) {
	.cap-section {
		padding-block: 62px;
	}

	.cap-intro {
		margin-block-end: 30px;
		padding-inline: 4px;
		font-size: .96rem;
	}

	.ani-carousel {
		padding-inline: 18px;
	}

	.ani-carousel__toolbar {
		gap: 12px;
		margin-block-end: 14px;
	}

	.ani-carousel__nav {
		grid-template-columns: 46px 70px 46px;
	}

	.ani-carousel__button {
		inline-size: 46px;
		block-size: 44px;
	}

	.ani-carousel__status {
		min-inline-size: 70px;
		padding-inline: 8px;
	}

	.ani-carousel__track {
		gap: 16px;
		padding-block-end: 12px;
	}

	.ani-carousel-card {
		flex-basis: 100%;
	}

	.ani-carousel-card__body {
		min-block-size: 176px;
		padding: 21px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ani-carousel__button,
	.ani-carousel-card,
	.ani-carousel-card__media img {
		transition: none;
	}

	.ani-carousel-card:hover,
	.ani-carousel-card:focus-within {
		transform: none;
	}
}

/* ---------------------------------------------------------------- industries section: intro text */
.ind-intro {
	text-align: center;
	color: var(--ani-body);
	font-size: 1rem;
	line-height: 1.7;
	max-width: 60ch;
	margin-inline: auto;
	margin-block: -8px 40px;
}

/* ---------------------------------------------------------------- equipment section: intro text */
.equip-intro {
	text-align: center;
	color: var(--ani-muted);
	font-size: 0.98rem;
	line-height: 1.65;
	max-width: 62ch;
	margin-inline: auto;
	margin-block: 0 32px;
}

/* ---------------------------------------------------------------- CTA band deep-blue blueprint variant (s6) */
.cta-band--blueprint {
	background-color: var(--ani-blue-deep);
	background-image:
		linear-gradient(rgba(27, 77, 203, 0.88), rgba(27, 77, 203, 0.88)),
		url("../blueprint.webp");
	background-size: cover, cover;
	background-position: center;
	background-repeat: no-repeat;
	border-block: none;
}

.cta-band--blueprint .cta-band__title { color: var(--ani-white); }
.cta-band--blueprint .cta-band__sub   { color: rgba(255, 255, 255, .78); }

.cta-band--blueprint .btn--primary,
.cta-band--blueprint a.btn--primary,
.cta-band--blueprint .btn.btn--primary {
	background: var(--ani-white) !important;
	color: var(--ani-blue-deep) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, .18);
}

.cta-band--blueprint .btn--primary:hover,
.cta-band--blueprint a.btn--primary:hover,
.cta-band--blueprint .btn.btn--primary:hover {
	background: var(--ani-blueprint) !important;
	color: var(--ani-blue-deep) !important;
	transform: translateY(-2px);
}

/* ================================================================ REBUILD 2026-06-22 */

/* ---------------------------------------------------------------- hero eyebrow / eyebrow-kicker */
.hero__eyebrow { margin-block-end: 12px; }
.eyebrow-kicker {
	font-family: var(--ani-mono);
	font-size: 0.76rem;
	font-weight: 500;
	color: var(--ani-muted);
	letter-spacing: 0.06em;
	direction: ltr;
	unicode-bidi: isolate;
	display: block;
}

/* ---------------------------------------------------------------- hero spec table th: mono uppercase labels */
.hero__spec-th {
	font-family: var(--ani-mono);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--ani-muted);
}

/* ---------------------------------------------------------------- hero trust sliver */
.hero__trust-sliver {
	margin-block-start: 14px;
	font-family: var(--ani-mono);
	font-size: 0.73rem;
	color: var(--ani-muted);
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	justify-content: flex-end;
}
.trust-certs { color: var(--ani-blue); }
.trust-sep { color: var(--ani-border); }
.trust-todo { font-style: normal; color: #92601A; font-size: 0.65rem; }

/* ---------------------------------------------------------------- trusted__tail */
.trusted__tail {
	text-align: center;
	color: var(--ani-body);
	font-size: 0.94rem;
	margin-block-start: 14px;
	font-style: italic;
}

/* ---------------------------------------------------------------- section-eyebrow (mono kicker above section titles) */
.section-eyebrow {
	font-family: var(--ani-mono);
	font-size: 0.72rem;
	font-weight: 600;
	color: var(--ani-blue);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	margin: 0 0 10px;
	direction: ltr;
	unicode-bidi: isolate;
}

/* ---------------------------------------------------------------- dimline: dimension-line caliper device
   Renders as: ├────────────────────────────────────────────────────┤
   with one blue tick as accent. Place before section headings. */
.dimline {
	display: flex;
	align-items: center;
	gap: 0;
	margin-block-end: 24px;
	inline-size: 100%;
	max-inline-size: 480px;
	margin-inline: auto;
}
.dimline--top { margin-block-end: 20px; }

.dimline__tick {
	display: block;
	inline-size: 1px;
	block-size: 12px;
	background: var(--ani-border);
	flex-shrink: 0;
}
.dimline__tick--blue { background: var(--ani-blue); }

.dimline__rule {
	display: block;
	flex: 1;
	block-size: 1px;
	background: var(--ani-border);
}

/* ---------------------------------------------------------------- onestop-section */
.onestop-section {
	background: var(--ani-blueprint);
	padding-block: 96px;
}
.onestop__intro {
	text-align: center;
	color: var(--ani-body);
	font-size: 1.05rem;
	line-height: 1.72;
	max-width: 54ch;
	margin-inline: auto;
	margin-block: 0 56px;
}

/* In-house chain visualization */
.onestop__chain {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0;
	overflow-x: auto;
	padding-block-end: 8px;
}
.onestop__step {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
	padding-inline: 20px;
	text-align: center;
}
.onestop__step-num {
	font-family: var(--ani-mono);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--ani-ink);
	line-height: 1;
	display: block;
	direction: ltr;
}
.onestop__step-label {
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--ani-muted);
	white-space: nowrap;
}

/* Connector line with tick ends between steps: dimension-line feel */
.onestop__connector {
	display: block;
	inline-size: 32px;
	block-size: 2px;
	background: var(--ani-blue);
	flex-shrink: 0;
	position: relative;
	align-self: center;
	margin-block-start: -20px; /* optical: centre between num and label */
}
.onestop__connector::before,
.onestop__connector::after {
	content: "";
	position: absolute;
	block-size: 8px;
	inline-size: 2px;
	background: var(--ani-blue);
	inset-block-start: 50%;
	transform: translateY(-50%);
}
.onestop__connector::before { inset-inline-start: 0; }
.onestop__connector::after  { inset-inline-end: 0; }

@media (max-width: 760px) {
	.onestop__chain { gap: 4px; }
	.onestop__step { padding-inline: 10px; }
	.onestop__connector { inline-size: 16px; }
	.onestop__step-num { font-size: 1.1rem; }
	.onestop__step-label { font-size: 0.75rem; }
}

/* ---------------------------------------------------------------- cap-card spec row */
.cap-card__spec-row {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.cap-card__spec {
	font-family: var(--ani-mono);
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--ani-blue);
	background: rgba(31, 109, 255, .07);
	border: 1px solid rgba(31, 109, 255, .2);
	border-radius: 4px;
	padding: 3px 8px;
	direction: ltr;
	unicode-bidi: isolate;
	white-space: nowrap;
}
.cap-card__lead {
	font-family: var(--ani-mono);
	font-size: 0.7rem;
	color: var(--ani-muted);
	background: var(--ani-surface);
	border: 1px solid var(--ani-border);
	border-radius: 4px;
	padding: 2px 7px;
	white-space: nowrap;
}

/* ---------------------------------------------------------------- process blueprint rail */
.process-chain-section {
	padding-block: clamp(72px, 8vw, 108px);
	overflow: hidden;
}

.process-chain__head {
	text-align: center;
}

.process-chain__intro {
	max-inline-size: 620px;
	margin: 16px auto 0;
	color: var(--ani-body);
	font-size: 1.02rem;
	line-height: 1.7;
	text-align: center;
}

.process-chain {
	position: relative;
	isolation: isolate;
	inline-size: min(1240px, calc(100% - 48px));
	margin: 34px auto 0;
}

.process-chain__lead {
	inline-size: min(780px, 100%);
	margin-inline: auto;
	padding: 16px 20px;
	border: 1px solid rgba(31, 109, 255, .18);
	border-inline-start: 3px solid var(--ani-blue);
	border-radius: 10px;
	background: rgba(255, 255, 255, .72);
	box-shadow: 0 10px 28px rgba(13, 20, 27, .045);
	display: grid;
	grid-template-columns: 42px minmax(180px, .8fr) minmax(280px, 1.2fr);
	grid-template-rows: auto auto;
	column-gap: 16px;
	row-gap: 2px;
	align-items: center;
	text-align: start;
}

.process-chain__lead-icon {
	grid-column: 1;
	grid-row: 1 / 3;
	inline-size: 42px;
	block-size: 42px;
	border: 1px solid rgba(31, 109, 255, .2);
	border-radius: 50%;
	background: rgba(31, 109, 255, .07);
	color: var(--ani-blue);
	display: grid;
	place-items: center;
}

.process-chain__lead-icon svg {
	inline-size: 24px;
	block-size: 24px;
}

.process-chain__kicker {
	grid-column: 2;
	grid-row: 1;
	color: var(--ani-blue);
	font-size: .78rem;
	font-weight: 700;
	line-height: 1.3;
}

.process-chain__lead strong {
	grid-column: 2;
	grid-row: 2;
	color: var(--ani-ink);
	font-size: clamp(1.02rem, .96rem + .18vw, 1.16rem);
	line-height: 1.35;
}

.process-chain__lead p {
	grid-column: 3;
	grid-row: 1 / 3;
	margin: 0;
	color: var(--ani-muted);
	font-size: .92rem;
	line-height: 1.6;
}

.process-chain__steps {
	position: relative;
	margin: clamp(44px, 5vw, 64px) 0 0;
	padding: 0;
	min-block-size: 252px;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	isolation: isolate;
}

.process-chain__steps::before {
	content: "";
	position: absolute;
	z-index: 0;
	inset-block-start: calc(50% - 1px);
	inset-inline: 7.142857%;
	block-size: 2px;
	background: rgba(31, 109, 255, .38);
}

.process-chain__step {
	position: relative;
	z-index: 1;
	min-inline-size: 0;
	display: grid;
	grid-template-rows: minmax(0, 1fr) 46px minmax(0, 1fr);
	justify-items: center;
	align-items: center;
}

.process-chain__num {
	grid-column: 1;
	grid-row: 2;
	inline-size: 46px;
	aspect-ratio: 1;
	border: 2px solid var(--ani-blue);
	border-radius: 50%;
	background: var(--ani-white);
	box-shadow:
		0 0 0 8px var(--ani-surface),
		0 8px 20px rgba(13, 20, 27, .08);
	color: var(--ani-blue);
	font-family: var(--ani-mono);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .04em;
	display: grid;
	place-items: center;
}

.process-chain__step:first-child .process-chain__num,
.process-chain__step:last-child .process-chain__num {
	background: var(--ani-blue);
	color: var(--ani-white);
}

.process-chain__step:last-child .process-chain__num {
	border-color: var(--ani-ink);
	background: var(--ani-ink);
}

.process-chain__label {
	grid-column: 1;
	max-inline-size: 142px;
	color: var(--ani-ink);
	font-size: clamp(.84rem, .79rem + .12vw, .96rem);
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
	text-wrap: balance;
}

.process-chain__step:nth-child(odd) .process-chain__label {
	grid-row: 1;
	align-self: end;
	margin-block-end: 20px;
}

.process-chain__step:nth-child(even) .process-chain__label {
	grid-row: 3;
	align-self: start;
	margin-block-start: 20px;
}

.process-chain__steps:focus-visible {
	outline: 3px solid var(--ani-blue);
	outline-offset: 6px;
	border-radius: 4px;
}

@media (max-width: 980px) {
	.process-chain__head {
		padding-inline: 24px;
	}

	.process-chain {
		inline-size: min(100%, 760px);
		margin-block-start: 30px;
	}

	.process-chain__lead {
		inline-size: auto;
		margin-inline: 24px;
		padding: 18px 20px;
		grid-template-columns: 42px minmax(0, 1fr);
		grid-template-rows: auto auto auto;
		column-gap: 15px;
	}

	.process-chain__lead-icon {
		grid-column: 1;
		grid-row: 1 / 3;
	}

	.process-chain__kicker,
	.process-chain__lead strong {
		grid-column: 2;
	}

	.process-chain__lead p {
		grid-column: 1 / -1;
		grid-row: 3;
		margin-block-start: 9px;
		padding-block-start: 9px;
		border-block-start: 1px solid rgba(31, 109, 255, .12);
		font-size: .94rem;
	}

	.process-chain__steps {
		inline-size: 100vw;
		min-block-size: 0;
		margin-block-start: 26px;
		margin-inline: calc(50% - 50vw);
		padding: 6px 24px 20px;
		display: flex;
		gap: 14px;
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		scroll-padding-inline: 24px;
		scroll-snap-type: inline mandatory;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	.process-chain__steps::before {
		display: none;
	}

	.process-chain__steps::-webkit-scrollbar {
		display: none;
	}

	.process-chain__steps:focus-visible {
		outline-width: 2px;
		outline-offset: -2px;
		border-radius: 0;
	}

	.process-chain__step {
		flex: 0 0 min(78vw, 310px);
		min-block-size: 136px;
		padding: 22px;
		border: 1px solid rgba(31, 109, 255, .2);
		border-radius: 12px;
		background: var(--ani-white);
		box-shadow: 0 10px 24px rgba(13, 20, 27, .07);
		display: grid;
		grid-template-columns: 48px minmax(0, 1fr);
		grid-template-rows: 1fr;
		justify-items: stretch;
		align-items: center;
		gap: 16px;
		text-align: start;
		scroll-snap-align: start;
	}

	.process-chain__step:first-child {
		border-color: rgba(31, 109, 255, .42);
		background: var(--ani-blueprint);
	}

	.process-chain__step:not(:last-child)::after {
		content: "";
		position: absolute;
		inset-block-start: calc(50% - 1px);
		inset-inline-end: -15px;
		inline-size: 15px;
		block-size: 2px;
		background: rgba(31, 109, 255, .32);
	}

	.process-chain__num {
		grid-column: 1;
		grid-row: 1;
		inline-size: 46px;
		box-shadow: 0 6px 16px rgba(13, 20, 27, .08);
	}

	.process-chain__step:nth-child(odd) .process-chain__label,
	.process-chain__step:nth-child(even) .process-chain__label {
		grid-column: 2;
		grid-row: 1;
		align-self: center;
		max-inline-size: none;
		margin: 0;
		font-size: 1.04rem;
		line-height: 1.45;
		text-align: start;
	}
}

@media (max-width: 520px) {
	.process-chain-section {
		padding-block: 62px;
	}

	.process-chain__intro {
		margin-block-start: 12px;
		font-size: .96rem;
	}

	.process-chain {
		margin-block-start: 24px;
	}

	.process-chain__lead {
		margin-inline: 18px;
		padding: 17px;
		grid-template-columns: 40px minmax(0, 1fr);
		column-gap: 13px;
	}

	.process-chain__lead-icon {
		inline-size: 40px;
		block-size: 40px;
	}

	.process-chain__lead strong {
		font-size: 1.08rem;
	}

	.process-chain__steps {
		padding-inline: 18px;
		scroll-padding-inline: 18px;
	}

	.process-chain__step {
		flex-basis: min(80vw, 300px);
		min-block-size: 132px;
		padding: 20px;
	}
}

/* ---------------------------------------------------------------- equip spec table */
.equip-spec-table {
	border-collapse: collapse;
	inline-size: 100%;
	font-size: 0.76rem;
}
.equip-spec-table th,
.equip-spec-table td {
	padding: 4px 0;
	vertical-align: top;
	text-align: start;
}
.equip-spec-table th {
	font-family: var(--ani-mono);
	font-weight: 600;
	color: var(--ani-muted);
	padding-inline-end: 12px;
	white-space: nowrap;
	font-size: 0.7rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	min-inline-size: 52px;
}
.equip-spec-table td {
	font-family: var(--ani-mono);
	color: var(--ani-ink);
	font-weight: 500;
}
.equip-spec-table tr + tr th,
.equip-spec-table tr + tr td {
	border-block-start: 1px solid var(--ani-border);
}

/* ---------------------------------------------------------------- certs-section */
.certs-section { padding-block: 96px; background: var(--ani-blueprint); }

.certs__inner { text-align: center; }

.certs__badges {
	display: flex;
	align-items: stretch;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
	margin-block: 48px;
}

.cert-badge {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	padding: 28px 36px;
	min-inline-size: 160px;
	box-shadow: var(--ani-shadow-card);
	transition: box-shadow .18s ease, border-color .18s ease;
}
.cert-badge:hover {
	box-shadow: 0 6px 20px rgba(31, 109, 255, .12);
	border-color: rgba(31, 109, 255, .3);
}
.cert-badge--accent { border-color: var(--ani-blue); }

.cert-badge__code {
	font-family: var(--ani-mono);
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--ani-ink);
	direction: ltr;
	unicode-bidi: isolate;
}
.cert-badge--accent .cert-badge__code { color: var(--ani-blue); }

.cert-badge__label {
	font-size: 0.82rem;
	color: var(--ani-muted);
	font-weight: 500;
}

.certs__features {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px 28px;
	flex-wrap: wrap;
	list-style: none;
	margin: 0;
	padding: 0;
}

.certs__feature {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.92rem;
	color: var(--ani-body);
}

.certs__feature-dot {
	display: inline-block;
	inline-size: 6px;
	block-size: 6px;
	border-radius: 50%;
	background: var(--ani-blue);
	flex-shrink: 0;
}

@media (max-width: 760px) {
	.certs__badges { gap: 14px; }
	.cert-badge { padding: 20px 24px; min-inline-size: 130px; }
}

/* ---------------------------------------------------------------- CTA band additions */
.cta-band__eyebrow {
	font-family: var(--ani-mono);
	font-size: 0.72rem;
	font-weight: 600;
	color: rgba(255, 255, 255, .55);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 12px;
	direction: ltr;
	unicode-bidi: isolate;
}
.cta-band__actions {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	justify-content: center;
	margin-block-end: 28px;
}

/* Ghost outline button on dark band */
.btn--outline-band {
	background: transparent;
	color: var(--ani-white) !important;
	border: 1.5px solid rgba(255, 255, 255, .38);
}
.btn--outline-band:hover {
	border-color: var(--ani-white);
	background: rgba(255, 255, 255, .08);
}

.cta-band__formats {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	flex-wrap: wrap;
	margin-block-end: 12px;
}
.cta-fmt {
	font-family: var(--ani-mono);
	font-size: 0.75rem;
	font-weight: 600;
	color: rgba(255, 255, 255, .7);
	background: rgba(255, 255, 255, .1);
	border: 1px solid rgba(255, 255, 255, .2);
	border-radius: 4px;
	padding: 3px 10px;
	direction: ltr;
	unicode-bidi: isolate;
	letter-spacing: 0.03em;
}
.cta-band__nda {
	font-size: 0.8rem;
	color: rgba(255, 255, 255, .5);
	margin: 0;
}

/* ---------------------------------------------------------------- floating contact cluster */
.ani-float-cluster {
	position: fixed;
	inset-block-end: 28px;
	inset-inline-end: 24px;
	z-index: 9000;
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: center;
}

.ani-float-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 52px;
	block-size: 52px;
	border-radius: 50%;
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease;
	flex-shrink: 0;
}
.ani-float-btn:hover { transform: scale(1.08); }

.ani-float-btn--call {
	background: var(--ani-blue);
	color: var(--ani-white);
	box-shadow: 0 4px 16px rgba(31, 109, 255, .35);
}
.ani-float-btn--call:hover {
	background: var(--ani-blue-deep);
	box-shadow: 0 6px 20px rgba(31, 109, 255, .45);
}

.ani-float-btn--whatsapp {
	background: #128C4B;
	color: var(--ani-white);
	box-shadow: 0 4px 16px rgba(18, 140, 75, .35);
}
.ani-float-btn--whatsapp:hover {
	background: #0E7A40;
	box-shadow: 0 6px 20px rgba(18, 140, 75, .45);
}

/* Elementor's link colour overrides anchors, so paint contact icons directly. */
.ani-float-btn--call svg { stroke: var(--ani-white); color: var(--ani-white); }
.ani-float-btn--whatsapp svg { fill: var(--ani-white); color: var(--ani-white); }

@media (max-width: 760px) {
	.ani-float-cluster {
		inset-block-end: 16px;
		inset-inline-end: 16px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.ani-float-btn { transition: none; }
}

/* =========================================================================
   HERO v3: single full-bleed shot (hardware-as-hero, overlaid copy).
   Replaces the .hero__inner mosaic. .hero section class is retained for the
   padding reset (.hero .elementor-* { padding:0 }) + the seamless stats seam.
   Flat scrim only: NO gradients (house rule). One blue accent.
   ========================================================================= */
.hero-shot {
	position: relative;
	display: flex;
	align-items: center;
	min-block-size: clamp(560px, 74vh, 780px);
	overflow: hidden;
	background: var(--ani-ink);
	isolation: isolate;
}
.hero-shot__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.hero-shot__media img {
	/* Absolute fill: Elementor forces `img{height:auto}`, which made block-size:100%
	   collapse to the image's intrinsic height, leaving the hero half-photo/half-black.
	   Absolute inset:0 guarantees the photo covers the whole hero. */
	position: absolute;
	inset: 0;
	inline-size: 100%;
	width: 100% !important;   /* beat Elementor's `.elementor img{width/height:auto}` */
	block-size: 100%;
	height: 100% !important;
	object-fit: cover;
	object-position: 32% center; /* push the milling subject left → calmer area under the copy (RTL right) */
	display: block;
}
/* flat legibility scrim (no gradient) */
.hero-shot__scrim {
	position: absolute;
	inset: 0;
	background: rgba(9, 15, 23, 0.56);
	pointer-events: none;
}
.hero-shot__inner {
	position: relative;
	z-index: 2;
	inline-size: min(1180px, 100%);
	margin-inline: auto;
	padding-inline: clamp(24px, 5vw, 72px);
	padding-block: clamp(48px, 7vh, 96px); /* spec-bar removed: symmetric padding */
}
.hero-shot__copy {
	max-inline-size: 600px;
	text-align: start; /* RTL start = right */
	color: var(--ani-white);
}
@media (prefers-reduced-motion: no-preference) {
	.hero-shot__copy { animation: hero-rise .6s cubic-bezier(.19,1,.22,1) both; }
}
.hero-shot__eyebrow {
	font-family: var(--ani-mono);
	font-size: clamp(.66rem, .6rem + .2vw, .76rem);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #7FB0FF; /* light blue: AA on the scrim */
	margin: 0 0 14px;
}
.hero-shot h1 {
	font-size: clamp(2.1rem, 1.15rem + 3.4vw, 3.5rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: var(--ani-white);
	margin: 0;
}
.hero-shot__sub {
	margin-block-start: 16px;
	font-size: clamp(.95rem, .86rem + .3vw, 1.1rem);
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.82);
	max-inline-size: 56ch;
}
.hero-shot__tagline {
	margin-block-start: 18px;
	font-size: clamp(.92rem, .82rem + .3vw, 1.06rem);
	font-weight: 700;
	color: var(--ani-white);
	line-height: 1.5;
}
.hero-shot__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-block-start: 26px;
	align-items: center;
}
/* secondary button on a dark hero */
.btn--on-dark {
	color: var(--ani-white) !important;
	border-color: rgba(255, 255, 255, 0.45);
	background: rgba(255, 255, 255, 0.04);
}
.btn--on-dark:hover {
	border-color: var(--ani-white);
	color: var(--ani-white) !important;
	background: rgba(255, 255, 255, 0.12);
}
/* mono spec data-bar pinned to the hero base */
.hero-shot__specbar {
	position: absolute;
	inset-inline: 0;
	inset-block-end: 0;
	z-index: 2;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	margin: 0;
	/* Lighter, integrated: a frosted glass strip over the hero rather than a heavy opaque slab */
	background: rgba(10, 16, 24, 0.30);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-block-start: 1px solid rgba(127, 176, 255, 0.22);
}
.hero-shot__specbar .specbar__cell {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 10px clamp(16px, 2.4vw, 32px);
	border-inline-start: 1px solid rgba(255, 255, 255, 0.08);
}
.hero-shot__specbar .specbar__cell:first-child { border-inline-start: 0; }
.hero-shot__specbar dt {
	font-family: var(--ani-mono);
	font-size: .6rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #7FB0FF;
}
.hero-shot__specbar dd {
	margin: 0;
	font-family: var(--ani-mono);
	font-size: clamp(.72rem, .66rem + .2vw, .82rem);
	color: var(--ani-white);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

@media (max-width: 760px) {
	/* Keep a sensible hero height + a slightly stronger scrim so the (now
	   full-bleed) photo stays legible behind the copy. */
	.hero-shot { min-block-size: 86vh; }
	.hero-shot__media img { object-position: center; }
	.hero-shot__scrim { background: rgba(9, 15, 23, 0.62); }
	.hero-shot__inner { padding-block: clamp(40px, 9vh, 72px); display: flex; align-items: center; }
	.hero-shot__copy { max-inline-size: 100%; }
	/* Trim the long description on phones (full text stays for SEO). */
	.hero-shot__sub {
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
		margin-block-start: 14px;
	}
	.hero-shot h1 { font-size: clamp(1.9rem, 1.2rem + 4vw, 2.6rem); }
	.hero-shot__actions { margin-block-start: 22px; }
	.hero-shot__actions .btn { flex: 1 1 100%; justify-content: center; }
	.hero-shot__specbar { grid-template-columns: repeat(2, 1fr); }
	.hero-shot__specbar .specbar__cell:nth-child(3) { border-inline-start: 0; }
	.hero-shot__specbar .specbar__cell:nth-child(n+3) { border-block-start: 1px solid rgba(255, 255, 255, 0.10); }
	.hero-shot__specbar dd { white-space: normal; }
}

/* ============================================================================
   HOMEPAGE FLOW: calm, intentional section rhythm.
   The page mixed two near-identical tints (#F3F6FB + #F7F9FD) against white in an
   inconsistent order, which read as random "weird background changes". This
   replaces it with ONE tint in a deliberate white→tint→white alternation, and
   removes the floating blueprint "dimension-line" graphics + the stray hairline.
   ========================================================================= */
.elementor .hero-stats-section,
.elementor .trusted--static-section,
.elementor .cap-section,
.elementor .section.section--surface,                /* equipment */
.elementor .industries.section--surface {
	background: var(--ani-white) !important;
}
.elementor .onestop-section,
.elementor .process-chain-section.section--surface {  /* circles */
	background: var(--ani-surface) !important;
}

/* The quality band is deliberately dark (approved direction, 2026-09-20). */
.elementor .certs-section { background: var(--ani-ink) !important; }

/* Remove ALL the thin grey divider lines so the page reads as one continuous flow,
   not a stack of bordered bands. The sticky header gains a shadow on scroll
   (.ani-header--scrolled), so it needs no static border line at the top. */
.dimline { display: none !important; }
.ani-site-header { border-block-end: 0 !important; }
.hero-stats { border-block-start: 0 !important; }
.trusted--static-section,
.trusted--static-section .trusted--static,
.trusted--static {
	border-block-start: 0 !important;
	border-block-end: 0 !important;
}

/* Remove the small eyebrow labels above section titles ("יכולות הייצור שלנו",
   "ONE-STOP SHOP", "QUALITY ASSURANCE", "01 → 07", "SEND YOUR PART"): they read
   as AI-slop and clutter the heading. Keep the meaningful hero kicker + logo strip. */
.section-eyebrow,
.cta-band__eyebrow { display: none !important; }

/* Tighten the dead white band between the KPI strip and the logos: the stats
   strip should flow straight into the logo marquee, not float above a gap. */
.elementor .hero-stats-section { padding-block-end: 0 !important; }
.elementor .trusted--static-section .trusted--static,
.trusted--static.is-marquee,
.trusted--static { padding-block-start: 2px !important; }
.elementor .trusted--static-section { margin-block-start: -14px !important; }
.trusted--static .trusted__eyebrow { margin-block: 0 12px !important; }

/* The floating-buttons section sits in the document flow but its buttons are
   position:fixed (out of flow): collapse it to zero height so it doesn't leave a
   white gap between the CTA band and the footer. The fixed buttons still render. */
.ani-float-ui,
.ani-float-ui > .elementor-container,
.ani-float-ui .elementor-column-wrap,
.ani-float-ui .elementor-widget-wrap,
.ani-float-ui .elementor-widget,
.ani-float-ui .elementor-widget-container {
	padding: 0 !important;
	margin: 0 !important;
	min-block-size: 0 !important;
	min-height: 0 !important;
}
.ani-float-ui { line-height: 0 !important; font-size: 0 !important; }

/* Retina sub-pixel seam fix: the white page background (body bg) showed through
   fractional-pixel gaps between sections: a faint white hairline on @2x displays,
   worst where a blue/dark section meets another (CTA → footer). Overlap each
   top-level block by 1px so no body background can ever show through a seam. */
.elementor .elementor-section.elementor-top-section { margin-block-end: -1px !important; }
.ani-site-footer { margin-block-start: -1px !important; }

/* ── Logo marquee: TRULY seamless infinite loop (Ryan Mulligan pattern, RTL-correct).
   Old bug 1: translateX(-50%) ignored the flex gap → a jump every cycle.
   Old bug 2: sets weren't forced to fill the viewport → an empty gap on wide screens.
   Fix: animate EACH set by translateX(100% + gap) with min-width:100%; the track
   holds the single seam gap; the sign is flipped for RTL (translateX ignores dir). */
.trusted--static.is-marquee {
	--trusted-gap: 56px;
	--trusted-speed: 42s;
	--trusted-dir: 1;            /* RTL: travel in reading direction; flip to -1 if reversed */
	--trusted-fade: clamp(64px, 14%, 180px);
	overflow: hidden;
}
.trusted--static.is-marquee .trusted__track {
	display: flex;
	flex-wrap: nowrap;
	inline-size: 100%;
	overflow: hidden;
	/* D-3: the strip used to slice a logo mid-word at each edge. Fade the logos
	   out instead of cutting them (mask is on the track so the white strip
	   background behind it is untouched). */
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 var(--trusted-fade), #000 calc(100% - var(--trusted-fade)), transparent 100%);
	mask-image: linear-gradient(to right, transparent 0, #000 var(--trusted-fade), #000 calc(100% - var(--trusted-fade)), transparent 100%);
	gap: var(--trusted-gap);
	animation: none;            /* the sets animate now, not the track */
}
.trusted--static.is-marquee .trusted__set {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-around;
	min-inline-size: 100%;      /* each copy always covers the viewport → no wide-screen gap */
	gap: var(--trusted-gap);
	padding-inline-end: 0;      /* the track gap is the single seam now */
	animation: trusted-marquee var(--trusted-speed) linear infinite;
	will-change: transform;
}
.trusted--static.is-marquee:hover .trusted__set { animation-play-state: paused; }
@keyframes trusted-marquee {
	to { transform: translateX(calc(var(--trusted-dir) * (100% + var(--trusted-gap)))); }
}
@media (prefers-reduced-motion: reduce) {
	.trusted--static.is-marquee .trusted__track { -webkit-mask-image: none; mask-image: none; }
	.trusted--static.is-marquee .trusted__set { animation: none; flex-wrap: wrap; justify-content: center; }
	.trusted--static.is-marquee .trusted__set[aria-hidden="true"] { display: none; }
}

/* ============================================================ GLOBAL LINK COLOUR
   Bug fix: unstyled links (post content, category/search archives) fell back to
   the browser's default :visited maroon/purple. Force brand blue everywhere a
   component hasn't already set its own colour. Styled components keep their own
   colours via higher specificity (.ani-btn, .ani-nav-list a, card titles, …). */
a {
	color: var(--ani-blue);
	text-decoration: none;
}
a:visited { color: var(--ani-blue); }
a:hover,
a:focus-visible { color: var(--ani-blue-deep); }

/* Readable body-copy links (single post + prose): underline for affordance. */
.ani-post-content a,
.ani-prose a {
	color: var(--ani-blue);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	font-weight: 600;
}
.ani-post-content a:visited,
.ani-prose a:visited { color: var(--ani-blue); }
.ani-post-content a:hover,
.ani-prose a:hover { color: var(--ani-blue-deep); }

/* ============================================================ HELLO-RESET CRIMSON BUTTON FIX
   Hello Elementor's reset.css paints every bare <button>/[type=button] crimson
   (#c36) and loads AFTER the child CSS. Give unclassed buttons a sane baseline,
   and out-specify the crimson on our component buttons. */
html button:not([class*="ani-"]):not([class*="btn"]):not([class*="elementor"]):not([class*="trp"]):not([class*="menu"]):not([class*="wp-"]) {
	-webkit-appearance: none;
	appearance: none;
	border: 1px solid var(--ani-border);
	background: transparent;
	color: inherit;
	font: inherit;
	cursor: pointer;
}
/* Hello ALSO fills bare buttons crimson on :hover/:focus: keep them neutral. */
html button:not([class*="ani-"]):not([class*="btn"]):not([class*="elementor"]):not([class*="trp"]):not([class*="menu"]):not([class*="wp-"]):hover,
html button:not([class*="ani-"]):not([class*="btn"]):not([class*="elementor"]):not([class*="trp"]):not([class*="menu"]):not([class*="wp-"]):focus {
	background: transparent;
	color: inherit;
}

/* Blog filter tabs: FULL state coverage. Hello's reset paints buttons crimson
   in base AND :hover/:focus; the tab the user clicked was stuck in :focus →
   crimson. These .ani-blog-tabs-scoped rules out-specify it in every state. */
.ani-blog-tabs .ani-blog-tab,
.ani-blog-tabs .ani-blog-tab:hover,
.ani-blog-tabs .ani-blog-tab:focus,
.ani-blog-tabs .ani-blog-tab:focus-visible,
.ani-blog-tabs .ani-blog-tab:active {
	color: var(--ani-body);
	background: var(--ani-surface);
	border: 1px solid var(--ani-border);
}
.ani-blog-tabs .ani-blog-tab:hover,
.ani-blog-tabs .ani-blog-tab:focus-visible {
	border-color: var(--ani-blue);
	color: var(--ani-blue);
}
.ani-blog-tabs .ani-blog-tab:focus-visible {
	outline: 2px solid var(--ani-blue);
	outline-offset: 2px;
}
.ani-blog-tabs .ani-blog-tab.is-active,
.ani-blog-tabs .ani-blog-tab.is-active:hover,
.ani-blog-tabs .ani-blog-tab.is-active:focus {
	background: var(--ani-blue);
	border-color: var(--ani-blue);
	color: var(--ani-white);
}

/* ============================================================ GLOBAL OVERFLOW GUARD
   Prevent any element from forcing horizontal scroll on mobile (the "site doesn't
   fit the screen" bug). `clip` avoids creating a scroll container (keeps sticky). */
html { overflow-x: clip; }
body { overflow-x: clip; max-inline-size: 100%; }
img, svg, video, iframe, table { max-width: 100%; }

/* ============================================================ MOBILE NAV (hamburger + drawer)
   Desktop (>900px): inline nav + CTA in the bar, hamburger + drawer hidden.
   Mobile (<=900px): hamburger in the bar; nav + CTA collapse into a slide-in
   drawer (.ani-mobile-nav), rendered OUTSIDE the transformed sticky header. */
.ani-site-header .ani-nav-toggle { display: none; }
.ani-mobile-nav { display: none; }
.ani-nav-backdrop { display: none; }

/* Hamburger icon (3 bars -> X) */
.ani-nav-toggle__box {
	position: relative;
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	inline-size: 26px;
	block-size: 20px;
}
.ani-nav-toggle__bar {
	display: block;
	block-size: 2.5px;
	inline-size: 100%;
	background: var(--ani-ink);
	border-radius: 2px;
	transition: transform .25s ease, opacity .2s ease;
	transform-origin: center;
}
body.ani-nav-open .ani-nav-toggle__bar:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
body.ani-nav-open .ani-nav-toggle__bar:nth-child(2) { opacity: 0; }
body.ani-nav-open .ani-nav-toggle__bar:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

@media (max-width: 900px) {
	/* Hide the desktop nav + desktop CTA; show the hamburger. */
	.ani-site-header .ani-header-nav,
	.ani-site-header .ani-header-cta { display: none; }

	.ani-site-header .ani-nav-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		inline-size: 46px;
		block-size: 46px;
		border: 0;
		background: transparent;
		cursor: pointer;
		flex-shrink: 0;
		-webkit-appearance: none;
		appearance: none;
	}
	.ani-header-inner { min-height: 64px; }

	/* Drawer slides in from the LEFT: same side as the hamburger button.
	   Physical sides + translateX (CSS transforms do NOT flip for RTL). */
	.ani-mobile-nav {
		display: flex;
		flex-direction: column;
		position: fixed;
		inset-block: 0;
		left: 0;
		right: auto;
		inline-size: min(84vw, 350px);
		background: var(--ani-white);
		box-shadow: 8px 0 40px rgba(13, 20, 27, .18);
		padding: 84px 22px 28px;
		z-index: 1200;
		overflow-y: auto;
		transform: translateX(-100%);
		transition: transform .3s cubic-bezier(.4, 0, .2, 1);
	}

	.ani-mobile-nav__close,
	.ani-mobile-nav__close:hover,
	.ani-mobile-nav__close:focus {
		position: absolute;
		inset-block-start: 16px;
		inset-inline-end: 16px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		inline-size: 44px;
		min-inline-size: 44px;
		block-size: 44px;
		min-block-size: 44px;
		padding: 0;
		border: 1px solid var(--ani-border) !important;
		border-radius: 50%;
		background: var(--ani-white) !important;
		color: var(--ani-ink) !important;
		box-shadow: none;
		cursor: pointer;
		appearance: none;
	}
	.ani-mobile-nav__close svg { inline-size: 22px; block-size: 22px; }
	body.ani-nav-open .ani-mobile-nav { transform: translateX(0); }

	.ani-mobile-nav__list {
		list-style: none;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
	}
	.ani-mobile-nav__list li { border-block-end: 1px solid var(--ani-border); }
	.ani-mobile-nav__list a {
		display: block;
		padding-block: 16px;
		font-size: 1.12rem;
		font-weight: 600;
		color: var(--ani-ink);
		text-decoration: none;
	}
	.ani-mobile-nav__list a:hover { color: var(--ani-blue); }

	.ani-mobile-nav__cta {
		margin-block-start: 24px;
		inline-size: 100%;
		justify-content: center;
		min-height: 52px;
		font-size: 1.05rem;
		border-radius: 8px;
	}

	.ani-mobile-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 12px;
		margin-block-start: 14px;
	}
	.ani-mobile-action {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		padding-block: 13px;
		border-radius: 10px;
		font-weight: 700;
		font-size: .95rem;
		text-decoration: none;
	}
	.ani-mobile-action svg { inline-size: 20px; block-size: 20px; }
	.ani-mobile-action--whatsapp { background: #25D366; color: #053D26; }
	.ani-mobile-action--call { background: rgba(31, 109, 255, .1); color: var(--ani-blue); }

	/* Backdrop */
	.ani-nav-backdrop {
		display: block;
		position: fixed;
		inset: 0;
		background: rgba(13, 20, 27, .5);
		opacity: 0;
		visibility: hidden;
		transition: opacity .3s ease, visibility .3s ease;
		z-index: 1150;
	}
	body.ani-nav-open .ani-nav-backdrop { opacity: 1; visibility: visible; }
	body.ani-nav-open { overflow: hidden; }
	/* Keep the header in place while the drawer is open. */
	body.ani-nav-open .ani-site-header { transform: none; }
}

/* ============================================================ SITE-WIDE FLOATING CONTACT
   Fixed bottom-left (physical, opposite the RTL bottom-right language switcher).
   Circular icon buttons; visible on every breakpoint. Front page uses its own
   Elementor float cluster, so this renders on all other pages (see footer.php). */
.ani-float-contact {
	position: fixed;
	inset-block-end: 18px;
	left: 18px;
	z-index: 980;
	display: flex;
	flex-direction: column;
	gap: 12px;
	transition: opacity .2s ease, visibility .2s ease;
}
.ani-float-contact__btn {
	position: relative;
	inline-size: 56px;
	block-size: 56px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-decoration: none;
	box-shadow: 0 6px 20px rgba(13, 20, 27, .24);
	transition: transform .15s ease, box-shadow .15s ease;
}
.ani-float-contact__btn:hover { transform: translateY(-3px) scale(1.04); color: #fff; }
.ani-float-contact__btn svg { inline-size: 28px; block-size: 28px; }
.ani-float-contact__btn--whatsapp { background: #128C4B; }
.ani-float-contact__btn--call { background: var(--ani-blue); }
/* sr-only label (the anchor carries an aria-label). */
.ani-float-contact__label {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
@media (max-width: 600px) {
	.ani-float-contact { inset-block-end: 14px; left: 14px; gap: 10px; }
	.ani-float-contact__btn { inline-size: 52px; block-size: 52px; }
	.ani-float-contact__btn svg { inline-size: 25px; block-size: 25px; }
}
.ani-float-cluster {
	transition: opacity .2s ease, visibility .2s ease;
}

.ani-contact-zone-visible .ani-float-contact,
.ani-contact-zone-visible .ani-float-cluster,
body.ani-nav-open .ani-float-contact,
body.ani-nav-open .ani-float-cluster {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}


/* 2) Certifications: no static accent. Highlight on HOVER (desktop pointer);
      fill blue + white text on SCROLL (mobile, via .is-active from cert-fill.js). */
.cert-badge--accent { border-color: var(--ani-border); }
.cert-badge--accent .cert-badge__code { color: var(--ani-ink); }
.cert-badge {
	transition: background .35s ease, border-color .25s ease, box-shadow .18s ease, transform .18s ease;
}
@media (hover: hover) and (min-width: 761px) {
	.cert-badge:hover {
		border-color: var(--ani-blue);
		box-shadow: 0 10px 26px rgba(31, 109, 255, .16);
		transform: translateY(-3px);
	}
	.cert-badge:hover .cert-badge__code { color: var(--ani-blue); }
}
@media (max-width: 760px) {
	.cert-badge.is-active {
		background: var(--ani-blue);
		border-color: var(--ani-blue);
		box-shadow: 0 10px 26px rgba(31, 109, 255, .24);
	}
	.cert-badge.is-active .cert-badge__code,
	.cert-badge.is-active .cert-badge__label { color: #fff; }
}

/* 3) "One Stop Shop" chain → vertical timeline on mobile (no awkward wrap). */
@media (max-width: 760px) {
	.onestop__chain {
		flex-direction: column;
		align-items: stretch;
		flex-wrap: nowrap;
		gap: 0;
		position: relative;
		padding-inline: 26px;
		max-inline-size: 360px;
		margin-inline: auto;
	}
	/* faint vertical spine on the inline-start (right in RTL) */
	.onestop__chain::before {
		content: "";
		position: absolute;
		inset-inline-start: 17px;
		inset-block: 18px;
		inline-size: 2px;
		background: rgba(31, 109, 255, .2);
	}
	.onestop__step {
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
		gap: 16px;
		padding-block: 10px;
		position: relative;
		z-index: 1;
	}
	.onestop__step-num {
		inline-size: 36px;
		block-size: 36px;
		flex-shrink: 0;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		background: var(--ani-blue);
		color: #fff;
		font-size: 0.92rem;
		margin: 0;
	}
	.onestop__step-label { font-size: 0.98rem; font-weight: 600; text-align: start; }
	.onestop__connector { display: none; }
}

/* 4) Hero stats: let labels wrap so the icon never overlaps the text (mobile). */
@media (max-width: 760px) {
	.hero-stats__label { white-space: normal; line-height: 1.4; }
	.hero-stats__item { gap: 12px; align-items: center; }
	.hero-stats__icon svg { width: 22px; height: 22px; }
}

/* D-2: below ~560px three tiles no longer fit — stack one per row, centred, with
   the icon beside the text (never above it) so the B2B caption keeps its line. */
@media (max-width: 560px) {
	.hero-stats {
		grid-template-columns: 1fr;
	}
	.hero-stats__item {
		justify-content: center;
		gap: 14px;
		padding-block: 16px;
		padding-inline: 20px;
	}
	.hero-stats__item + .hero-stats__item::before {
		inset-inline: 20%;
		inset-block: auto auto;
		inline-size: auto;
		block-size: 1px;
	}
	/* one shared text column so the three icons align vertically and the
	   stack reads as a tidy centred group, not a ragged one. */
	.hero-stats__text { text-align: start; inline-size: 13.5rem; }
	.hero-stats__label { white-space: normal; }
}

/* 5) Hero: trim the description on mobile (clamp, keeps full text for SEO). */
@media (max-width: 760px) {
	.hero__sub {
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	.hero__copy { padding-block: 32px 36px; }
}

/* 6) Industries sectors: smaller icons + allow two tidy lines on mobile. */
@media (max-width: 600px) {
	.ind-sectors { gap: 14px 18px; }
	.ind-sector { min-width: 64px; }
	.ind-sector__icon { width: 46px; height: 46px; border-radius: 12px; }
	.ind-sector__icon svg { width: 22px; height: 22px; }
	.ind-sector__label { font-size: 0.94rem; }
}

/* ============================================================
   Homepage: hide the "One Stop Shop / תהליך מלא תחת קורת גג אחת"
   section. Client 2026-08-07: the one-stop framing is not a
   meaningful differentiator: section removed from view pending
   any replacement content the client provides.
   ============================================================ */
.onestop-section,
.elementor-element-s-onestop {
	display: none !important;
}

/* ============================================================
   Official ANI: Models & Prototypes logo (client artwork 2026-08-06).
   Header on light, footer on dark (white variant). ============ */
.ani-brand--logo { display: inline-flex; align-items: center; gap: 0; }
.ani-brand__logo { display: block; height: 46px; width: auto; }
.ani-site-header .ani-brand__logo { height: 46px; }
.ani-brand--footer .ani-brand__logo { height: 58px; }
@media (max-width: 600px) {
	.ani-brand__logo { height: 38px; }
	.ani-brand--footer .ani-brand__logo { height: 48px; }
}

/* ================================================================ homepage client-review fixes 2026-08-29 (T-20/T-23/T-24/T-25) */

/* Client-logo strip heading (T-20). */
.trusted__title {
	margin: 0 0 18px;
	color: var(--ani-ink);
	font-size: clamp(1.05rem, .98rem + .34vw, 1.32rem);
	font-weight: 700;
	line-height: 1.35;
	text-align: center;
	text-wrap: balance;
}

/* Capability cards carry image + title + link only (T-23). */
.cap-card__body {
	min-block-size: 0;
	gap: 8px;
}

/* Un-numbered process chain: arrow nodes instead of 01-07 (T-24). */
.process-chain__num--arrow,
.process-chain__num--end {
	font-size: 0;
}

.process-chain__num--arrow svg,
.process-chain__num--end svg {
	inline-size: 20px;
	block-size: 20px;
}

/* Clickable industry icons (T-25). */
.ind-sector__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	color: inherit;
	text-decoration: none;
	border-radius: 12px;
	padding: 6px 4px;
	transition: transform .25s ease, color .25s ease;
}

.ind-sector__link:hover,
.ind-sector__link:focus-visible {
	color: var(--ani-blue);
	transform: translateY(-2px);
}

.ind-sector__link:focus-visible {
	outline: 3px solid var(--ani-blue);
	outline-offset: 3px;
}


/* ---------------------------------------------------------------- shared capability grid
   One services section on home / about / services (client, 2026-09-13). Moved here from
   service.css, which only loads on the service pages. */
/* Five service cards with NO empty cell: a 6-column grid where the first three
   span 2 each and the last two span 3 each, so the bottom row fills the width.
   (Approved homepage direction, 2026-09-20 — the old 3+2 left a visible hole.) */
.ani-cap-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 28px;
}

.ani-cap-card { grid-column: span 2; }
.ani-cap-card:nth-child(4),
.ani-cap-card:nth-child(5) { grid-column: span 3; }

/* The two wider cards get a horizontal layout so they don't look stretched. */
@media (min-width: 1025px) {
	.ani-cap-card:nth-child(4),
	.ani-cap-card:nth-child(5) {
		flex-direction: row;
	}

	.ani-cap-card:nth-child(4) .ani-cap-card__photo,
	.ani-cap-card:nth-child(5) .ani-cap-card__photo {
		aspect-ratio: auto;
		flex: 0 0 46%;
		min-height: 100%;
	}

	.ani-cap-card:nth-child(4) .ani-cap-card__body,
	.ani-cap-card:nth-child(5) .ani-cap-card__body {
		justify-content: center;
	}
}

/* Part photo: fixed-height, object-cover */
.ani-cap-card {
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	box-shadow: var(--ani-shadow-card);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .18s ease, transform .18s ease;
}

.ani-cap-card:hover {
	box-shadow: 0 8px 28px rgba(31, 109, 255, .14);
	transform: translateY(-3px);
}

.ani-cap-card__photo {
	width: 100%;
	aspect-ratio: 3 / 2; /* show the full image (client flagged the cut triptych) */
	height: auto;
	overflow: hidden;
	flex-shrink: 0;
	background: #0f1720;
}

.ani-cap-card__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .3s ease;
}

.ani-cap-card:hover .ani-cap-card__photo img {
	transform: scale(1.03);
}

.ani-cap-card__body {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 24px 22px 22px;
	flex: 1 1 auto;
}

.ani-cap-card__title {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--ani-ink);
	margin: 0;
}

.ani-cap-card__bullets {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1 1 auto;
}

.ani-cap-card__bullets li {
	font-size: 0.9rem;
	color: var(--ani-body);
	line-height: 1.5;
	padding-inline-start: 14px;
	position: relative;
}

.ani-cap-card__bullets li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: 8px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--ani-blue);
}

/* "פרטים נוספים" link at card bottom */
.ani-cap-card__link {
	margin-block-start: auto;
	font-size: 0.92rem;
}


/* =============================================================== DETAIL HERO */

.ani-service-hero {
	padding-block: 72px 56px;
}

.ani-service-hero__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: center;
}

.ani-service-hero__copy {
	order: 1;
}

.ani-service-hero__media {
	order: 2;
}

.ani-service-breadcrumb {
	color: var(--ani-blue);
	font-weight: 600;
	font-size: 0.85rem;
	text-decoration: none;
	transition: color .15s;
}

.ani-service-breadcrumb:hover {
	color: var(--ani-blue-deep);
}

.ani-service-hero__intro {
	font-size: 1.1rem;
	color: var(--ani-body);
	line-height: 1.7;
	max-width: 56ch;
	margin-block: 16px 28px;
}


/* =============================================================== WHAT WE DO */

.ani-service-what {
	padding-block: 80px;
}

.ani-service-bullets {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
	max-width: 68ch;
}

.ani-service-bullets__item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	font-size: 1.02rem;
	color: var(--ani-body);
	line-height: 1.6;
}

.ani-service-bullets__dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--ani-blue);
	flex-shrink: 0;
	margin-block-start: 7px;
}


/* =============================================================== MATERIALS / METHODS */

.ani-service-materials {
	padding-block: 88px;
}

.ani-service-mat-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
}

.ani-service-mat-card {
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: 10px;
	padding: 18px 20px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	box-shadow: 0 1px 3px rgba(13, 20, 27, .04);
}

/* Technical term: IBM Plex Mono, LTR */
.ani-service-mat-card__term {
	font-family: var(--ani-mono);
	font-size: 0.88rem;
	font-weight: 500;
	color: var(--ani-blue);
	unicode-bidi: isolate;
}

.ani-service-mat-card__desc {
	font-size: 0.9rem;
	color: var(--ani-body);
	line-height: 1.5;
}


/* =============================================================== EQUIPMENT */

.ani-service-equipment {
	padding-block: 80px;
}

.ani-service-equip-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	border: 1px solid var(--ani-border);
	border-radius: var(--ani-radius-card);
	overflow: hidden;
}

.ani-service-equip-item {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 22px;
	border-block-end: 1px solid var(--ani-border);
	background: var(--ani-white);
	transition: background .15s ease;
}

.ani-service-equip-item:last-child {
	border-block-end: none;
}

.ani-service-equip-item:hover {
	background: var(--ani-surface);
}

/* Machine name: IBM Plex Mono, LTR-isolated */
.ani-service-equip-item__name {
	font-family: var(--ani-mono);
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--ani-ink);
	unicode-bidi: isolate;
	flex-shrink: 0;
	min-width: 240px;
}

.ani-service-equip-item__desc {
	font-size: 0.9rem;
	color: var(--ani-muted);
	line-height: 1.5;
}


/* =============================================================== APPLICATIONS */

.ani-service-apps {
	padding-block: 88px;
}

.ani-service-app-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
}

.ani-service-app-card {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	background: var(--ani-white);
	border: 1px solid var(--ani-border);
	border-radius: 10px;
	padding: 18px 20px;
	font-size: 0.95rem;
	color: var(--ani-body);
	line-height: 1.55;
	box-shadow: 0 1px 3px rgba(13, 20, 27, .04);
}

.ani-service-app-card__dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--ani-blue);
	flex-shrink: 0;
	margin-block-start: 6px;
}

@media (max-width: 1024px) {
	.ani-cap-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.ani-cap-card,
	.ani-cap-card:nth-child(4),
	.ani-cap-card:nth-child(5) { grid-column: span 1; }
}

@media (max-width: 760px) {
	.ani-cap-grid {
		grid-template-columns: 1fr;
		max-width: 480px;
		margin-inline: auto;
	}

	.ani-cap-card,
	.ani-cap-card:nth-child(4),
	.ani-cap-card:nth-child(5) { grid-column: span 1; }
}

@media (max-width: 480px) {
	.ani-cap-grid {
		max-width: none;
	}
}


/* ---------------------------------------------------------------- mobile drawer search */
.ani-mobile-nav__search {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-block: 4px 16px;
	border: 1px solid var(--ani-border);
	border-radius: 10px;
	background: var(--ani-white);
	padding-inline: 12px;
}

.ani-mobile-nav__search input[type="search"] {
	flex: 1 1 auto;
	border: 0;
	background: transparent;
	font: inherit;
	font-size: 1rem;
	color: var(--ani-ink);
	padding-block: 12px;
	min-inline-size: 0;
}

.ani-mobile-nav__search input[type="search"]:focus {
	outline: none;
}

.ani-mobile-nav__search:focus-within {
	border-color: var(--ani-blue);
	box-shadow: 0 0 0 3px rgba(31, 109, 255, .16);
}

.ani-mobile-nav__search button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 36px;
	block-size: 36px;
	border: 0;
	border-radius: 8px;
	background: var(--ani-blue);
	color: #fff;
	cursor: pointer;
	flex-shrink: 0;
}

.ani-mobile-nav__search svg {
	inline-size: 18px;
	block-size: 18px;
}

/* Visually-hidden label helper (the parent theme's class is not loaded here). */
.screen-reader-text {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}


/* ---------------------------------------------------------------- quality band on dark
   Approved homepage direction, 2026-09-20: the quality promise moves onto the dark
   blueprint surface, so the page has two anchored dark moments — the hero and this —
   instead of one unbroken light field. Overrides the earlier light treatment above. */
.certs-section.certs-section {
	background: var(--ani-ink);
	color: #fff;
	position: relative;
	overflow: hidden;
}

.certs-section::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(to right, rgba(255,255,255,.05) 1px, transparent 1px),
		linear-gradient(to bottom, rgba(255,255,255,.05) 1px, transparent 1px);
	background-size: 56px 56px;
	pointer-events: none;
}

.certs-section > * { position: relative; }

.certs-section .section-title,
.certs-section .section-eyebrow { color: #fff; }
.certs-section .section-eyebrow { opacity: .72; letter-spacing: .12em; }

.certs-section .certs__features { gap: 14px 48px; margin-block-start: 28px; }

.certs-section .certs__feature {
	color: rgba(255, 255, 255, .88);
	font-size: 1rem;
	gap: 10px;
}

.certs-section .certs__feature-dot { background: var(--ani-blue); }
.certs-section .dimline__rule { background: rgba(255, 255, 255, .28); }
.certs-section .dimline__tick { background: rgba(255, 255, 255, .4); }
.certs-section .dimline__tick--blue { background: var(--ani-blue); }

@media (max-width: 760px) {
	.certs-section .certs__features { flex-direction: column; align-items: center; gap: 12px; }
}


/* ---------------------------------------------------------------- trusted strip: optical balance
   The marks are different shapes — a wide wordmark, a square seal, a tall roundel — so a single
   height makes some shout and others vanish. Each gets an equal optical box and a per-mark scale.
   (Approved homepage direction, 2026-09-20.) */
.trusted__track .trusted__logo,
.elementor .trusted__track .trusted__logo,
.elementor-widget-container .trusted__track .trusted__logo {
	height: 34px !important;
	max-width: 132px !important;
	opacity: .58;
}

/* Square and compact marks read smaller at the same height — give them a little more. */
.trusted__logo[src*="iibr"],
.trusted__logo[src*="iai"] { height: 42px !important; }

/* Wide wordmarks read heavier — pull them back. */
.trusted__logo[src*="airobotics"],
.trusted__logo[src*="hevendrones"] { height: 28px !important; }

.trusted__track .trusted__logo:hover { opacity: 1; }

/* ---------------------------------------------------------------- hero headline
   The approved direction carries a larger, tighter headline over the dark hero. */
@media (min-width: 1025px) {
	.hero-shot__copy h1,
	.ani-hero h1 {
		font-size: clamp(2.6rem, 1.6rem + 2.6vw, 4rem);
		line-height: 1.05;
		letter-spacing: -0.01em;
	}
}
