/* _ds/wynova-design-system-439e28ef-ab4d-4ebd-87cf-ac313ac9e4b0/tokens/fonts.css */
/* =============================================================
   WYnova — Webfonts
   Brand type is DM Sans (display + body) and DM Mono (labels,
   eyebrows, code, the WYgroup endorsement). Self-hosted from
   /assets/fonts (same files Google Fonts serves; no third-party
   request before consent). DM Sans replaces Gilroy/Poppins from the
   original brand book per the v0.1 design-system spec.
   ============================================================= */

/* latin-ext */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/dm-mono-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/dm-mono-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/dm-mono-normal-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/dm-mono-normal-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/dm-sans-italic-var-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/dm-sans-italic-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/dm-sans-normal-var-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/dm-sans-normal-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/dm-sans-normal-var-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/dm-sans-normal-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/dm-sans-normal-var-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/dm-sans-normal-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* _ds/wynova-design-system-439e28ef-ab4d-4ebd-87cf-ac313ac9e4b0/tokens/colors.css */
/* =============================================================
   WYnova — Color tokens
   Dark indigo is the default surface. Purple is the only action
   color. Lime is a punctuation mark (one per screen, never CTAs).
   The full-spectrum WY mark gradient is the shared WYgroup
   identity and lives only in the logo / brand-mark assets.
   ============================================================= */

:root {
  /* ---------- Brand · core ---------- */
  --wy-color-indigo:        #0F022D;  /* primary dark surface */
  --wy-color-purple:        #905BF4;  /* brand primary / action */
  --wy-color-violet-700:    #4E2BCD;  /* brand deep, active states */
  --wy-color-lavender-300:  #AA7DFF;  /* secondary text on dark, decorative */
  --wy-color-lavender-100:  #E1D2FF;  /* muted text on dark, soft surfaces */
  --wy-color-lime:          #C0FF00;  /* high-energy accent — sparingly */
  --wy-color-off-white:     #EFEFEF;  /* primary light surface */

  /* wynova-green / wygroup-green — Figma Variables */
  --wy-color-wynova-green:  #C0FF00;  /* == lime */
  --wy-color-wygroup-green: #D7F781;  /* softer group accent */

  /* ---------- Brand mark gradient stops (logo only) ---------- */
  --wy-mark-orange:  #F9A21B;
  --wy-mark-amber:   #F47B20;
  --wy-mark-pink:    #EC2C7A;
  --wy-mark-coral:   #F2552E;
  --wy-mark-cyan:    #16E0D2;
  --wy-mark-blue:    #1FA2FF;
  --wy-mark-violet:  #9B36E0;

  /* ---------- Neutral ramp (extension — not in brand book) ---------- */
  --wy-neutral-50:   #F7F6F2;
  --wy-neutral-100:  #EDEBE3;
  --wy-neutral-200:  #D9D6CC;
  --wy-neutral-300:  #B4B2A9;
  --wy-neutral-400:  #8C8B83;
  --wy-neutral-500:  #5F5E5A;
  --wy-neutral-600:  #444441;
  --wy-neutral-700:  #2C2C2A;
  --wy-neutral-800:  #1B1B1A;
  --wy-neutral-900:  #0F0F0E;

  /* ---------- Semantic (extension) ---------- */
  --wy-success:      #22C55E;
  --wy-success-bg:   #103024;
  --wy-warning:      #F59E0B;
  --wy-warning-bg:   #3A2A09;
  --wy-error:        #EF4444;
  --wy-error-bg:     #3A1414;
  --wy-info:         #AA7DFF;       /* reuses lavender-300 */
  --wy-info-bg:      #1F1248;

  /* ---------- Surface · dark mode (default) ---------- */
  --wy-bg:           var(--wy-color-indigo);
  --wy-bg-elevated:  #1A0A3D;       /* slightly lifted card */
  --wy-bg-muted:     #160833;       /* subtle bands */
  --wy-text:         var(--wy-color-off-white);
  --wy-text-muted:   var(--wy-color-lavender-100);
  --wy-text-subtle:  #9D8FCB;
  --wy-border:       rgba(170, 125, 255, 0.20);
  --wy-border-strong:rgba(170, 125, 255, 0.40);
  --wy-surface-card: rgba(239, 239, 239, 0.04);

  /* ---------- Brand interactions ---------- */
  --wy-action:           var(--wy-color-purple);
  --wy-action-hover:     #A371FF;
  --wy-action-active:    var(--wy-color-violet-700);
  --wy-action-on:        var(--wy-color-off-white);

  /* ---------- Logo mark ---------- */
  --wy-mark-gradient: linear-gradient(100deg, var(--wy-mark-orange), var(--wy-mark-pink) 38%, var(--wy-mark-cyan) 62%, var(--wy-mark-blue) 88%, var(--wy-mark-violet));
}

/* ---------- Light-surface variant (opt-in) ---------- */
[data-surface="light"] {
  --wy-bg:           var(--wy-color-off-white);
  --wy-bg-elevated:  #FFFFFF;
  --wy-bg-muted:     #F7F6F2;
  --wy-text:         var(--wy-color-indigo);
  --wy-text-muted:   var(--wy-neutral-500);
  --wy-text-subtle:  #63625C;        /* AA on every light surface (neutral-400 was 2.8:1) */
  --wy-border:       var(--wy-neutral-200);
  --wy-border-strong:var(--wy-neutral-300);
  --wy-surface-card: #FFFFFF;

  /* Accessible purple for light surfaces. #905BF4 is 3.5:1 on lavender and
     3.7:1 under white text; #7240DE is >= 4.5:1 on white, #EFEFEF, #EDE6FF
     and #E4DAFF, and 6:1 under white text. Dark surfaces keep #905BF4.
     The action tokens are re-declared because var() resolves where defined. */
  --wy-color-purple:  #7240DE;
  --wy-action:        #7240DE;
  --wy-action-hover:  #5E30C8;
  --wy-action-active: var(--wy-color-violet-700);
  --wy-action-on:     #FFFFFF;
  --wy-footer-heading: var(--wy-color-violet-700);
  --wy-accordion-icon: var(--wy-color-purple);
}

/* _ds/wynova-design-system-439e28ef-ab4d-4ebd-87cf-ac313ac9e4b0/tokens/typography.css */
/* =============================================================
   WYnova — Typography tokens
   DM Sans for display + body; DM Mono only for data (step
   numbers, codes). Weights: 400 + 500 only (700 reserved for stat
   numbers > 32px). Headings carry the hierarchy on their own:
   no eyebrow labels above them (see readme: Type).
   ============================================================= */

:root {
  /* ---------- Families ---------- */
  --wy-font-display: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --wy-font-body:    'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --wy-font-mono:    'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --wy-font-fallback:'Arial', sans-serif;

  /* ---------- Scale ---------- */
  --wy-text-display:  clamp(48px, 6vw, 72px);   /* hero headline — 1 per page */
  --wy-text-h1:       clamp(36px, 4.5vw, 52px);
  --wy-text-h2:       clamp(28px, 3.5vw, 40px);
  --wy-text-h3:       clamp(22px, 2.5vw, 28px);
  --wy-text-h4:       20px;
  --wy-text-lead:     19px;
  --wy-text-body:     16px;
  --wy-text-small:    14px;
  --wy-text-caption:  12px;
  --wy-text-eyebrow:  11px;

  /* ---------- Weight ---------- */
  --wy-weight-regular: 400;
  --wy-weight-medium:  500;
  --wy-weight-bold:    700;

  /* ---------- Leading & tracking ---------- */
  --wy-leading-tight: 1.05;
  --wy-leading-snug:  1.2;
  --wy-leading-base:  1.5;
  --wy-leading-loose: 1.7;
  --wy-tracking-tight:  -0.015em;
  --wy-tracking-base:   0;
  --wy-tracking-wide:   0.04em;
  --wy-tracking-wider:  0.08em;
  --wy-tracking-widest: 0.14em;   /* eyebrow / mono labels */
}

/* _ds/wynova-design-system-439e28ef-ab4d-4ebd-87cf-ac313ac9e4b0/tokens/spacing.css */
/* =============================================================
   WYnova — Spacing & layout tokens
   4px base scale. Never use values between these steps.
   ============================================================= */

:root {
  /* ---------- Spacing scale (4px base) ---------- */
  --wy-space-0:   0;
  --wy-space-1:   4px;
  --wy-space-2:   8px;
  --wy-space-3:   12px;
  --wy-space-4:   16px;
  --wy-space-5:   24px;
  --wy-space-6:   32px;
  --wy-space-7:   48px;
  --wy-space-8:   64px;
  --wy-space-9:   96px;
  --wy-space-10:  128px;

  /* ---------- Layout ---------- */
  --wy-container:        1240px;
  --wy-container-narrow: 880px;
  --wy-container-wide:   1480px;
  --wy-gutter:           clamp(24px, 4vw, 48px); /* @kind spacing */

  /* ---------- Breakpoints (reference — use in @media) ---------- */
  --wy-bp-sm:   640px;
  --wy-bp-md:   768px;
  --wy-bp-lg:   1024px;
  --wy-bp-xl:   1280px;
  --wy-bp-2xl:  1536px;
}

/* _ds/wynova-design-system-439e28ef-ab4d-4ebd-87cf-ac313ac9e4b0/tokens/effects.css */
/* =============================================================
   WYnova — Radii, borders, elevation, motion, z-index
   Buttons + badges are always pill. Cards 16–24px. On dark
   surfaces prefer a subtle lavender border over heavy shadow.
   Motion is precise, never bouncy.
   ============================================================= */

:root {
  /* ---------- Border radii ---------- */
  --wy-radius-xs:   4px;
  --wy-radius-sm:   8px;
  --wy-radius-md:   12px;
  --wy-radius-lg:   16px;   /* default card */
  --wy-radius-xl:   24px;   /* hero blocks */
  --wy-radius-2xl:  32px;
  --wy-radius-pill: 9999px;

  /* ---------- Border widths ---------- */
  --wy-border-thin:   1px;
  --wy-border-base:   1.5px;
  --wy-border-thick:  2px;

  /* ---------- Elevation (extension — brand book has no shadows) ---------- */
  --wy-shadow-sm:  0 1px 2px rgba(15, 2, 45, 0.40);
  --wy-shadow-md:  0 6px 24px rgba(15, 2, 45, 0.40);
  --wy-shadow-lg:  0 16px 48px rgba(15, 2, 45, 0.45);
  --wy-glow:       0 0 0 4px rgba(144, 91, 244, 0.25);   /* purple focus ring */
  --wy-glow-lime:  0 0 0 4px rgba(192, 255, 0, 0.30);

  /* ---------- Motion ---------- */
  --wy-duration-fast:    120ms; /* @kind other */
  --wy-duration-base:    200ms; /* @kind other */
  --wy-duration-slow:    360ms; /* @kind other */
  --wy-ease:             cubic-bezier(0.2, 0.7, 0.2, 1); /* @kind other */
  --wy-ease-in:          cubic-bezier(0.5, 0, 0.75, 0); /* @kind other */
  --wy-ease-out:         cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */

  /* ---------- Z-index scale ---------- */
  --wy-z-base:     1; /* @kind other */
  --wy-z-sticky:   100; /* @kind other */
  --wy-z-dropdown: 200; /* @kind other */
  --wy-z-overlay:  900; /* @kind other */
  --wy-z-modal:    1000; /* @kind other */
  --wy-z-toast:    1100; /* @kind other */
  --wy-z-tooltip:  1200; /* @kind other */
}

/* _ds/wynova-design-system-439e28ef-ab4d-4ebd-87cf-ac313ac9e4b0/tokens/base.css */
/* =============================================================
   WYnova — Base reset + brand utilities (opinionated, optional)
   ============================================================= */

html { font-family: var(--wy-font-body); color: var(--wy-text); background: var(--wy-bg); -webkit-font-smoothing: antialiased; }
body { margin: 0; font-size: var(--wy-text-body); line-height: var(--wy-leading-base); }
h1, h2, h3, h4, h5, h6 { font-family: var(--wy-font-display); font-weight: var(--wy-weight-medium); letter-spacing: var(--wy-tracking-tight); line-height: var(--wy-leading-tight); margin: 0 0 var(--wy-space-4); }
p { margin: 0 0 var(--wy-space-4); }
a { color: var(--wy-color-lavender-300); text-decoration: none; transition: color var(--wy-duration-fast) var(--wy-ease); }
a:hover { color: var(--wy-color-purple); }
*:focus-visible { outline: none; box-shadow: var(--wy-glow); border-radius: var(--wy-radius-xs); }

/* Mono eyebrow utility — the WYnova section kicker */
.wy-eyebrow { font-family: var(--wy-font-mono); font-size: var(--wy-text-eyebrow); text-transform: uppercase; letter-spacing: var(--wy-tracking-widest); color: var(--wy-color-lime); font-weight: var(--wy-weight-medium); }

/* WYgroup endorsement string */

/* ---------- Button states (Button renders inline styles, so !important) ---------- */
.wy-btn:focus-visible { outline: 3px solid var(--wy-color-lime); outline-offset: 2px; }
[data-surface="light"] .wy-btn:focus-visible { outline-color: var(--wy-color-violet-700); }
.wy-btn--primary:hover { background: var(--wy-action-hover) !important; }
.wy-btn--primary:active { background: var(--wy-action-active) !important; transform: translateY(1px); }
.wy-btn--secondary:hover { border-color: var(--wy-color-purple) !important; background: rgba(144, 91, 244, 0.08) !important; }
.wy-btn--accent:hover { filter: brightness(0.94); }
@media (prefers-reduced-motion: reduce) { .wy-btn--primary:active { transform: none; } }
[data-surface="light"] .wy-cta-dark .wy-btn:focus-visible { outline-color: var(--wy-color-lime); }

/* assets/icons/tabler-icons-subset.css */
/*!
 * Tabler Icons 3.7.0 by tabler - https://tabler.io
 * License - https://github.com/tabler/tabler-icons/blob/master/LICENSE
 *
 * WYnova subset: only the icons the site uses (regenerate when adding one;
 * tests/assets.spec.js fails if a page uses an icon that is not here).
 */
@font-face{font-family:"tabler-icons";font-style:normal;font-weight:400;font-display:block;src:url("/assets/icons/tabler-icons-subset.woff2?v3.7.0") format("woff2")}
.ti{font-family:"tabler-icons" !important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.ti-affiliate:before{content:"\edff"}
.ti-alarm-off:before{content:"\f0a9"}
.ti-alert-triangle:before{content:"\ea06"}
.ti-archive-off:before{content:"\f0ad"}
.ti-arrow-back-up:before{content:"\eb77"}
.ti-arrow-right:before{content:"\ea1f"}
.ti-arrows-shuffle:before{content:"\f000"}
.ti-binary-tree:before{content:"\f5d4"}
.ti-bolt:before{content:"\ea38"}
.ti-book:before{content:"\ea39"}
.ti-books:before{content:"\eff2"}
.ti-brain:before{content:"\f59f"}
.ti-brand-linkedin:before{content:"\ec8c"}
.ti-briefcase:before{content:"\ea46"}
.ti-broadcast:before{content:"\f1e9"}
.ti-building-community:before{content:"\ebf6"}
.ti-building-skyscraper:before{content:"\ec39"}
.ti-building-store:before{content:"\ea4e"}
.ti-bulb:before{content:"\ea51"}
.ti-businessplan:before{content:"\ee1e"}
.ti-calculator-off:before{content:"\f0c4"}
.ti-calendar-x:before{content:"\f832"}
.ti-chart-bar:before{content:"\ea59"}
.ti-chart-bar-off:before{content:"\f3d2"}
.ti-chart-dots:before{content:"\ee2f"}
.ti-chart-histogram:before{content:"\f65c"}
.ti-check:before{content:"\ea5e"}
.ti-checklist:before{content:"\f074"}
.ti-checkup-list:before{content:"\ef5a"}
.ti-chevron-down:before{content:"\ea5f"}
.ti-chevron-up:before{content:"\ea62"}
.ti-circle:before{content:"\ea6b"}
.ti-clipboard-off:before{content:"\f0ce"}
.ti-clock:before{content:"\ea70"}
.ti-clock-exclamation:before{content:"\f847"}
.ti-clock-hour-4:before{content:"\f319"}
.ti-clock-hour-8:before{content:"\f31d"}
.ti-clock-pause:before{content:"\f548"}
.ti-code:before{content:"\ea77"}
.ti-compass-off:before{content:"\f0d5"}
.ti-copy:before{content:"\ea7a"}
.ti-dashboard:before{content:"\ea87"}
.ti-database:before{content:"\ea88"}
.ti-database-off:before{content:"\ee70"}
.ti-database-search:before{content:"\fa18"}
.ti-device-mobile:before{content:"\ea8a"}
.ti-device-mobile-code:before{content:"\f8b0"}
.ti-diamond:before{content:"\eb65"}
.ti-engine-off:before{content:"\f120"}
.ti-eye:before{content:"\ea9a"}
.ti-eye-off:before{content:"\ecf0"}
.ti-eye-search:before{content:"\fb78"}
.ti-file-analytics:before{content:"\ede7"}
.ti-file-export:before{content:"\ede9"}
.ti-file-invoice:before{content:"\eb67"}
.ti-file-spreadsheet:before{content:"\f03e"}
.ti-file-stack:before{content:"\f503"}
.ti-file-text:before{content:"\eaa2"}
.ti-file-unknown:before{content:"\f042"}
.ti-file-x:before{content:"\eaa3"}
.ti-flask:before{content:"\ebd2"}
.ti-folders:before{content:"\eaae"}
.ti-folders-off:before{content:"\f133"}
.ti-gas-station:before{content:"\ec7d"}
.ti-git-compare:before{content:"\eab4"}
.ti-hand-stop:before{content:"\ec2e"}
.ti-headset:before{content:"\eb90"}
.ti-history:before{content:"\ebea"}
.ti-language:before{content:"\ebbe"}
.ti-layout-dashboard:before{content:"\f02c"}
.ti-layout-grid:before{content:"\edba"}
.ti-list-check:before{content:"\eb6a"}
.ti-lock:before{content:"\eae2"}
.ti-lock-open:before{content:"\eae1"}
.ti-mail:before{content:"\eae5"}
.ti-mail-off:before{content:"\f15a"}
.ti-map-2:before{content:"\eae7"}
.ti-map-pin:before{content:"\eae8"}
.ti-map-pin-filled:before{content:"\f680"}
.ti-map-pin-off:before{content:"\ecf3"}
.ti-message:before{content:"\eaef"}
.ti-message-chatbot:before{content:"\f38a"}
.ti-message-code:before{content:"\f013"}
.ti-message-off:before{content:"\ed41"}
.ti-microphone:before{content:"\eaf0"}
.ti-mood-empty:before{content:"\eeb5"}
.ti-mood-nervous:before{content:"\ef96"}
.ti-mood-sad:before{content:"\eaf6"}
.ti-notes:before{content:"\eb6e"}
.ti-palette:before{content:"\eb01"}
.ti-phone:before{content:"\eb09"}
.ti-photo:before{content:"\eb0a"}
.ti-plane-departure:before{content:"\eb9a"}
.ti-plug:before{content:"\ebd9"}
.ti-plug-connected:before{content:"\f00a"}
.ti-presentation:before{content:"\eb70"}
.ti-puzzle:before{content:"\eb10"}
.ti-puzzle-off:before{content:"\f186"}
.ti-receipt:before{content:"\edfd"}
.ti-receipt-off:before{content:"\edfb"}
.ti-refresh:before{content:"\eb13"}
.ti-refresh-off:before{content:"\f18d"}
.ti-report:before{content:"\eece"}
.ti-robot:before{content:"\f00b"}
.ti-rotate-2:before{content:"\ebb4"}
.ti-route:before{content:"\eb17"}
.ti-route-off:before{content:"\f194"}
.ti-ruler-2:before{content:"\eed2"}
.ti-scale:before{content:"\ebc2"}
.ti-scan:before{content:"\ebc8"}
.ti-school:before{content:"\ecf7"}
.ti-search:before{content:"\eb1c"}
.ti-settings:before{content:"\eb20"}
.ti-settings-automation:before{content:"\eed6"}
.ti-shield-check:before{content:"\eb22"}
.ti-shield-lock:before{content:"\ed58"}
.ti-shield-off:before{content:"\ecf8"}
.ti-sparkles:before{content:"\f6d7"}
.ti-stack-2:before{content:"\eef7"}
.ti-stairs-up:before{content:"\eca5"}
.ti-tags:before{content:"\ef86"}
.ti-target-arrow:before{content:"\f51a"}
.ti-template:before{content:"\eb39"}
.ti-transform:before{content:"\f38e"}
.ti-trash:before{content:"\eb41"}
.ti-user-check:before{content:"\eb49"}
.ti-user-minus:before{content:"\eb4a"}
.ti-user-x:before{content:"\eb4c"}
.ti-users:before{content:"\ebf2"}
.ti-users-group:before{content:"\fa21"}
.ti-vector:before{content:"\eca9"}
.ti-volume:before{content:"\eb51"}
.ti-wall:before{content:"\ef7a"}
.ti-wifi-off:before{content:"\ecfa"}

/* assets/motion.css */
/* =============================================================
   Motion and the code-native visuals (Phase C). The only file with
   keyframes, scroll timelines and 3D transforms (see CLAUDE.md).

   Every piece renders its final state in the static HTML. The start
   states below apply only under html.wy-motion, which the head script
   in Layout.astro sets when motion is allowed and drops again if
   motion.js never arrives. Reduced motion = the final state, still.

     .wy-flow    FlowDiagram: a process drawn as a line with stations
     .wy-panel   ProductPanel: what a system does, recreated in HTML
     .wy-story   ScrollStory: phases x lanes, pinned on desktop
     .wy-arch    ArchStack: the L1/L2/L3 layers in 3D
     .wy-ink     ScrollStatement: one sentence inked by scroll
     .wy-mini    the small visuals in the service rows
   ============================================================= */

:root {
  --wy-m-step: 380ms;              /* the pace of a build-in */
  --wy-m-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---------- indigo band (hero and proof sections) ---------- */
.wy-band { background: var(--wy-color-indigo); color: var(--wy-color-off-white); border-radius: 4px; }
.wy-band { --wy-text: var(--wy-color-off-white); --wy-text-muted: var(--wy-color-lavender-100); --wy-line: rgba(225, 210, 255, 0.28); --wy-line-strong: rgba(225, 210, 255, 0.5); }

/* =============================================================
   FlowDiagram
   ============================================================= */
.wy-flow { margin: 0; --gap: 24px; --line: var(--wy-line, var(--wy-border-strong)); --ink: var(--wy-text); }
.wy-flow-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 0 var(--gap); }
.wy-flow-node { position: relative; padding-top: 28px; min-width: 0; overflow-wrap: break-word; }
.wy-flow-port { position: absolute; top: 0; left: 0; width: 11px; height: 11px; border-radius: 50%; border: 1px solid var(--ink); background: var(--wy-color-indigo); z-index: 1; }
.wy-flow--light .wy-flow-port { background: var(--wy-bg); }
.wy-flow-node.is-ai .wy-flow-port { background: var(--wy-color-lime); border-color: var(--wy-color-lime); }
.wy-flow--light .wy-flow-node.is-ai .wy-flow-port { background: var(--wy-color-violet-700); border-color: var(--wy-color-violet-700); }
.wy-flow-rail { position: absolute; top: 5px; left: 11px; width: calc(100% + var(--gap) - 11px); height: 1px; background: var(--line); clip-path: inset(-4px 0); transform-origin: 0 50%; }
.wy-flow-node:last-child .wy-flow-rail { display: none; }
.wy-flow-rail i { position: absolute; inset: 0; transform: translateX(-100%); }
.wy-flow-rail i::after { content: ""; position: absolute; right: 0; top: -2px; width: 5px; height: 5px; border-radius: 50%; background: var(--ink); }
.wy-flow-idx { display: block; font-family: var(--wy-font-mono); font-size: 12px; line-height: 1; color: var(--wy-text-muted); margin-bottom: 10px; }
.wy-flow-node h3 { font-size: 17px; line-height: 1.3; font-weight: 500; letter-spacing: -0.01em; margin: 0 0 6px; color: var(--ink); }
.wy-flow-node p { font-size: 14px; line-height: 1.5; color: var(--wy-text-muted); margin: 0; }
.wy-flow-tag { display: inline-block; font-family: var(--wy-font-mono); font-size: 11px; line-height: 1; padding: 2px 5px; margin-left: 8px; vertical-align: 2px; border-radius: 4px; color: var(--wy-color-lavender-100); border: 1px solid var(--wy-color-lavender-300); }
.wy-flow--light .wy-flow-tag { color: var(--wy-color-violet-700); border-color: var(--wy-color-violet-700); }
.wy-flow-names { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 8px 0 0; padding: 0; list-style: none; font-family: var(--wy-font-mono); font-size: 12px; line-height: 1.5; color: var(--wy-text-muted); }
.wy-flow > figcaption { font-size: 13px; line-height: 1.45; color: var(--wy-text-muted); margin-top: 28px; }

/* build-in: rails draw, stations light up one after the other */
.wy-motion .wy-flow:not(.is-run) .wy-flow-node { opacity: 0.32; }
.wy-motion .wy-flow:not(.is-run) .wy-flow-rail { transform: scaleX(0); }
.wy-motion .wy-flow .wy-flow-node { transition: opacity var(--wy-m-step) var(--wy-m-ease) calc(var(--i) * 260ms); }
.wy-motion .wy-flow .wy-flow-rail { transition: transform 520ms var(--wy-m-ease) calc(var(--i) * 260ms + 140ms); }
/* the live loop: one packet per rail, only while the diagram is on screen */
.wy-motion .wy-flow.is-run .wy-flow-rail i { animation: wy-flow-x 2.6s cubic-bezier(0.6, 0, 0.4, 1) calc(var(--i) * 0.65s + 1.4s) infinite; animation-play-state: paused; }
.wy-motion .wy-flow.is-run.is-in .wy-flow-rail i { animation-play-state: running; }
@keyframes wy-flow-x { 0% { transform: translateX(-100%); } 55%, 100% { transform: translateX(100%); } }

@media (max-width: 760px) {
  .wy-flow-steps { grid-template-columns: minmax(0, 1fr); gap: var(--gap) 0; }
  .wy-flow-node { padding: 0 0 0 32px; }
  .wy-flow-rail { top: 11px; left: 5px; width: 1px; height: calc(100% + var(--gap) - 11px); clip-path: inset(0 -4px); transform-origin: 50% 0; }
  .wy-flow-rail i { transform: translateY(-100%); }
  .wy-flow-rail i::after { top: auto; bottom: 0; right: -2px; }
  .wy-motion .wy-flow:not(.is-run) .wy-flow-rail { transform: scaleY(0); }
  .wy-motion .wy-flow.is-run .wy-flow-rail i { animation-name: wy-flow-y; }
}
@keyframes wy-flow-y { 0% { transform: translateY(-100%); } 55%, 100% { transform: translateY(100%); } }

/* =============================================================
   ProductPanel
   ============================================================= */
.wy-panel { margin: 0; overflow-wrap: break-word; }
.wy-panel-win { background: #fff; color: var(--wy-color-indigo); border: 1px solid var(--wy-neutral-300); border-radius: 4px; overflow: hidden; font-size: 14px; line-height: 1.5; }
.wy-panel-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--wy-neutral-200); font-family: var(--wy-font-mono); font-size: 12px; color: var(--wy-neutral-500); }
.wy-panel-bar b { font-weight: 400; color: var(--wy-color-indigo); }
.wy-panel-live { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.wy-panel-live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--wy-color-violet-700); }
.wy-panel-body { padding: 20px 16px 18px; display: grid; gap: 14px; }
.wy-panel > figcaption { font-size: 13px; line-height: 1.45; color: var(--wy-text-muted); margin-top: 14px; }
.wy-panel-k { font-family: var(--wy-font-mono); font-size: 11px; line-height: 1.4; letter-spacing: 0.02em; color: var(--wy-neutral-500); margin: 0 0 4px; }

/* answer */
.wy-panel-q { justify-self: end; max-width: 85%; margin: 0; padding: 10px 14px; border-radius: 4px; background: var(--wy-color-indigo); color: var(--wy-color-off-white); }
.wy-panel-a { margin: 0; font-size: 15px; line-height: 1.55; }
.wy-panel-src { list-style: none; margin: 0; padding: 10px 0 0; border-top: 1px solid var(--wy-neutral-200); display: grid; gap: 4px; font-family: var(--wy-font-mono); font-size: 12px; color: var(--wy-neutral-500); counter-reset: src; }
.wy-panel-src li { counter-increment: src; overflow-wrap: break-word; }
.wy-panel-src li::before { content: "[" counter(src) "] "; color: var(--wy-color-violet-700); }

/* extract */
.wy-panel-doc { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; align-items: start; }
.wy-panel-page { position: relative; aspect-ratio: 3 / 4; border: 1px solid var(--wy-neutral-300); border-radius: 4px; padding: 10px 9px; display: grid; align-content: start; gap: 6px; overflow: hidden; background: var(--wy-neutral-50); }
.wy-panel-page span { display: block; height: 4px; border-radius: 2px; background: var(--wy-neutral-200); }
.wy-panel-page span:nth-child(3n) { width: 70%; }
.wy-panel-page span:nth-child(4n+1) { width: 86%; }
.wy-panel-page span.is-hit { background: var(--wy-color-purple); }
.wy-panel-scan { position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--wy-color-violet-700); opacity: 0; }
.wy-panel-fields { margin: 0; display: grid; gap: 0; }
.wy-panel-fields > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 8px 0; border-top: 1px solid var(--wy-neutral-200); }
.wy-panel-fields dt { font-size: 12px; color: var(--wy-neutral-500); grid-column: 1 / -1; }
.wy-panel-fields dd { margin: 0; font-weight: 500; overflow-wrap: break-word; }
.wy-panel-fields .wy-panel-conf { font-family: var(--wy-font-mono); font-size: 12px; font-weight: 400; color: var(--wy-color-violet-700); align-self: end; }

/* approve */
.wy-panel-queue { list-style: none; margin: 0; padding: 0; }
.wy-panel-queue li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--wy-neutral-200); }
.wy-panel-queue li:first-child { border-top: 0; }
.wy-panel-queue .t { font-weight: 500; overflow-wrap: break-word; }
.wy-panel-queue .m { font-size: 12px; color: var(--wy-neutral-500); grid-column: 1; }
.wy-panel-state { grid-column: 2; grid-row: 1 / span 2; position: relative; font-family: var(--wy-font-mono); font-size: 12px; white-space: nowrap; }
.wy-panel-state > span { display: inline-block; padding: 3px 8px; border-radius: 9999px; border: 1px solid var(--wy-neutral-300); color: var(--wy-neutral-500); }
.wy-panel-state > .is-done { border-color: var(--wy-color-violet-700); background: var(--wy-color-violet-700); color: #fff; }
.wy-panel-state > .is-wait { position: absolute; right: 0; top: 0; opacity: 0; }
.wy-panel-who { margin: 0; padding-top: 10px; border-top: 1px solid var(--wy-neutral-200); font-size: 12px; color: var(--wy-neutral-500); }

/* panel motion: rows arrive, the answer streams, fields fill, a status flips */
.wy-motion .wy-panel [data-seq] { transition: opacity 320ms var(--wy-m-ease), transform 320ms var(--wy-m-ease); }
.wy-motion .wy-panel:not(.is-run) [data-seq] { opacity: 0; transform: translateY(6px); }
.wy-motion .wy-panel .wy-panel-a .w { transition: opacity 160ms linear; }
.wy-motion .wy-panel.is-streaming .wy-panel-a .w:not(.on) { opacity: 0; }
.wy-motion .wy-panel.is-scanning .wy-panel-scan { opacity: 1; animation: wy-scan 1.6s cubic-bezier(0.5, 0, 0.5, 1) 1; }
@keyframes wy-scan { from { transform: translateY(0); } to { transform: translateY(150px); } }
.wy-motion .wy-panel.is-pending .wy-panel-state > .is-done { opacity: 0; }
.wy-motion .wy-panel.is-pending .wy-panel-state > .is-wait { opacity: 1; }
.wy-motion .wy-panel .wy-panel-state > span { transition: opacity 240ms linear; }
.wy-panel.is-reset [data-seq], .wy-panel.is-reset .w, .wy-panel.is-reset .wy-panel-state > span { transition: none !important; }

/* =============================================================
   ScrollStory: steps on the left, the board pinned on the right
   ============================================================= */
.wy-story { overflow-wrap: break-word; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 0 56px; align-items: start; }
.wy-story-steps { list-style: none; margin: 0; padding: 0; }
.wy-story-step { padding: 32px 0 30vh; border-top: 1px solid var(--wy-border-strong); }
.wy-story-step:last-child { padding-bottom: 32px; }
.wy-story-idx { display: block; font-family: var(--wy-font-mono); font-size: 13px; color: var(--wy-color-violet-700); margin-bottom: 10px; }
.wy-story-step h3 { font-size: clamp(24px, 2.4vw, 30px); line-height: 1.15; letter-spacing: -0.02em; font-weight: 500; margin: 0 0 8px; }
.wy-story-when { font-family: var(--wy-font-mono); font-size: 13px; color: var(--wy-text-muted); margin: 0 0 14px; }
.wy-story-step > p { font-size: 17px; line-height: 1.55; color: var(--wy-text); margin: 0; max-width: 44ch; }
.wy-story-step h3, .wy-story-idx { transition: color 240ms linear; }

.wy-story-board { position: sticky; top: 112px; display: grid; grid-template-columns: 112px repeat(var(--n, 4), minmax(0, 1fr)); border-top: 1px solid var(--wy-border-strong); font-size: 13px; line-height: 1.45; }
.wy-story-board > * { padding: 12px 12px 14px; border-bottom: 1px solid var(--wy-border-strong); transition: background-color 240ms linear, color 240ms linear, opacity 240ms linear; }
.wy-story-board > .h { font-weight: 500; font-size: 14px; }
.wy-story-board > .h b { display: block; font-family: var(--wy-font-mono); font-weight: 400; font-size: 12px; color: var(--wy-color-violet-700); }
.wy-story-board > .lane { font-weight: 500; padding-left: 0; }
.wy-story-board > .c { color: var(--wy-text); }

/* mini board per step: the mobile layout, and what screen readers get */
.wy-story-mini { margin: 20px 0 0; display: grid; gap: 0; }
.wy-story-mini > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-top: 1px solid var(--wy-border); font-size: 15px; line-height: 1.45; }
.wy-story-mini dt { color: var(--wy-text-muted); font-size: 13px; padding-top: 2px; }
.wy-story-mini dd { margin: 0; }
@media (min-width: 961px) {
  .wy-story-mini { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (max-width: 960px) {
  .wy-story { grid-template-columns: minmax(0, 1fr); }
  .wy-story-board { display: none; }
  .wy-story-step { padding-bottom: 32px; }
}
/* the active phase: its column gets a white ground and an indigo rule on top;
   nothing is dimmed, every cell stays at full contrast */
.wy-story-board > .h { box-shadow: inset 0 2px 0 transparent; }
.wy-story[data-active="0"] .wy-story-board > [data-col="0"],
.wy-story[data-active="1"] .wy-story-board > [data-col="1"],
.wy-story[data-active="2"] .wy-story-board > [data-col="2"],
.wy-story[data-active="3"] .wy-story-board > [data-col="3"],
.wy-story[data-active="4"] .wy-story-board > [data-col="4"]
{ background: var(--wy-bg-elevated); }
.wy-story[data-active="0"] .wy-story-board > .h[data-col="0"],
.wy-story[data-active="1"] .wy-story-board > .h[data-col="1"],
.wy-story[data-active="2"] .wy-story-board > .h[data-col="2"],
.wy-story[data-active="3"] .wy-story-board > .h[data-col="3"],
.wy-story[data-active="4"] .wy-story-board > .h[data-col="4"]
{ box-shadow: inset 0 2px 0 var(--wy-color-indigo); }
.wy-story-idx { color: var(--wy-text-muted); }
.wy-story-step.is-active .wy-story-idx, .wy-story:not([data-active]) .wy-story-idx { color: var(--wy-color-violet-700); }
.wy-story-board .lane, .wy-story-board .h { display: block; }
.wy-story-board .wy-icon, .wy-story-mini dt .wy-icon { display: block; margin-bottom: 6px; color: var(--wy-color-violet-700); }
.wy-story-step h3 .wy-icon { vertical-align: -2px; margin-right: 10px; color: var(--wy-color-violet-700); }

/* =============================================================
   ArchStack: three layers in 3D, the list beside them is the text
   ============================================================= */
.wy-arch { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 64px; align-items: center; }
.wy-arch-stage { position: relative; height: 440px; perspective: 1600px; perspective-origin: 50% 30%; }
.wy-arch-planes { position: absolute; left: 50%; top: 56%; width: 300px; height: 300px; margin: -150px 0 0 -150px; transform-style: preserve-3d; transform: rotateX(58deg) rotateZ(-40deg); }
.wy-arch-plane { position: absolute; inset: 0; border: 1px solid var(--wy-line-strong, var(--wy-border-strong)); border-radius: 4px; background: #1A0A3D; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: center; gap: 10px; padding: 26px; transform: translateZ(calc(var(--l) * 96px)); transition: transform 900ms var(--wy-m-ease) calc(var(--l) * 120ms), border-color 200ms linear, background-color 200ms linear; }
.wy-arch-plane.is-ours { background: var(--wy-color-violet-700); border-color: var(--wy-color-lavender-300); }
.wy-arch-plane span { display: block; font-family: var(--wy-font-mono); font-size: 13px; line-height: 1; padding: 9px 8px; border: 1px solid var(--wy-line, var(--wy-border)); border-radius: 4px; color: var(--wy-color-lavender-100); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wy-arch-plane.is-ours span { color: #fff; border-color: rgba(255, 255, 255, 0.4); }
.wy-arch-plane b { position: absolute; left: 14px; top: 10px; font-family: var(--wy-font-mono); font-weight: 400; font-size: 12px; color: var(--wy-color-lavender-300); }
.wy-arch-plane.is-ours b { color: var(--wy-color-lime); }
.wy-motion .wy-arch:not(.is-run) .wy-arch-plane { transform: translateZ(calc(var(--l) * 14px)); }

.wy-arch-list { list-style: none; margin: 0; padding: 0; }
.wy-arch-list > li { overflow-wrap: break-word; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 12px; padding: 20px 0; border-top: 1px solid var(--wy-line-strong, var(--wy-border-strong)); outline: none; }
.wy-arch-list > li:last-child { border-bottom: 1px solid var(--wy-line-strong, var(--wy-border-strong)); }
.wy-arch-list .code { font-family: var(--wy-font-mono); font-size: 13px; line-height: 1.7; color: var(--wy-color-lavender-300); }
.wy-arch-list h3 { font-size: 20px; line-height: 1.3; font-weight: 500; margin: 0 0 6px; color: var(--wy-text); transition: color 200ms linear; }
.wy-arch-list p { font-size: 15px; line-height: 1.55; color: var(--wy-text-muted); margin: 0; }
.wy-arch-list .is-ours .code { color: var(--wy-color-lime); }
.wy-arch-list p.tag { font-size: 13px; color: var(--wy-color-lime); margin: 0 0 4px; }
.wy-arch-list > li:focus-visible { outline: 2px solid var(--wy-color-lavender-100); outline-offset: 4px; }
/* pointing at a layer (or focusing it) picks out its plane */
.wy-arch:has(.wy-arch-list > li[data-l="0"]:is(:hover, :focus-visible)) .wy-arch-plane[data-l="0"],
.wy-arch:has(.wy-arch-list > li[data-l="1"]:is(:hover, :focus-visible)) .wy-arch-plane[data-l="1"],
.wy-arch:has(.wy-arch-list > li[data-l="2"]:is(:hover, :focus-visible)) .wy-arch-plane[data-l="2"] { border-color: var(--wy-color-off-white); }
.wy-arch-list > li:is(:hover, :focus-visible) h3 { color: var(--wy-color-lavender-100); }
.wy-arch-rail { grid-column: 1 / -1; list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 32px; font-size: 14px; color: var(--wy-text-muted); }
.wy-arch-rail li { display: flex; gap: 10px; align-items: baseline; }
.wy-arch-rail li::before { content: ""; width: 6px; height: 6px; border: 1px solid currentColor; border-radius: 50%; flex: none; transform: translateY(-1px); }
@media (max-width: 960px) {
  .wy-arch { grid-template-columns: minmax(0, 1fr); }
  .wy-arch-stage { height: 300px; }
  .wy-arch-planes { width: 200px; height: 200px; margin: -100px 0 0 -100px; top: 64%; }
  .wy-arch-plane { padding: 18px; gap: 6px; transform: translateZ(calc(var(--l) * 64px)); transition: none; }
  .wy-arch-plane span { font-size: 11px; padding: 6px 4px; }
  .wy-motion .wy-arch:not(.is-run) .wy-arch-plane { transform: translateZ(calc(var(--l) * 64px)); }
}

/* =============================================================
   ScrollStatement
   ============================================================= */
.wy-ink { font-size: clamp(30px, 4.2vw, 56px); line-height: 1.12; letter-spacing: -0.03em; font-weight: 500; max-width: 24ch; margin: 0; color: var(--wy-text); }
.wy-ink .w { transition: opacity 200ms linear; }
.wy-motion .wy-ink.is-split .w:not(.on) { opacity: 0.22; }

/* =============================================================
   The small visuals in the service rows (always visible; they move
   when the row is pointed at, focused, or on a touch screen in view)
   ============================================================= */
.wy-mini { position: relative; height: 112px; border: 1px solid var(--wy-border-strong); border-radius: 4px; background: var(--wy-bg-elevated); overflow: hidden; }
/* flow: four stations on a line, a packet runs it */
.wy-mini--flow::before { content: ""; position: absolute; left: 16%; right: 16%; top: 50%; height: 1px; background: var(--wy-color-indigo); opacity: 0.35; }
.wy-mini--flow i { position: absolute; top: 50%; width: 11px; height: 11px; margin: -5px 0 0 -5px; border-radius: 50%; border: 1px solid var(--wy-color-indigo); background: var(--wy-bg-elevated); }
.wy-mini--flow i:nth-of-type(1) { left: 16%; } .wy-mini--flow i:nth-of-type(2) { left: 38.6%; } .wy-mini--flow i:nth-of-type(3) { left: 61.3%; background: var(--wy-color-violet-700); border-color: var(--wy-color-violet-700); } .wy-mini--flow i:nth-of-type(4) { left: 84%; }
.wy-mini--flow b { position: absolute; left: 16%; right: 16%; top: 50%; height: 1px; overflow: hidden; z-index: 1; }
.wy-mini--flow b::after { content: ""; position: absolute; left: 0; top: 0; width: 28%; height: 1px; background: var(--wy-color-violet-700); transform: translateX(-100%); }
/* stack: three layers, the middle one is ours */
.wy-mini--stack { perspective: 600px; }
.wy-mini--stack span { position: absolute; left: 50%; top: 50%; width: 92px; height: 92px; margin: -46px 0 0 -46px; border: 1px solid var(--wy-color-indigo); border-radius: 4px; background: var(--wy-bg-elevated); transform: rotateX(58deg) rotateZ(-40deg) translateZ(calc((var(--l) - 1) * 20px)); transition: transform 600ms var(--wy-m-ease); }
.wy-mini--stack span:nth-child(2) { background: var(--wy-color-violet-700); border-color: var(--wy-color-violet-700); }
/* weeks: a timeline that fills week by week */
.wy-mini--weeks { display: grid; grid-template-columns: repeat(var(--n, 10), minmax(0, 1fr)); gap: 4px; align-content: center; padding: 0 16%; }
.wy-mini--weeks i { height: 18px; border: 1px solid var(--wy-color-indigo); border-radius: 2px; transform-origin: 0 50%; }
.wy-mini--weeks i:nth-child(-n+2) { background: var(--wy-color-indigo); }
.wy-mini--weeks i:nth-last-child(1) { background: var(--wy-color-violet-700); border-color: var(--wy-color-violet-700); }
.wy-mini--weeks i { transition: background-color 120ms linear calc(var(--i) * 70ms); }

/* team: three of ours (filled) beside three of the client's (outline); in motion
   the client's fill one by one: the knowledge handed over */
.wy-mini--team { display: flex; align-items: center; justify-content: center; gap: 14px; }
.wy-mini--team i { width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--wy-color-indigo); background: transparent; transition: background-color 240ms linear calc((var(--i) - 3) * 260ms); }
.wy-mini--team i:nth-child(-n+3) { background: var(--wy-color-indigo); }
.wy-mini--team i:nth-child(3) { margin-right: 18px; }
.wy-motion .is-live .wy-mini--team i:nth-child(n+4) { background: var(--wy-color-violet-700); border-color: var(--wy-color-violet-700); }

.wy-motion .is-live .wy-mini--flow b::after { animation: wy-mini-run 1.8s cubic-bezier(0.6, 0, 0.4, 1) infinite; }
@keyframes wy-mini-run { from { transform: translateX(-100%); } to { transform: translateX(360%); } }
.wy-motion .is-live .wy-mini--stack span { transform: rotateX(58deg) rotateZ(-40deg) translateZ(calc((var(--l) - 1) * 34px)); }
.wy-motion .is-live .wy-mini--weeks i { background: var(--wy-color-indigo); }
.wy-motion .is-live .wy-mini--weeks i:nth-last-child(1) { background: var(--wy-color-violet-700); }

/* =============================================================
   Page-to-page: a cross-fade, and the case image travels from the
   card into the case page. CSS only; old browsers just navigate.
   ============================================================= */
/* =============================================================
   LogoMarquee: the client logos on a slow loop. Pauses on hover and
   focus; without motion (or JS) it is a static, wrapped row.
   ============================================================= */
.wy-logos { overflow: hidden; }
.wy-logos ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 24px 64px; align-items: center; }
.wy-logos li { flex: none; height: 56px; display: flex; align-items: center; }
.wy-logos img { display: block; filter: brightness(0); opacity: 0.72; transition: filter 160ms linear, opacity 160ms linear; }
.wy-logos li:hover img { filter: none; opacity: 1; }
.wy-logos .is-copy, .wy-logos .is-fill { display: none; }
.wy-motion .wy-logos .wy-logos-track { display: flex; width: max-content; animation: wy-marquee 48s linear infinite; }
.wy-motion .wy-logos ul { flex-wrap: nowrap; padding-right: 64px; }
.wy-motion .wy-logos .is-copy { display: flex; }
.wy-motion .wy-logos .is-fill { display: flex; }
/* in motion the loop runs edge to edge, across the whole screen */
.wy-motion .wy-logos { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.wy-motion .wy-logos:hover .wy-logos-track, .wy-motion .wy-logos:focus-within .wy-logos-track { animation-play-state: paused; }
@keyframes wy-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

@view-transition { navigation: auto; }
::view-transition-group(*) { animation-duration: 360ms; animation-timing-function: var(--wy-m-ease); }
.wy-vt { view-transition-name: var(--vt); }
.wy-header { view-transition-name: wy-header; }

/* =============================================================
   Reduced motion: everything in its final state, nothing moves
   ============================================================= */
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  .wy-flow-rail i, .wy-mini *, .wy-logos-track { animation: none !important; }
}

/* German compounds may hyphenate; Portuguese never splits a word */
:lang(de) .wy-flow-node, :lang(de) .wy-story, :lang(de) .wy-panel, :lang(de) .wy-arch-list { hyphens: auto; }

/* assets/site.css */
/* =============================================================
   Shared page building blocks (light pages). Left-aligned on one
   1240px grid; lists and facts are text with 1px rules, not cards.
   Case pages have their own layer in assets/case.css.
   ============================================================= */

.wy-wrap { max-width: 1240px; margin: 0 auto; }
.wy-sec { padding: 104px var(--wy-gutter); }
.wy-sec--muted { background: var(--wy-bg-muted); }
.wy-sec--flush { padding-top: 0; }

/* hero */
.wy-hero { padding: 104px var(--wy-gutter) 72px; }
.wy-hero-cta { margin-top: 32px; }
.wy-h1 { font-size: clamp(44px, 5.4vw, 72px); line-height: 1.04; letter-spacing: -0.03em; font-weight: 500; margin: 0 0 24px; color: var(--wy-text); max-width: 18ch; }
.wy-lead { font-size: 20px; line-height: 1.5; color: var(--wy-text-muted); max-width: 52ch; margin: 0; }

/* section heading + intro */
.wy-h2 { font-size: clamp(30px, 3.4vw, 44px); line-height: 1.1; letter-spacing: -0.025em; font-weight: 500; margin: 0 0 20px; max-width: 24ch; color: var(--wy-text); }
.wy-intro { font-size: 18px; line-height: 1.6; color: var(--wy-text-muted); max-width: 62ch; margin: 0 0 48px; }
.wy-h2 + .wy-list, .wy-h2 + .wy-rows, .wy-h2 + .wy-svc, .wy-h2 + .wy-ind, .wy-h2 + .wy-matrix, .wy-h2 + .wy-story { margin-top: 40px; }

/* ruled list in columns */
.wy-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 40px; }
.wy-list--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wy-list > li { border-top: 1px solid var(--wy-border-strong); padding: 20px 0 28px; }
.wy-list h3 { font-size: 20px; line-height: 1.3; font-weight: 500; letter-spacing: -0.01em; margin: 0 0 8px; }
.wy-list p { font-size: 15px; line-height: 1.55; color: var(--wy-text-muted); margin: 0 0 12px; }
.wy-list p:last-child { margin-bottom: 0; }

/* title | text rows */
.wy-rows { list-style: none; margin: 0; padding: 0; }
.wy-rows > li { display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: 8px 48px; padding: 22px 0; border-top: 1px solid var(--wy-border-strong); }
.wy-rows > li:last-child { border-bottom: 1px solid var(--wy-border-strong); }
.wy-rows h3 { font-size: 20px; line-height: 1.3; font-weight: 500; letter-spacing: -0.01em; margin: 0; }
.wy-rows p { font-size: 17px; line-height: 1.55; color: var(--wy-text); margin: 0; max-width: 62ch; }
.wy-rows strong { font-weight: 500; }

/* links */
.wy-more, .wy-list h3 a, .wy-rows h3 a { color: inherit; }
.wy-more { font-size: 15px; font-weight: 500; color: var(--wy-color-violet-700); text-decoration: underline; text-underline-offset: 3px; }
.wy-list h3 a:hover, .wy-rows h3 a:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.wy-inline-links a { color: var(--wy-color-violet-700); text-decoration: underline; text-underline-offset: 3px; }
.wy-more:focus-visible, .wy-list a:focus-visible, .wy-rows a:focus-visible, .wy-inline-links a:focus-visible { outline: 2px solid var(--wy-color-violet-700); outline-offset: 3px; border-radius: 3px; }

/* a large statement line */
.wy-statement { font-size: clamp(24px, 3vw, 34px); line-height: 1.3; letter-spacing: -0.02em; font-weight: 500; max-width: 30ch; margin: 0 0 28px; color: var(--wy-text); }

@media (max-width: 960px) {
  .wy-list { grid-template-columns: minmax(0, 1fr); }
  .wy-rows > li { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .wy-hero { padding: 64px var(--wy-gutter) 48px; }
  .wy-sec { padding: 72px var(--wy-gutter); }
  .wy-sec--flush { padding-top: 0; }
  .wy-lead { font-size: 18px; }
  .wy-rows p { font-size: 16px; }
}

/* list variants */
.wy-list--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.wy-list .wy-item { font-size: 18px; line-height: 1.45; color: var(--wy-text); margin: 0; }
.wy-num { display: block; font-family: var(--wy-font-mono); font-size: 13px; color: var(--wy-color-violet-700); margin-bottom: 10px; }
@media (max-width: 960px) { .wy-list--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .wy-list--4 { grid-template-columns: minmax(0, 1fr); } }

/* featured case: a light panel (the indigo band is the CTA), real numbers, the real mockup */
.wy-feature { max-width: 1240px; margin: 0 auto; background: var(--wy-bg-muted); color: var(--wy-text); border-radius: 4px; padding: clamp(36px, 5vw, 64px); display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.wy-feature-client { font-size: 14px; color: var(--wy-text-muted); margin: 0 0 12px; }
.wy-feature h3 { font-size: clamp(26px, 3vw, 36px); line-height: 1.12; letter-spacing: -0.02em; font-weight: 500; margin: 0 0 14px; color: var(--wy-text); }
.wy-feature-desc { font-size: 17px; line-height: 1.55; color: var(--wy-text-muted); margin: 0 0 28px; max-width: 46ch; }
.wy-feature-stats { display: flex; flex-wrap: wrap; gap: 20px 48px; margin: 0 0 32px; padding: 0; }
.wy-feature-stats dd { font-size: clamp(32px, 3.6vw, 44px); line-height: 1; letter-spacing: -0.03em; font-weight: 500; color: var(--wy-color-indigo); margin: 0 0 8px; }
.wy-feature-stats dt { font-size: 14px; color: var(--wy-text-muted); }
.wy-feature-stats div { display: flex; flex-direction: column-reverse; }
.wy-feature img { display: block; justify-self: end; max-width: 100%; height: auto; border-radius: 4px; }
@media (max-width: 960px) { .wy-feature { grid-template-columns: minmax(0, 1fr); } .wy-feature img { justify-self: start; } }

/* case/project cards: the real mockup, then the facts. Everything visible, no hover reveal. */
.wy-cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.wy-case { display: block; color: var(--wy-text); }
.wy-case img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: top; border-radius: 4px; background: #fff; }
.wy-case-client { font-size: 14px; color: var(--wy-text-muted); margin: 18px 0 6px; }
.wy-case h3 { font-size: 20px; line-height: 1.3; font-weight: 500; margin: 0 0 10px; }
.wy-case-num { font-size: 15px; line-height: 1.45; color: var(--wy-text-muted); margin: 0; }
.wy-case-num strong { font-size: 22px; font-weight: 500; color: var(--wy-color-indigo); letter-spacing: -0.02em; margin-right: 6px; }
.wy-case:hover h3 { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.wy-case:focus-visible { outline: 2px solid var(--wy-color-violet-700); outline-offset: 6px; border-radius: 4px; }
@media (max-width: 960px) { .wy-cases { grid-template-columns: minmax(0, 1fr); } }

/* dense case list: client | what we built | number */
.wy-caselist { list-style: none; margin: 0; padding: 0; }
.wy-caselist a { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr) minmax(0, 260px); gap: 6px 40px; align-items: baseline; padding: 22px 0; border-top: 1px solid var(--wy-border-strong); color: var(--wy-text); }
.wy-caselist li:last-child a { border-bottom: 1px solid var(--wy-border-strong); }
.wy-caselist h3 { font-size: 20px; line-height: 1.3; font-weight: 500; margin: 0; }
.wy-caselist .wy-caselist-sector { display: block; font-size: 14px; font-weight: 400; color: var(--wy-text-muted); margin-top: 2px; }
.wy-caselist p { font-size: 16px; line-height: 1.5; margin: 0; }
.wy-caselist .wy-caselist-num { font-size: 15px; color: var(--wy-text-muted); }
.wy-caselist .wy-caselist-num strong { display: block; font-size: 24px; line-height: 1.1; font-weight: 500; letter-spacing: -0.02em; color: var(--wy-color-indigo); }
.wy-caselist a:hover h3 { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.wy-caselist a:focus-visible { outline: 2px solid var(--wy-color-violet-700); outline-offset: 4px; }
@media (max-width: 960px) { .wy-caselist a { grid-template-columns: minmax(0, 1fr); } }

/* =============================================================
   Phase C blocks (static). The motion for the visuals lives in
   assets/motion.css; these are the parts that never move.
   ============================================================= */

/* indigo hero band: headline + actions on top, the visual below */
.wy-hband { padding: 24px var(--wy-gutter) 0; }
.wy-hband > .wy-band { max-width: 1240px; margin: 0 auto; padding: clamp(40px, 6vw, 80px) clamp(24px, 5vw, 64px) clamp(32px, 4vw, 48px); }
.wy-hband-top { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 32px 64px; align-items: end; margin-bottom: clamp(48px, 6vw, 80px); }
.wy-hband h1 { font-size: clamp(44px, 5.4vw, 72px); line-height: 1.04; letter-spacing: -0.03em; font-weight: 500; margin: 0; color: var(--wy-color-off-white); max-width: 16ch; }
.wy-hband-lead { font-size: 20px; line-height: 1.5; color: var(--wy-color-lavender-100); margin: 0 0 28px; max-width: 40ch; }
.wy-hband-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.wy-hband-foot { margin-top: clamp(40px, 5vw, 64px); }
@media (max-width: 960px) { .wy-hband-top { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { .wy-hband { padding: 8px 8px 0; } .wy-hband-lead { font-size: 18px; } }

/* ProofStrip: figures with client and unit */
.wy-proof-title { font-size: 14px; color: var(--wy-text-muted); margin: 0 0 20px; }
.wy-proof ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 40px; }
.wy-proof li { border-top: 1px solid var(--wy-line, var(--wy-border-strong)); }
.wy-proof a { display: flex; flex-direction: column; gap: 8px; padding: 20px 0 24px; color: var(--wy-text); height: 100%; }
.wy-proof .v { font-size: clamp(32px, 3.4vw, 44px); line-height: 1; letter-spacing: -0.03em; font-weight: 500; white-space: nowrap; }
.wy-proof .l { font-size: 14px; line-height: 1.4; color: var(--wy-text-muted); }
.wy-proof .c { font-size: 14px; font-weight: 500; margin-top: auto; }
@media (max-width: 1100px) and (min-width: 761px) { .wy-proof ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.wy-proof a:hover .c { text-decoration: underline; text-underline-offset: 3px; }
.wy-proof a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; border-radius: 4px; }
@media (max-width: 760px) {
  .wy-proof ul { grid-template-columns: minmax(0, 1fr); }
  .wy-proof a { padding: 16px 0; }
}

/* ServiceRows: the services as large rows */
.wy-svc { list-style: none; margin: 0; padding: 0; }
.wy-svc a { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) 260px; gap: 16px 48px; align-items: center; padding: 32px 0; border-top: 1px solid var(--wy-border-strong); color: var(--wy-text); }
.wy-svc li:last-child a { border-bottom: 1px solid var(--wy-border-strong); }
.wy-svc .n { font-size: clamp(34px, 4.6vw, 60px); line-height: 1; letter-spacing: -0.035em; font-weight: 500; transition: color 160ms linear; }
.wy-svc .t { font-size: 17px; line-height: 1.5; color: var(--wy-text-muted); max-width: 40ch; }
.wy-svc a:hover .n, .wy-svc a:focus-visible .n { color: var(--wy-color-violet-700); }
.wy-svc a:focus-visible { outline: 2px solid var(--wy-color-violet-700); outline-offset: 4px; }
@media (max-width: 960px) {
  .wy-svc a { grid-template-columns: minmax(0, 1fr); padding: 28px 0; }
  .wy-svc .wy-mini { height: 96px; }
}

/* IndustryGrid: all industries, scannable */
.wy-ind { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--wy-border-strong); border-left: 1px solid var(--wy-border-strong); }
.wy-ind li { border-right: 1px solid var(--wy-border-strong); border-bottom: 1px solid var(--wy-border-strong); }
.wy-ind a { display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 20px 20px 22px; color: var(--wy-text); transition: background-color 160ms linear; }
.wy-ind .n { font-size: 18px; line-height: 1.3; font-weight: 500; }
.wy-ind .u { font-size: 14px; line-height: 1.45; color: var(--wy-text-muted); }
.wy-ind .p { font-size: 13px; line-height: 1.4; color: var(--wy-text-muted); margin-top: auto; padding-top: 12px; }
.wy-ind .p strong { font-size: 18px; font-weight: 500; color: var(--wy-color-indigo); letter-spacing: -0.01em; }
.wy-ind a:hover { background: var(--wy-bg-elevated); }
.wy-ind a:hover .n { text-decoration: underline; text-underline-offset: 3px; }
.wy-ind a:focus-visible { outline: 2px solid var(--wy-color-violet-700); outline-offset: -2px; }
@media (max-width: 1100px) { .wy-ind { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .wy-ind { grid-template-columns: repeat(2, minmax(0, 1fr)); } .wy-ind a { padding: 16px 14px 18px; } .wy-ind .n { font-size: 16px; } }

/* two columns: text left, a visual right (stacks on mobile) */
.wy-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 48px 72px; align-items: center; }
@media (max-width: 960px) { .wy-split { grid-template-columns: minmax(0, 1fr); } }

/* a proof section on indigo inside the page grid */
.wy-dsec { padding: 0 var(--wy-gutter); }
.wy-dsec > .wy-band { max-width: 1240px; margin: 0 auto; padding: clamp(48px, 7vw, 96px) clamp(24px, 5vw, 64px); }
.wy-dsec .wy-h2 { color: var(--wy-color-off-white); }
.wy-dsec .wy-intro { color: var(--wy-color-lavender-100); }
@media (max-width: 760px) { .wy-dsec { padding: 0 8px; } }

/* CaseIndex: filters (links that work without JS) above the cases */
.wy-cidx-filters { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px 16px; align-items: baseline; margin-bottom: 48px; }
.wy-cidx-filters ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.wy-cidx-k { font-size: 14px; color: var(--wy-text-muted); margin: 0; }
.wy-cidx-filters a { display: inline-flex; align-items: baseline; gap: 6px; padding: 7px 14px; border: 1px solid var(--wy-border-strong); border-radius: 9999px; font-size: 14px; color: var(--wy-text); transition: background-color 120ms linear, border-color 120ms linear, color 120ms linear; }
.wy-cidx-filters a > span:last-child { font-family: var(--wy-font-mono); font-size: 12px; color: var(--wy-text-muted); }
.wy-cidx-filters a:hover { border-color: var(--wy-color-indigo); }
.wy-cidx-filters a[aria-current="true"] { background: var(--wy-color-indigo); border-color: var(--wy-color-indigo); color: var(--wy-color-off-white); }
.wy-cidx-filters a[aria-current="true"] > span:last-child { color: var(--wy-color-lavender-100); }
.wy-cidx-filters a:focus-visible { outline: 2px solid var(--wy-color-violet-700); outline-offset: 3px; }
.wy-cidx-count { grid-column: 2; font-size: 14px; color: var(--wy-text-muted); margin: 4px 0 0; }
.wy-cidx .wy-cases + .wy-caselist { margin-top: 56px; }
.wy-cidx-none { font-size: 17px; margin: 0; }
@media (max-width: 760px) { .wy-cidx-filters { grid-template-columns: minmax(0, 1fr); } .wy-cidx-count { grid-column: 1; } }
.wy-cidx [hidden] { display: none !important; }

/* ServiceMatrix: compare the services (a table; blocks on mobile) */
.wy-matrix table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 15px; line-height: 1.5; }
.wy-matrix caption { text-align: left; font-size: 14px; color: var(--wy-text-muted); padding-bottom: 16px; }
.wy-matrix th, .wy-matrix td { text-align: left; vertical-align: top; padding: 16px 20px 18px 0; border-top: 1px solid var(--wy-border-strong); }
.wy-matrix tbody tr:last-child > * { border-bottom: 1px solid var(--wy-border-strong); }
.wy-matrix thead td, .wy-matrix thead th { border-top: 0; padding-bottom: 14px; }
.wy-matrix thead th { font-size: 20px; font-weight: 500; letter-spacing: -0.01em; }
.wy-matrix thead th a:hover { color: var(--wy-color-violet-700); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.wy-matrix tbody th { width: 180px; font-size: 14px; font-weight: 500; color: var(--wy-text-muted); }
.wy-matrix td a { color: var(--wy-color-violet-700); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 760px) {
  .wy-matrix table, .wy-matrix tbody, .wy-matrix tr, .wy-matrix td { display: block; width: auto; }
  .wy-matrix thead { display: none; }
  .wy-matrix tbody th { display: block; width: auto; font-size: 17px; color: var(--wy-text); padding: 24px 0 4px; }
  .wy-matrix td { padding: 10px 0; border-top: 1px solid var(--wy-border); }
  .wy-matrix tbody tr:last-child > * { border-bottom: 0; }
  .wy-matrix td::before { content: attr(data-label); display: block; font-size: 13px; color: var(--wy-text-muted); margin-bottom: 2px; }
}
.wy-ind-proof { margin-top: 56px; max-width: 820px; }
.wy-ind-proof .wy-proof ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) { .wy-ind-proof .wy-proof ul { grid-template-columns: minmax(0, 1fr); } }

/* long words in translations (German compounds) wrap instead of overflowing */
.wy-ind a, .wy-proof a, .wy-svc a, .wy-matrix td, .wy-cidx-filters a { overflow-wrap: break-word; }
:lang(de) .wy-ind a, :lang(de) .wy-proof a, :lang(de) .wy-svc a, :lang(de) .wy-matrix td { hyphens: auto; }
@media (max-width: 360px) { .wy-ind { grid-template-columns: minmax(0, 1fr); } }

/* icons: inline next to their label, one colour, never in a tile */
.wy-icon { flex: none; }
.wy-svc .n { display: inline-flex; align-items: center; gap: 16px; }
.wy-svc .n .wy-icon { color: var(--wy-color-violet-700); }
.wy-ind .wy-icon { color: var(--wy-color-violet-700); margin-bottom: 6px; }
.wy-matrix thead th .wy-icon { display: block; color: var(--wy-color-violet-700); margin-bottom: 8px; }
.wy-band .wy-icon, .wyc-band .wy-icon { color: var(--wy-color-lavender-100); }
.wy-flow-node h3 .wy-icon { vertical-align: -3px; margin-right: 8px; color: var(--wy-text-muted); }
.wy-arch-rail li.has-icon::before { display: none; }
.wy-arch-rail li.has-icon { align-items: center; gap: 8px; }
.wy-h2 + .wy-cases { margin-top: 40px; }

/* a list where each item is a short line with its icon */
.wy-iconlist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.wy-iconlist li { display: flex; gap: 16px; align-items: flex-start; padding: 22px 0; border-top: 1px solid var(--wy-border-strong); }
.wy-iconlist .wy-icon { color: var(--wy-color-violet-700); margin-top: 1px; }
.wy-iconlist p { font-size: 18px; line-height: 1.45; margin: 0; }
@media (max-width: 760px) { .wy-iconlist { grid-template-columns: minmax(0, 1fr); } }

/* model facts: label | value (DM Mono) */
.wy-model { margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 32px; }
.wy-model > div { padding: 20px 0 4px; border-top: 1px solid var(--wy-border-strong); }
.wy-model dt { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--wy-text-muted); margin: 0 0 8px; }
.wy-model dt .wy-icon { color: var(--wy-color-violet-700); }
.wy-model dd { margin: 0; font-family: var(--wy-font-mono); font-size: 16px; line-height: 1.45; color: var(--wy-text); }
@media (max-width: 960px) { .wy-model { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .wy-model { grid-template-columns: minmax(0, 1fr); } }
.wy-h2 + .wy-iconlist, .wy-h2 + .wy-model { margin-top: 40px; }

/* products: logo | name + area | what it does */
.wy-products { list-style: none; margin: 0; padding: 0; }
.wy-products li { display: grid; grid-template-columns: 200px minmax(0, 240px) minmax(0, 1fr); gap: 12px 40px; align-items: center; padding: 24px 0; border-top: 1px solid var(--wy-border-strong); }
.wy-products li:last-child { border-bottom: 1px solid var(--wy-border-strong); }
.wy-products img { display: block; width: 160px; height: 52px; object-fit: contain; object-position: left center; }
.wy-products h3 { font-size: 20px; font-weight: 500; margin: 0 0 2px; }
.wy-products .area { font-size: 14px; color: var(--wy-text-muted); margin: 0; }
.wy-products .desc { font-size: 16px; line-height: 1.55; margin: 0; }
@media (max-width: 960px) { .wy-products li { grid-template-columns: minmax(0, 1fr); } }
.wy-sec.wy-dsec { padding-left: var(--wy-gutter); padding-right: var(--wy-gutter); }
@media (max-width: 760px) { .wy-sec.wy-dsec { padding-left: 8px; padding-right: 8px; } }