/**
 * MAIA design tokens — generated by packages/tokens/scripts/build.ts. Do not edit.
 *
 * Source of truth is src/**\/*.json (DTCG). Figma is downstream of this file:
 * the Variables REST API needs an Enterprise plan, so tokens live in code.
 *
 * Fluid values interpolate between 402px and 1440px — the two
 * widths the design was actually drawn at. Their -min / -max bounds stay in
 * src/: nothing reads them at runtime.
 */

:root {
  --timeline-rail-width: 2px; /** The rule the phases of a process are threaded on. Off the 4px spacing scale, like the nav rule — a drawn line rather than a spacing step. UNSOURCED — no macet draws a phased process. */
  --table-min-inline-size: 640px; /** Below this the columns of a comparison table stop holding a readable line and the table scrolls inside its own frame instead. Measured on the three-column table this design has: a 140px feature name and two 250px value columns. UNSOURCED — no macet draws a table. */
  --faq-icon-size: 34px;
  --reading-rail-width: 3px; /** The rule that fills as an article is read, drawn under the header. Off the 4px spacing scale, like the nav rule — a drawn line rather than a spacing step. Wider than the timeline's rail because that one is read beside its text and this one is read alone against the page edge. UNSOURCED — no macet draws an article. */
  --prose-paragraph-gap: 28px; /** One blank line of body copy — 20px at leading 1.4. The design writes a prose band as a single text node with an empty line between paragraphs, so the gap is a line height and not a spacing step. Set to space.6 it left both football prose bands 4px short per gap. */
  --note-icon-size: 40px; /** The drawn icon frame on a negative card. The card's vertical rhythm counts the frame, not the glyph: 40 icon + 16 gap puts the paragraph at 56, which is where the design draws it. */
  --note-glyph-size: 24px; /** The cross itself, centred in the frame above. Sized separately because only this number is seen and only the other one is laid out. */
  --header-height: 80px;
  --nav-rule: 5px; /** The accent rule under the current section's nav item. Measured off a 4x export of 217:1145 — 20 device pixels. Off the 4px spacing scale, hence a knob of its own rather than a spacing step. */
  --nav-burger-size: 24px; /** The burger glyph box inside the 48px toggle. It is the size the Lucide `menu` icon rendered at before the bars were drawn in CSS — presetIcons' 1.2 scale on the inherited 20px body size — so the closed state is unchanged. */
  --nav-burger-bar-inline-size: 18px; /** One bar of the burger. Lucide draws the line from x=4 to x=20, and its round cap adds half the 2px stroke at each end, so the glyph is 18px across and not 16. */
  --nav-burger-bar-block-size: 2px; /** Lucide's stroke width. Off the 4px spacing scale, like the nav rule — a drawn line rather than a spacing step. */
  --nav-burger-bar-offset: 7px; /** How far the outer two bars sit from the middle one. Lucide centres the three lines at y=5, 12 and 19. Animating this to zero is what turns the burger into the cross, so the two states are one glyph and not two icons. */
  --nav-drawer-inline-size: 360px; /** The off-canvas menu panel, docked to the inline end below the desktop breakpoint. UNSOURCED — no mobile or tablet header is drawn. Wide enough for the longest label, 'Solutions and Services', on one line at the drawn 16px bold, which is also what keeps 42px of dimmed page beside it on the 402 artboard. */
  --font-family-sans: var(--font-public-sans); /** Public Sans, one family for the whole site. It has no Cyrillic subset. The face is delivered by the consuming app's font pipeline, which publishes the loaded family and its metric-matched fallbacks under --font-public-sans; a consumer without that pipeline declares the property itself. */
  --font-weight-regular: 400;
  --font-weight-bold: 700; /** Buttons and inline links only. */
  --font-weight-black: 900; /** Every heading level. This is what makes the design read as geometric. */
  --font-leading-none: 1;
  --font-leading-label: 1.2; /** 24px on a 20px label. What Figma's AUTO line height resolves to for Public Sans, and the height every 20px label box is drawn at — the button labels and the card's "Explore service" link alike. */
  --font-leading-tight: 1.1;
  --font-leading-snug: 1.3;
  --font-leading-normal: 1.4;
  --font-leading-caption: 1.125; /** 18px on a 16px caption. */
  --palette-white: #ffffff;
  --palette-neutral-50: #f6f6f6; /** Figma --background-gray. Card and panel ground. */
  --palette-neutral-200: #e7e7e7; /** Figma --border. Also used as muted text on the accent band. */
  --palette-neutral-600: #5f6973; /** Figma --secondary-text. */
  --palette-neutral-900: #101418; /** Figma --text. */
  --palette-blue-700: #205e8c; /** Figma --accent. The single brand colour. */
  --palette-blue-800: #1a4d73; /** DERIVED — not in the design. Accent hover/active. Needs design sign-off. */
  --palette-red-50: #ffeded; /** Figma 217:3014. Ground of the "other tools cannot" cards on the AI Football Agent layout. The one warning colour in the design. */
  --palette-red-500: #ff0505; /** Figma I217:3015;217:1929. The cross glyph on that card. A graphic, never text: it clears 3:1 on red.50 and nothing more. */
  --palette-scrim-white-80: rgba(255, 255, 255, 0.8); /** white at 80%. Hero photograph. The home artboard drew 80% and the two later ones 90%; the lighter scrim is the one that survives, so more of the photograph reads through. It costs the hero eyebrow a point of contrast over a dark photograph — the pinned defect test in tests/tokens.test.ts measures the loss. */
  --palette-scrim-blue-700-90: rgba(32, 94, 140, 0.9); /** blue.700 at 90%. Final CTA photograph. */
  --palette-scrim-neutral-900-50: rgba(16, 20, 24, 0.5); /** DERIVED — neutral.900 at 50%. The page behind the open menu drawer. Nothing is read through it, so it answers to no contrast bar; it is a dimming, and 50% is the weight at which the drawn hero still reads as a photograph rather than as a solid. */
  --space-2: 8px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-14: 56px;
  --space-16: 64px;
  --space-20: 80px;
  --space-32: 128px;
  --space-base: 4px;
  --radius-lg: 16px; /** Cards. */
  --radius-full: 9999px; /** Pill buttons — Figma has 50px on a 48px-tall control. */
  --size-control: 48px; /** Button and icon-button height. */
  --size-container: 1328px; /** Content width at 1440. */
  --size-headline: 1004px; /** Hero H1. Wider than the running-text measure, because at 64px a heading needs more room per line, and the design draws it at 1004 inside the 1328 container. */
  --size-measure: 656px; /** Longest line of running text. Exactly one column of the 2-up grid: (1328 - 16) / 2. Every section header in the design is set to it. */
  --breakpoint-mobile: 402px;
  --breakpoint-tablet: 768px;
  --breakpoint-laptop: 1024px;
  --breakpoint-desktop: 1440px;
  --motion-duration-fast: 150ms; /** A state change on something already under the pointer — a colour, a lift, an arrow. Long enough to be seen as a change and short enough that the element still feels attached to the cursor. */
  --motion-duration-base: 300ms; /** An element arriving or leaving on its own — a menu panel, a block fading in on scroll, a page transition. Twice the pointer duration because the reader is watching the element rather than the cursor. */
  --motion-duration-disclosure: 450ms; /** A FAQ row opening. Longer than the arrival duration because the box travels its own content's height, and the answers ported onto /faq run past a thousand pixels: at 300ms that distance is covered faster than the eye reads it as opening. Paired with the size easing rather than the arrival one — see ease.size. */
  --motion-duration-stagger: 80ms; /** The gap between one element of a group arriving and the next. Only the hero uses it as a delay — everything below the fold is paced by the scroll instead. Deliberately shorter than `fast`: a stagger is read as one movement with a grain to it, and at a full 150ms the three parts of the hero read as three separate events. */
  --motion-ease-out: cubic-bezier(0.22, 1, 0.36, 1); /** The curve for something arriving, changing colour or lifting. Fast at the start and settling at the end, which is what makes a 150ms change readable at all: a linear one of the same length reads as a jump. */
  --motion-ease-size: cubic-bezier(0.4, 0, 0.2, 1); /** The curve for a box changing size. Eased at both ends rather than only the far one: the arrival curve spends three quarters of its travel in its first fifth, which a colour can absorb and a thousand-pixel height cannot — it reads as the box snapping open and then drifting. Never use it on anything that only fades or moves. */
  --motion-lift: 2px; /** How far an interactive card or button rises under the pointer. Applied as a negative translate — DTCG cannot negate a reference, so the sign lives in the calc() at the point of use. Off the 4px spacing scale, like the nav rule: 4px reads as the card jumping, and this is a hint rather than a movement. */
  --type-metric-size: 64px; /** StatsBand value. Drawn at 64 on both artboards — it does not shrink with h1, which goes 64 → 36. Reusing the h1 role rendered it at 36 on mobile. */
  --type-h4-size: 24px; /** FAQ question. No mobile value in the design — static until one exists. */
  --type-body-size: 20px;
  --type-caption-size: 16px; /** Section eyebrow and card number. Always uppercase. */
  --type-button-size: 20px;
  --card-padding: var(--space-10); /** 40px at every breakpoint in the design — it does not shrink on mobile, where a 354px card is left with 274px of text. */
  --card-radius: var(--radius-lg);
  --card-gap: var(--space-4);
  --card-icon-size: var(--space-8); /** The glyph that opens a card, where the source page marks the card with a pictogram. It stands in the slot the card number would take, never beside it — a card is labelled once. UNSOURCED — no macet draws an icon on a card. */
  --card-list-gap: var(--space-2); /** Between the rows of a list inside a card. Half of what a list gets in a prose band: a card is already a small box, and at the wider gap a six-row list stops reading as one object. UNSOURCED — no macet draws a list in a card. */
  --timeline-marker-size: var(--space-4); /** The dot that marks where a phase starts. Centred on the rail and on the first line of the phase label, so it reads as punctuation on the rule rather than as a bullet beside it. */
  --timeline-rail-offset: var(--space-10); /** How far a phase's text is set in from the rail. Leaves the dot clear of the longest phase label at the 402 width. */
  --timeline-step-gap: var(--space-16); /** Between one phase and the next. Longer than the grid gutter because the rail runs unbroken through it: the gap has to read as distance travelled rather than as a seam. */
  --comparison-icon-size: var(--space-6); /** The cross that opens the half of a comparison row being argued against. The half being argued for carries no mark — its weight is the argument. UNSOURCED — no macet draws a comparison. */
  --button-height: var(--size-control);
  --button-padding-inline: var(--space-8);
  --button-radius: var(--radius-full);
  --button-gap: var(--space-6); /** Between buttons in a group. */
  --faq-padding: var(--space-10);
  --faq-gap: var(--space-14); /** Question to answer. */
  --prose-list-gap: var(--space-4); /** Between the rows of a list inside a prose band. Deliberately shorter than the paragraph gap: the rows still have to read as one list rather than as a run of one-line paragraphs. UNSOURCED — no macet draws a list. */
  --nav-padding-inline: var(--space-6); /** Half the drawn distance between two nav labels. It is padding rather than gap because the rule is as wide as the item, and a gap would draw it 48px too narrow. */
  --color-text-primary: var(--palette-neutral-900);
  --color-text-secondary: var(--palette-neutral-600);
  --color-text-accent: var(--palette-blue-700);
  --color-text-on-accent: var(--palette-white);
  --color-text-on-accent-muted: var(--palette-neutral-200); /** Body copy on the accent band. The design reuses the border colour here; this token gives it a correct name. */
  --color-surface-default: var(--palette-white);
  --color-surface-raised: var(--palette-neutral-50); /** Cards. */
  --color-surface-accent: var(--palette-blue-700); /** Stats band and final CTA. */
  --color-surface-negative: var(--palette-red-50); /** The card that states what something cannot do. The tint carries the meaning; the ink does not change. */
  --color-icon-negative: var(--palette-red-500);
  --color-overlay-photo: var(--palette-scrim-white-80); /** Hero. Lifts the photograph towards the page ground so ink-coloured text keeps its contrast. */
  --color-overlay-accent: var(--palette-scrim-blue-700-90); /** Final CTA. Turns the photograph into the accent band, so white text behaves as it does on the solid one. */
  --color-overlay-scrim: var(--palette-scrim-neutral-900-50); /** Behind the open menu drawer. UNSOURCED — no mobile or tablet header is drawn, so neither the drawer nor the dimming under it comes from Figma. The other two overlays sit under text; this one sits over content that is no longer being read. */
  --color-border-default: var(--palette-neutral-200);
  --color-border-strong: var(--palette-neutral-600); /** DERIVED — the design draws no second hairline weight. A frame that has to be *noticed*, which `default` cannot be: measured on the industries grid, a #e7e7e7 ring on a white card over the #f6f6f6 band is invisible at 1px and still invisible at 2px. Reserved for a transient state — the hover on a card that goes nowhere — and not for structure, which is what `default` frames. */
  --color-border-on-accent: var(--palette-neutral-200); /** The muted hairline on the accent band — the outlined button in the final CTA. */
  --color-border-on-accent-strong: var(--palette-white); /** The bright hairline on the accent band — the stats panel frame and the rules between its metrics. The design draws two different borders on this ground, and they are not interchangeable. */
  --color-accent-default: var(--palette-blue-700);
  --color-accent-hover: var(--palette-blue-800); /** DERIVED — no hover state in the design. */
  --color-focus-ring: var(--palette-blue-700);
  --color-focus-ring-on-accent: var(--palette-white);
  --layout-gutter: var(--space-4); /** Grid gap. 16px at every breakpoint. */
  --layout-container: var(--size-container);
  --layout-measure: var(--size-measure);
  --layout-headline: var(--size-headline);
  --layout-stack-tight: var(--space-4); /** Inside a card or a section header. */
  --layout-stack-loose: var(--space-10); /** Between hero elements. */
  --motion-nudge: var(--space-base); /** How far the arrow on a card link travels. One spacing step — the arrow is the only part of a card that says "further", and this is it saying so. */
  --motion-reveal-shift: var(--space-2); /** The distance a block travels while it fades in on scroll. Deliberately small: the reveal is meant to be noticed as arriving, not as sliding, and a longer travel on a page of eight card grids reads as the layout being unstable. */
  --type-display-leading: var(--font-leading-none); /** The glyphs are the layout here, so the line box is the type size and nothing else. */
  --type-h1-weight: var(--font-weight-black);
  --type-h2-weight: var(--font-weight-black);
  --type-h3-weight: var(--font-weight-black);
  --type-metric-leading: var(--font-leading-tight);
  --type-metric-weight: var(--font-weight-black);
  --type-h4-leading: var(--font-leading-normal);
  --type-h4-weight: var(--font-weight-black);
  --type-body-leading: var(--font-leading-normal);
  --type-body-weight: var(--font-weight-regular);
  --type-caption-leading: var(--font-leading-caption);
  --type-caption-weight: var(--font-weight-regular);
  --type-button-leading: var(--font-leading-label);
  --type-button-weight: var(--font-weight-bold);
  --card-background: var(--color-surface-raised);
  --faq-background: var(--color-surface-default);
  --faq-border: var(--color-border-default);
  --note-background: var(--color-surface-negative);
  --header-border: var(--color-border-default);
}

:root {
  /* fluid — interpolated from the -min / -max bounds in src/ */
  --hero-min-height: clamp(42.1875rem, 40.6142rem + 6.262vw, 46.25rem);
  --layout-page-padding: clamp(1.5rem, 0.7254rem + 3.0829vw, 3.5rem);
  --layout-section-padding: clamp(5rem, 3.8382rem + 4.6243vw, 8rem);
  --type-display-size: clamp(9rem, 0.0925rem + 35.4528vw, 32rem);
  --type-h1-leading: clamp(2.925rem, 2.3538rem + 2.2736vw, 4.4rem);
  --type-h1-size: clamp(2.25rem, 1.5723rem + 2.6975vw, 4rem);
  --type-h2-leading: clamp(2.925rem, 2.7798rem + 0.578vw, 3.3rem);
  --type-h2-size: clamp(2.25rem, 1.9595rem + 1.1561vw, 3rem);
  --type-h3-leading: clamp(2.6rem, 2.4741rem + 0.501vw, 2.925rem);
  --type-h3-size: clamp(2rem, 1.9032rem + 0.3854vw, 2.25rem);
}