/* CEx WordPress final visual-system layer — loaded after all migrated page CSS. */
@font-face {
  font-family: "Inter";
  src: url("fonts/inter-latin-400-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/inter-latin-500-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/inter-latin-600-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/inter-latin-700-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/inter-latin-800-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

body.cex-migrated-page {
  --font-sans: "Inter", "Inter Fallback", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Inter", "Inter Fallback", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --container: 1280px;
  --container-px: clamp(24px, 5vw, 72px);
  --section-py: clamp(88px, 8vw, 112px);
  min-width: 320px;
  font-family: var(--font-sans);
  font-size: 16px !important;
  line-height: 1.6;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

/* Dark sections use one accessible heading/lead treatment on every page. */
.cex-migrated-page .section--dark .eyebrow {
  color: #fff !important;
}
.cex-migrated-page .section--dark .h-lead {
  color: rgba(255, 255, 255, 0.86) !important;
}

.cex-migrated-page .h-section,
.cex-migrated-page .cx-trust__h {
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 3.65vw, 3.25rem) !important;
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.035em;
  max-width: 30ch;
  text-wrap: pretty;
}
.cex-migrated-page .h-lead,
.cex-migrated-page .cx-trust__lead {
  font-size: clamp(1.0625rem, 1.25vw, 1.1875rem);
  line-height: 1.6;
  text-wrap: pretty;
}
.cex-migrated-page :is(.service-card, .problem-card, .use-card, .industry-card, .diff-item, .method-step) h3 {
  font-size: clamp(1.125rem, 1.4vw, 1.375rem);
  line-height: 1.25;
  letter-spacing: -0.015em;
  text-wrap: pretty;
}
.cex-migrated-page :is(.service-card, .problem-card, .use-card, .industry-card, .diff-item, .method-step) p,
.cex-migrated-page .legal-card p,
.cex-migrated-page .legal-card li {
  font-size: 1rem;
  line-height: 1.65;
}
.cex-migrated-page .section__head {
  max-width: 960px;
  margin-bottom: clamp(36px, 4vw, 56px);
}
.cex-migrated-page main figure img {
  border-radius:0 !important;
}
.cex-migrated-page .cex-page-visual {
  width: 100%;
  max-width: var(--container);
  margin: clamp(32px, 4vw, 48px) auto 0;
  padding-inline: var(--container-px);
}
.cex-migrated-page .cex-page-visual img {
  width: 100%;
  max-width: 100%;
  height: clamp(300px, 34vw, 520px);
  object-fit: cover;
  object-position: center;
  box-shadow: 0 24px 60px -32px rgba(30, 35, 39, 0.4);
}
body.cex-migrated-page.home > main > .cex-page-visual {
  max-width: none;
  margin-top: 0;
  padding-inline: 0;
}
body.cex-migrated-page.home > main > .cex-page-visual img {
  height: clamp(260px, 32vw, 460px);
  border-radius:0 !important;
}

.cex-migrated-page :is(.btn, .cx-form__submit, .cx-hero-form button[type="submit"]) {
  min-height: 48px;
  border-radius:0 !important;
  font-size: 0.9375rem;
  font-weight: 700;
}
.cex-migrated-page form :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select) {
  min-height: 48px;
  font-family: var(--font-sans);
  font-size: 1rem;
}
.cex-migrated-page form textarea {
  min-height: 96px;
  font-family: var(--font-sans);
  font-size: 1rem;
}
.cex-migrated-page :is(.form__consent, .cx-form__consent, .cx-hero-form label) {
  font-size: 0.75rem !important;
  line-height: 1.5 !important;
}
.cex-migrated-page :is(input, textarea, select, button, a):focus-visible {
  outline: 3px solid var(--cx-accent);
  outline-offset: 3px;
}
.cex-migrated-page .cex-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.cex-migrated-page .cex-form-status {
  min-height: 1.5em;
  margin: 10px 0 0;
  color: currentColor;
  font-size: 0.8125rem;
  line-height: 1.45;
}

/* Final accessibility overrides shared by static HTML and WordPress. */
.cex-migrated-page .cx-form__eyebrow {
  /* Was #08704f — a green that existed nowhere else on the site and read as a
     success state where there is none. It was there for contrast, and the
     accent cannot replace it: #D96800 on the light form fill is 2.7:1 and
     fails. --muted is 7.3:1 and is already the site's secondary ink. */
  color: var(--muted) !important;
}

.cex-migrated-page .cross-link__tag {
  /* War var(--cx-accent-3), also #D96800. Auf der Kartenfüllung #F3F0ED sind
     das 3,12:1 bei 11 Pixel Schriftgrösse — unter dem Mindestwert von 4,5:1
     für Fliesstext. Dieselbe Farbfamilie, nur so weit abgedunkelt, dass sie
     die Grenze nimmt. Das Orange auf Flächen und Rahmen bleibt unberührt. */
  color: #7d3a00 !important;
}
.cex-migrated-page button.footer__cookie {
  min-height: 44px !important;
}
.cex-migrated-page button.footer__cookie {
  padding-block: 7px !important;
}

/* Service-page hero: one gutter, one type scale, compact enough for a laptop. */
@media (min-width: 921px) {
  
  
  
  
  
  
  
  
  
  
  
  body.cex-migrated-page:not(.home) .cx-hero-form :is(input:not([type="checkbox"]), textarea, button) {
    min-height: 44px !important;
  }
  
  
}



@media (min-width: 921px) and (max-width: 1599px) {
  .cex-migrated-page .method {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .cex-migrated-page .method .method-step {
    min-width: 0;
    padding: 28px 24px;
  }
}

/* Homepage hero actions: the enquiry action is primary on every screen. */





/* Legal/support pages use the same scale and readable body size. */
.cex-migrated-page .legal-hero {
  padding: clamp(88px, 10vw, 128px) 0 clamp(48px, 6vw, 72px);
}
.cex-migrated-page .legal-hero__title {
  font-size: clamp(2.75rem, 4.5vw, 3.625rem);
  font-weight: 800;
}
.cex-migrated-page .legal-hero__lead {
  font-size: 1.0625rem;
  line-height: 1.6;
}
.cex-migrated-page .legal-inline-button {
  min-height: 44px;
  padding: 10px 14px;
  border-radius:0;
}

/* Static service pages do not load the homepage stylesheet. Keep the shared
   consent dialog fully functional and out of the document flow here too. */
.cex-migrated-page .privacy-consent {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(6px);
}
.cex-migrated-page .privacy-consent[hidden] {
  display: none !important;
}
body.cex-migrated-page.has-privacy-dialog {
  overflow: hidden;
}
.cex-migrated-page .privacy-consent__panel {
  position: relative;
  width: min(100%, 640px);
  max-height: 90dvh;
  overflow-y: auto;
  padding: clamp(24px, 4vw, 40px);
  background: var(--cx-surface, var(--cx-surface));
  color: var(--cx-charcoal);
  border: 1px solid var(--line);
  box-shadow: 0 28px 80px -30px rgba(0, 0, 0, 0.72);
  scrollbar-gutter: stable;
}
.cex-migrated-page .privacy-consent__panel::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: var(--cx-yellow);
}
.cex-migrated-page .privacy-consent__close {
  position: absolute;
  top: 12px;
  right: 12px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 1.5rem;
  cursor: pointer;
}
.cex-migrated-page .privacy-consent__close:hover {
  background: var(--cx-yellow);
  color: var(--cx-charcoal);
}
.cex-migrated-page .privacy-consent__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--cx-charcoal);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.cex-migrated-page .privacy-consent__eyebrow::before {
  content: "";
  width: 18px;
  height: 3px;
  background: var(--cx-yellow);
}
.cex-migrated-page .privacy-consent__content h2 {
  margin: 0 0 12px;
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.cex-migrated-page .privacy-consent__content p {
  margin: 0 0 16px;
  color: var(--muted);
  font-size: 0.9375rem;
  line-height: 1.55;
}
.cex-migrated-page .privacy-consent__links {
  display: flex;
  gap: 16px;
  margin-bottom: 20px;
  font-size: 0.8125rem;
}
.cex-migrated-page .privacy-consent__links a {
  color: var(--cx-charcoal);
  text-decoration: underline;
  text-decoration-color: var(--cx-yellow);
  text-underline-offset: 3px;
}
.cex-migrated-page .privacy-consent__options {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
  border-top: 1px solid var(--line);
}
.cex-migrated-page .privacy-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.cex-migrated-page .privacy-option strong,
.cex-migrated-page .privacy-option small {
  display: block;
}
.cex-migrated-page .privacy-option strong {
  color: var(--cx-charcoal);
  font-size: 0.9375rem;
}
.cex-migrated-page .privacy-option small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.8125rem;
  line-height: 1.45;
}
.cex-migrated-page .privacy-option input[type="checkbox"] {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  accent-color: var(--cx-yellow);
}
.cex-migrated-page .privacy-option--locked input[type="checkbox"] {
  opacity: 0.6;
}
.cex-migrated-page .privacy-consent__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.cex-migrated-page .privacy-consent__actions button {
  flex: 1 1 160px;
  padding: 12px 16px;
  border: 1px solid var(--cx-charcoal);
  background: #fff;
  color: var(--cx-charcoal);
  font: inherit;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
}
.cex-migrated-page .privacy-consent__secondary:hover {
  background: var(--cx-charcoal);
  color: #fff;
}
.cex-migrated-page .privacy-consent__primary {
  background: var(--cx-yellow) !important;
  border-color: var(--cx-yellow) !important;
  color: var(--cx-charcoal) !important;
}
.cex-migrated-page .privacy-consent__close,
.cex-migrated-page .privacy-consent__actions button {
  min-width: 44px;
  min-height: 44px;
  border-radius:0;
}

@media (max-width: 920px) {
  body.cex-migrated-page {
    --container-px: clamp(20px, 5.5vw, 28px);
    --section-py: 64px;
    font-size: 16px !important;
  }
  .cex-migrated-page .h-section,
  .cex-migrated-page .cx-trust__h {
    font-size: clamp(1.875rem, 8vw, 2.25rem) !important;
    line-height: 1.1;
  }
  .cex-migrated-page .h-lead,
  .cex-migrated-page .cx-trust__lead {
    font-size: 1rem;
  }
  
  
  
  
  
  .cex-migrated-page .cex-page-visual {
    margin-top: 28px;
    padding-inline: var(--container-px);
  }
  .cex-migrated-page .cex-page-visual img,
  body.cex-migrated-page.home > main > .cex-page-visual img {
    height: clamp(240px, 72vw, 360px);
  }

  
  
  
  
  
  
  
  
  
  
  
  .cex-migrated-page .trust-item__num,
  .cex-migrated-page .trust-item__label,
  .cex-migrated-page .cross-link__tag,
  .cex-migrated-page .mining-step__num {
    margin-inline: auto;
    text-align: center !important;
  }
  body.cex-migrated-page:not(.home) .trust-item__num {
    font-size: clamp(0.875rem, 4vw, 1.125rem);
    overflow-wrap: anywhere;
  }
  body.cex-migrated-page:not(.home) .trust-item__label {
    display: none;
  }

  
  

  .cex-migrated-page .legal-hero {
    padding: 72px 0 52px;
    text-align: center;
  }
  .cex-migrated-page .legal-hero__eyebrow {
    margin-inline: auto;
  }
  .cex-migrated-page .legal-hero__title,
  .cex-migrated-page .legal-hero__lead {
    margin-inline: auto;
    text-align: center;
  }
  .cex-migrated-page .legal-hero__title {
    font-size: clamp(2.125rem, 10vw, 2.75rem);
  }

  .cex-migrated-page .privacy-consent {
    align-items: flex-start;
    padding: 12px;
  }
  .cex-migrated-page .privacy-consent__panel {
    max-height: calc(100dvh - 24px);
    padding: 24px 18px 18px;
  }
  .cex-migrated-page .privacy-consent__content {
    padding-top: 8px;
    text-align: left;
  }
  .cex-migrated-page .privacy-consent__eyebrow {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .cex-migrated-page .privacy-consent__actions {
    flex-direction: column;
  }
  .cex-migrated-page .privacy-consent__actions button {
    width: 100%;
    flex: 0 0 auto;
  }
}



@media (prefers-reduced-motion: reduce) {
  .cex-migrated-page *,
  .cex-migrated-page *::before,
  .cex-migrated-page *::after {
    scroll-behavior: auto !important;
  }
}

/* ==========================================================================
   CEX TOPBAR v2 — kanonisch, 2026-07-28
   Gilt für alle 36 öffentlichen Seiten. Ersetzt jede frühere Nav-Regel.
   Mittel-Slot ist dauerhaft freigehalten (temporäre LIVE-Pill des
   Client-Overview-Widgets liegt dort, position:fixed, z-index 99998).
   ENTFERNUNG DER PILL: siehe Block "NACH ENTFERNUNG DER PILL" am Ende.
   ========================================================================== */

:root {
  --cx-nav-h: 64px;
  --cx-nav-slot: 300px;   /* Mindestbreite des freigehaltenen Mittelfelds */
  --cx-nav-gap: 24px;
}

html { scroll-padding-top: calc(var(--cx-nav-h) + 16px); }

/* ---- Bar-Rahmen ---------------------------------------------------------- */
.cex-migrated-page .nav {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 100;
  background: var(--cx-surface, var(--cx-surface));
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  backdrop-filter: saturate(180%) blur(18px);
  color: var(--cx-charcoal);
  border-bottom: 1px solid var(--line);
  box-shadow: none;
  transition: box-shadow 280ms cubic-bezier(0.85, 0, 0, 1);
}
.cex-migrated-page .nav.is-scrolled {
  box-shadow: 0 1px 0 rgba(30, 35, 39, 0.04), 0 12px 28px -18px rgba(30, 35, 39, 0.18);
}
/* Scroll-Fortschritt: einziger Indikator, an der Unterkante der Bar */
.cex-migrated-page .nav::after {
  content: "";
  position: absolute;
  left: 0; bottom: -1px;
  width: 100%; height: 2px;
  background: var(--cx-yellow);
  transform-origin: left;
  transform: scaleX(var(--scroll-progress, 0));
}

/* ---- Drei-Zonen-Raster --------------------------------------------------- */
.cex-migrated-page .nav__inner {
  display: grid;
  grid-template-columns: auto minmax(var(--cx-nav-slot), 1fr) auto;
  align-items: center;
  gap: var(--cx-nav-gap);
  width: 100%;
  max-width: var(--container);
  min-height: var(--cx-nav-h);
  height: var(--cx-nav-h);
  margin-inline: auto;
  padding-inline: var(--container-px);
  padding-block: 0;
}
.cex-migrated-page .nav__lead {
  display: flex;
  align-items: center;
  gap: var(--cx-nav-gap);
  min-width: 0;
}
.cex-migrated-page .nav__slot { min-width: var(--cx-nav-slot); height: 1px; }
.cex-migrated-page .nav__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

/* ---- Marke --------------------------------------------------------------- */
.cex-migrated-page .nav__brand {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  text-decoration: none;
}
.cex-migrated-page .nav__brand img {
  width: 120px !important;
  height: 48px !important;
  object-fit: contain;
  display: block;
}

/* ---- In-Page-Anker ------------------------------------------------------- */
.cex-migrated-page .nav__primary {
  display: none;              /* erst ab 1200px sichtbar */
  align-items: center;
  gap: 22px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.cex-migrated-page .nav__primary li { margin: 0; }
.cex-migrated-page .nav__primary a {
  position: relative;
  display: inline-block;
  padding: 6px 0;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: -0.005em;
  text-decoration: none;
  color: var(--cx-charcoal-3);
  transition: color 280ms cubic-bezier(0.85, 0, 0, 1);
}
.cex-migrated-page .nav__primary a:hover { color: var(--cx-charcoal); }
.cex-migrated-page .nav__primary a.is-active { color: var(--cx-charcoal); }
.cex-migrated-page .nav__primary a.is-active::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: var(--cx-yellow);
}

/* ---- CTA ----------------------------------------------------------------- */
.cex-migrated-page .nav .nav__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 10px 16px;
  font-size: 0.8125rem;
  font-weight: 600;
  white-space: nowrap;
  background: var(--cx-charcoal) !important;
  border: 1px solid var(--cx-charcoal) !important;
  color: var(--cx-surface) !important;
  border-radius:0;
  text-decoration: none;
  transition: background-color 280ms cubic-bezier(0.85, 0, 0, 1),
              border-color 280ms cubic-bezier(0.85, 0, 0, 1),
              color 280ms cubic-bezier(0.85, 0, 0, 1);
}
.cex-migrated-page .nav .nav__cta:hover,
.cex-migrated-page .nav .nav__cta:focus-visible {
  background: var(--cx-yellow) !important;
  border-color: var(--cx-yellow) !important;
  color: var(--cx-charcoal) !important;
}
.cex-migrated-page .nav .nav__cta .btn__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  flex-shrink: 0;
  background: var(--cx-yellow);
  color: var(--cx-charcoal);
  transition: transform 280ms cubic-bezier(0.85, 0, 0, 1), background 280ms, color 280ms;
}
.cex-migrated-page .nav .nav__cta:hover .btn__icon { background: var(--cx-charcoal); color: var(--cx-yellow); transform: translateX(3px); }
.cex-migrated-page .nav .nav__cta .btn__icon svg { width: 12px; height: 12px; }

/* ---- Menü-Button --------------------------------------------------------- */
.cex-migrated-page .nav .cx-menu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  min-width: 44px;
  padding: 10px 14px 10px 11px;
  background: rgba(30, 35, 39, 0.04);
  border: 1px solid var(--line);
  color: var(--cx-charcoal);
  font-family: inherit;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: -0.005em;
  cursor: pointer;
  border-radius:0;
}
.cex-migrated-page .nav .cx-menu-btn:hover,
.cex-migrated-page .nav .cx-menu-btn[aria-expanded="true"] {
  background: var(--cx-charcoal);
  border-color: var(--cx-charcoal);
  color: #fff;
}
.cex-migrated-page .nav .cx-menu-btn__icon { width: 18px; height: 14px; gap: 3px; }
.cex-migrated-page .nav .cx-menu-btn__icon span { height: 1.5px; }
.cex-migrated-page .nav .cx-menu-btn:hover .cx-menu-btn__icon span,
.cex-migrated-page .nav .cx-menu-btn[aria-expanded="true"] .cx-menu-btn__icon span { background: var(--cx-yellow); }

/* ---- Fokus --------------------------------------------------------------- */
.cex-migrated-page .nav a:focus-visible,
.cex-migrated-page .nav button:focus-visible,
.cex-migrated-page .cx-drawer a:focus-visible {
  outline: 2px solid var(--cx-yellow);
  outline-offset: 3px;
}

/* ---- Drawer-Anpassungen -------------------------------------------------- */
.cex-migrated-page .cx-drawer { padding-top: var(--cx-nav-h); }
/* "Springen zu" ist die einzige Quelle der In-Page-Anker, sobald die
   Bar-Links weg sind — also überall ausser auf grossem Desktop sichtbar. */
.cex-migrated-page .cx-drawer__section--mobile { display: flex; flex-direction: column; gap: 6px; }
@media (min-width: 1200px) {
  .cex-migrated-page .cx-drawer__section--mobile { display: none; }
}

/* ---- Hero-Freiraum (AGENTS.md: fixe Nav darf Hero nie verdecken) --------- */


/* ==========================================================================
   Breakpoints
   ========================================================================== */

/* ≥1200px — volle Bar: Marke + 3 Anker | Slot | CTA mit Label | Menü mit Label */
@media (min-width: 1200px) {
  .cex-migrated-page .nav__primary { display: flex; }
}
@media (min-width: 1440px) {
  :root { --cx-nav-slot: 340px; }
}

/* ≤1199px — Anker wandern in den Drawer, Menü-Button wird Icon-only */
@media (max-width: 1199px) {
  :root { --cx-nav-slot: 260px; }
  .cex-migrated-page .nav .cx-menu-btn__label { display: none; }
  .cex-migrated-page .nav .cx-menu-btn { width: 44px; padding: 0; gap: 0; }
}

/* ≤920px — kompakte Bar; CTA wird Icon-only, sonst kollidiert sie mit der Pill */
@media (max-width: 920px) {
  :root { --cx-nav-h: 56px; --cx-nav-gap: 12px; }
  .cex-migrated-page .nav__inner { min-height: 56px; height: 56px; }
  .cex-migrated-page .nav__brand img { width: 100px !important; height: 40px !important; }
  .cex-migrated-page .nav .nav__cta-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .cex-migrated-page .nav .nav__cta { width: 44px; padding: 0; gap: 0; justify-content: center; }
  .cex-migrated-page .nav .nav__cta .btn__icon { width: 100%; height: 100%; background: transparent; color: var(--cx-surface); }
  .cex-migrated-page .nav .nav__cta:hover .btn__icon { background: transparent; color: var(--cx-charcoal); }
  .cex-migrated-page .nav .nav__cta .btn__icon svg { width: 15px; height: 15px; }
  /* AGENTS.md: Mikro-Labels auf Mobile zentrieren */
  .cex-migrated-page .cx-drawer__label { text-align: center; }
}

/* ≤620px — Pill verliert ihr Textlabel, Slot darf schrumpfen */
@media (max-width: 620px) {
  :root { --cx-nav-h: 52px; --cx-nav-slot: 100px; }
  .cex-migrated-page .nav__inner { min-height: 52px; height: 52px; }
}

@media (prefers-reduced-motion: reduce) {
  .cex-migrated-page .nav,
  .cex-migrated-page .nav *,
  .cex-migrated-page .cx-drawer,
  .cex-migrated-page .cx-drawer * { transition-duration: 0.01ms !important; animation: none !important; }
}

/* ==========================================================================
   NACH ENTFERNUNG DER PILL  (overview-widget.js gelöscht)
   Genau drei Änderungen, sonst nichts:
     1. :root { --cx-nav-slot: 0px; }  in allen vier Breakpoint-Blöcken
     2. @media (min-width:1200px) → @media (min-width:980px) für .nav__primary
        und @media (max-width:1199px) → (max-width:979px)
     3. Den ≤920px-Block "nav__cta-text visually hidden" streichen; stattdessen
        @media (max-width:520px) { … } — das CTA-Label bleibt bis 520px sichtbar.
   Die Bar bleibt sonst identisch.
   ========================================================================== */

/* ==========================================================================
   CEx DESIGN SYSTEM — shared surface palette (single source of truth)
   Loaded on every CEx page after the page's own CSS, so these win. Editing
   the tokens here retires a colour everywhere at once; do not re-declare
   these values in a page's own <style> block.
   ========================================================================== */
:root {

  /* Highlight/badge wash. Was rgba(255,122,0,.12), which composited over the
     var(--cx-warm-2) card fill to #EBDBCC — a tan that read as the retired cream even
     though nothing in the source was cream. At .30 it reads unambiguously as
     the brand orange on both the surface and the card fill. */
}

/* Ersatzschrift mit angeglichenen Massen.
   Die fünf Inter-Schnitte laden mit font-display:swap. Bis sie da sind, setzt
   der Browser die Systemschrift — die hat andere Zeilen- und Zeichenmasse, und
   beim Umschalten springt das Layout. Diese Ersatzschrift ist die lokale
   Arial, per Override auf Inters Masse gezogen. Sie rendert nichts Neues, sie
   nimmt dem Umschalten nur den Sprung. */
@font-face {
  font-family: "Inter Fallback";
  src: local("Arial");
  size-adjust: 107.12%;
  ascent-override: 90.20%;
  descent-override: 22.48%;
  line-gap-override: 0%;
}