/* Site header (research 61, variant A). Glass = functional layer only: the nav capsule, the round buttons,
   the dropdowns, the sheet and the floating Kaia button. Blur is never animated (only transform / opacity / clip-path). */
.sh { --sh-h: 48px; --sh-pad: var(--edge-vw);   /* the logo and the buttons stand on the page edge (grid 20.10) */
  position: fixed; z-index: 50; top: 0; left: 0; right: 0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px;
  padding: max(14px, env(safe-area-inset-top)) var(--sh-pad) 0; pointer-events: none; }
.sh > * { pointer-events: auto; }
/* once the page scrolls, a soft paper fade (not glass) keeps the logo readable over the content */
.sh::before { content: ""; position: absolute; z-index: -1; inset: 0 0 -28px; pointer-events: none; opacity: 0; transition: opacity 0.3s ease;
  background: linear-gradient(180deg, rgba(246, 245, 250, 0.94) 0%, rgba(246, 245, 250, 0.8) 60%, rgba(246, 245, 250, 0)); }
.sh.sh--scrolled::before { opacity: 1; }
body.is-loading .sh, body.is-loading .kfab { visibility: hidden; }

.sh__logo { justify-self: start; display: inline-flex; align-items: center; min-height: 44px; border-radius: 12px; }
.sh__logo img { height: clamp(24px, 1.9vw, 30px); width: auto; display: block; }

/* glass recipe shared by the capsule, the round buttons, the dropdowns, the sheet and the floating button */
.sh__nav, .sh__round, .sh__drop, .sh-sheet, .kfab {
  background: var(--glass-1); -webkit-backdrop-filter: var(--blur-1); backdrop-filter: var(--blur-1);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55), inset 0 1px 1px rgba(255, 255, 255, 0.9), 0 10px 30px -14px rgba(var(--shade), 0.35); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .sh__nav, .sh__round, .sh__drop, .sh-sheet, .kfab { background: rgba(255, 255, 255, 0.96); }
}

/* desktop capsule */
.sh__nav { position: relative; display: none; align-items: center; gap: 2px; padding: 4px; border-radius: 999px; }
.sh__item { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 4px; height: 40px; padding: 0 18px; border: 0; border-radius: 999px;
  background: none; color: var(--ink); font: 500 15px/1 var(--font); letter-spacing: -0.005em; text-decoration: none; cursor: pointer; white-space: nowrap; }
.sh__item:focus-visible, .sh__round:focus-visible, .sh__logo:focus-visible, .sh-ind:focus-visible, .sh-lang:focus-visible, .sh-sheet__item:focus-visible, .kfab:focus-visible, .sh-kaia:focus-visible {
  outline: 2px solid var(--sky); outline-offset: 2px; }
.sh__bead { position: absolute; z-index: -1; inset: 0; border-radius: 999px; pointer-events: none;
  background: rgba(255, 255, 255, 0.95); box-shadow: 0 2px 8px -3px rgba(var(--shade), 0.35), inset 0 1px 0 #fff; }
.sh__chev { display: inline-flex; width: 16px; height: 16px; transition: rotate 0.3s var(--ease-out, ease); }
.sh__chev svg, .sh-ind__icon svg, .sh-lang__check svg, .kfab__dot svg, .sh-kaia__dot svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
[aria-expanded="true"] > .sh__chev { rotate: 180deg; }

.sh__right { justify-self: end; display: flex; gap: 8px; }
.sh__round { width: var(--sh-h); height: var(--sh-h); border: 0; border-radius: 50%; display: grid; place-items: center; cursor: pointer; color: var(--ink); font: 600 13px/1 var(--font); letter-spacing: 0.04em; }
.sh__burger { display: grid; place-content: center; gap: 0; }
.sh__burger i { display: block; width: 18px; height: 1.75px; border-radius: 2px; background: var(--ink); margin: 2.6px 0; }

/* dropdown panels */
.sh__drop { position: absolute; top: calc(100% + 10px); border-radius: 28px; padding: 10px; }
.sh__branchen { left: 50%; width: min(840px, calc(100vw - 2 * var(--sh-pad))); padding: 18px; }
.sh__groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 18px; }
.sh-group { display: grid; align-content: start; gap: 2px; }
.sh-group__label { margin: 0 0 4px 10px; font: 600 11.5px/1.3 var(--font); letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-2); }
.sh-ind { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 10px; border-radius: 14px; color: var(--ink); font: 500 15px/1.25 var(--font); text-decoration: none; }
.sh-ind:hover { background: rgba(255, 255, 255, 0.75); }
.sh-ind__icon { flex: none; display: grid; place-items: center; width: 32px; height: 32px; padding: 6px; border-radius: 10px; color: var(--sky); background: rgba(var(--sky-rgb, 111, 155, 209), 0.12); }
.sh__langs { right: var(--sh-pad); width: 200px; display: grid; gap: 2px; }
.sh-lang { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 0 12px 0 14px; border: 0; border-radius: 16px; background: none; color: var(--ink); font: 500 15px/1 var(--font); cursor: pointer; text-align: left; }
.sh-lang:hover { background: rgba(255, 255, 255, 0.75); }
.sh-lang__check { width: 18px; height: 18px; color: var(--sky); opacity: 0; }
.sh-lang[aria-checked="true"] .sh-lang__check { opacity: 1; }

/* phone sheet (from the top) */
.sh-scrim { position: fixed; inset: 0; z-index: 48; background: rgba(33, 33, 33, 0.2); opacity: 0; visibility: hidden; }
.sh-sheet { position: fixed; z-index: 49; top: max(8px, env(safe-area-inset-top)); left: 8px; right: 8px; max-height: calc(100svh - 16px); overflow: auto; overscroll-behavior: contain;
  border-radius: 28px; padding: 76px 12px 16px; }
.sh-sheet__nav { display: grid; }
.sh-sheet__item { display: flex; align-items: center; justify-content: space-between; min-height: 56px; padding: 0 12px; border: 0; border-radius: 16px; background: none; color: var(--ink); font: 600 22px/1.2 var(--font); letter-spacing: -0.015em; text-decoration: none; text-align: left; cursor: pointer; }
.sh-sheet__item .sh__chev { width: 22px; height: 22px; }
.sh-sheet__branchen { overflow: hidden; display: grid; gap: 12px; padding: 4px 0 12px; }
.sh-sheet__foot { display: grid; gap: 14px; justify-items: center; margin-top: 16px; padding-top: 16px; border-top: 1px solid rgba(var(--shade), 0.1); }
.sh-kaia { display: inline-flex; align-items: center; gap: 12px; width: 100%; justify-content: center; height: 56px; border: 0; border-radius: 999px; background: var(--ink); color: #fff; font: 600 16px/1 var(--font); cursor: pointer; }
.sh-kaia__dot, .kfab__dot { display: grid; place-items: center; width: 36px; height: 36px; padding: 8px; border-radius: 50%; background: var(--warm); color: #fff; box-shadow: 0 4px 10px -4px rgba(var(--warm-rgb), 0.8); }
.sh-sheet__quiet { color: var(--text-2); font: 500 14px/1.4 var(--font); text-underline-offset: 3px; }
html.sh-locked, html.sh-locked body { overflow: hidden; }

/* floating Kaia button: the hero button in small */
.kfab { position: fixed; z-index: 45; left: 50%; bottom: max(16px, calc(env(safe-area-inset-bottom) + 8px));   /* centred by GSAP xPercent */
  display: inline-flex; align-items: center; gap: 12px; height: 56px; padding: 0 22px 0 10px; border: 0; border-radius: 999px; cursor: pointer;
  color: var(--ink); font: 600 16px/1 var(--font); white-space: nowrap; }
.kfab__dot { transition: scale 0.25s var(--ease-out, ease); }
.kfab:hover .kfab__dot { scale: 1.08; }

/* desktop: capsule in the middle, no burger */
@media (min-width: 1024px) {
  .sh__nav { display: inline-flex; }
  .sh__burger, .sh-sheet, .sh-scrim { display: none; }
}
/* very small phones: a bit tighter */
@media (max-width: 359px) { .sh { --sh-h: 44px; } .sh__right { gap: 6px; } }
@media (max-width: 1023px) { .sh__branchen { display: none; } }
/* [hidden] must win over the display rules above (closed panels and the closed accordion stay out of the layout) */
.sh [hidden], .sh-sheet[hidden], .sh-sheet [hidden] { display: none !important; }
.sh__right { grid-column: 3; }
html.sh-locked .proto { visibility: hidden; }   /* prototype switches never cover the open menu */
/* desktop: tap areas ≥ 44 px and the header grows with the screen (1 at 1440, up to 1.4 on very wide screens) */
@media (min-width: 1024px) {
  .sh { --hk: clamp(1px, calc(100vw / 1440), 1.4px); --sh-h: calc(52 * var(--hk)); }
  .sh__item { height: calc(44 * var(--hk)); padding: 0 calc(18 * var(--hk)); font-size: calc(15 * var(--hk)); }
  .sh__chev { width: calc(16 * var(--hk)); height: calc(16 * var(--hk)); }
  .sh__round { font-size: calc(13 * var(--hk)); }
  .sh__logo img { height: calc(28 * var(--hk)); }
  .sh-ind, .sh-lang { font-size: calc(15 * var(--hk)); min-height: calc(44 * var(--hk)); }
}

/* ---------- v2 (owner 14.10): smaller menu type, column hierarchy, round pastel icons, visible hover, dimmed page ---------- */
/* an icon inside a disc fills the disc; standalone icons (chevron, check, arrow) keep their own size */
.sh-ind__icon > .icon, .kfab__dot > .icon, .sh-kaia__dot > .icon, .hs-chip__icon > .icon, .hs-kaia__dot > .icon { display: block; width: 100%; height: 100%; }
.sh .icon svg, .sh-sheet .icon svg, .kfab .icon svg, .home .icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }

/* columns from the biggest group to the smallest: [4] [3 + 2] [3 + 2], then "another industry" across */
.sh__branchen { width: min(780px, calc(100vw - 2 * var(--sh-pad))); padding: 16px; }
.sh__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 12px; }
.sh__col { display: grid; align-content: start; gap: 14px; }
.sh-group__label { margin: 0 0 2px 8px; font-size: 11px; }
.sh-ind { gap: 10px; min-height: 44px; padding: 0 8px; border-radius: 14px; font-size: 14px; line-height: 1.25; hyphens: auto; transition: background-color 0.15s ease; }
.sh-ind__label { min-width: 0; }
/* icons as in the design system: round, on a light pastel sky disc with a soft inner light */
.sh-ind__icon { flex: none; display: grid; place-items: center; width: 34px; height: 34px; padding: 8px; border-radius: 50%; color: var(--sky-ink);
  background: radial-gradient(circle at 50% 42%, #eaf2fb, var(--sky-tint) 70%);
  box-shadow: inset 0 0 3px 1px rgba(255, 255, 255, 0.85), inset 0 -4px 6px -4px rgba(var(--shade), 0.22); }
.sh-ind__icon--warm { color: #9a4a22; background: radial-gradient(circle at 50% 42%, #fdf0e7, #f8dcc8 70%); }
.hs-chip__icon { color: var(--sky-ink); background: radial-gradient(circle at 50% 42%, #eaf2fb, var(--sky-tint) 70%);
  box-shadow: inset 0 0 3px 1px rgba(255, 255, 255, 0.85), inset 0 -4px 6px -4px rgba(var(--shade), 0.22); }
/* hover / focus / current must be visible on the white glass (owner 14.10): a clear sky tint, not white on white */
.sh-ind:hover, .sh-lang:hover, .sh-other:hover, .sh-sheet__item:hover { background: rgba(var(--sky-rgb), 0.16); }
.sh-ind:active, .sh-lang:active, .sh-other:active { background: rgba(var(--sky-rgb), 0.26); }
.sh-ind:focus-visible, .sh-lang:focus-visible, .sh-other:focus-visible { background: rgba(var(--sky-rgb), 0.16); outline: 2px solid var(--sky); outline-offset: -2px; }
.sh-lang { font-size: 14px; }
.sh-lang[aria-checked="true"] { background: rgba(var(--sky-rgb), 0.12); font-weight: 600; }
.sh-lang[aria-checked="true"]:hover { background: rgba(var(--sky-rgb), 0.2); }
.sh-lang__check { color: var(--sky-ink); }

.sh-other { display: flex; align-items: center; gap: 12px; width: 100%; margin-top: 12px; padding: 10px 12px 10px 8px; border: 0; border-radius: 16px; cursor: pointer; text-align: left;
  background: rgba(var(--warm-rgb), 0.08); color: var(--ink); font: 14px/1.3 var(--font); transition: background-color 0.15s ease; }
.sh-other:hover { background: rgba(var(--warm-rgb), 0.16); }
.sh-other__text { display: grid; gap: 2px; flex: 1; min-width: 0; }
.sh-other__text b { font-weight: 600; }
.sh-other__text small { font-size: 13px; color: var(--text-2); }
.sh-other__arrow { flex: none; width: 18px !important; height: 18px !important; color: var(--text-2); }
.sh-sheet__branchen .sh-other { margin-top: 4px; }

/* the dimmed page behind any open menu (desktop too) */
.sh-scrim { display: block !important; z-index: 49; background: rgba(33, 33, 33, 0.3); }   /* no blur: the design system never animates blur */
.sh-sheet { z-index: 49; }
.sh { z-index: 50; }

@media (min-width: 1024px) {
  .sh-ind, .sh-lang { font-size: 14px; min-height: 44px; }
}
/* the sheet: only the list scrolls (it never slides under the logo and buttons), the Kaia button stays pinned below */
.sh-sheet { display: flex; flex-direction: column; overflow: hidden; height: auto; max-height: calc(100svh - 16px); }
.sh-sheet__nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; margin: 0 -4px; padding: 0 4px;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 12px, #000 calc(100% - 12px), transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 12px, #000 calc(100% - 12px), transparent 100%); }
.sh-sheet__foot { flex: none; }
/* a grid would squeeze the accordion (overflow hidden → min-height 0) instead of scrolling: plain block flow */
.sh-sheet__nav { display: block; }
.sh-sheet__nav > * { width: 100%; }
.sh, .sh *, .sh-sheet, .sh-sheet *, .kfab, .kfab * { box-sizing: border-box; }   /* paddings count inside max-height */
.sh-ind__icon { width: 38px; height: 38px; padding: 9px; }   /* 20 px glyph in a 38 px disc (design system: 24 in 44) */

/* industry discs (owner 14.10: orange was too loud → calm neutral glass, dark glyphs): the design system's card disc */
.sh-ind__icon, .sh-ind__icon--warm, .hs-chip__icon {
  color: var(--ink);
  background: radial-gradient(circle at 50% 38%, rgba(255, 255, 255, 0.95), rgba(236, 238, 243, 0.98) 72%);
  box-shadow: inset 0 0 3px 1px rgba(255, 255, 255, 0.9), inset 0 -4px 7px -4px rgba(var(--shade), 0.22), 0 4px 10px -5px rgba(var(--shade), 0.3); }
.sh-ind__icon svg, .hs-chip__icon svg { stroke-width: 1.75; }

/* the glyph box is pinned inside the disc (a grid item with height:100% grew to the line height and sat 2 px low) */
.sh-ind__icon, .hs-chip__icon, .kfab__dot, .sh-kaia__dot, .hs-kaia__dot { position: relative; }
.sh-ind__icon > .icon, .hs-chip__icon > .icon, .kfab__dot > .icon, .sh-kaia__dot > .icon, .hs-kaia__dot > .icon {
  position: absolute; inset: 0; margin: auto; width: 20px; height: 20px; }
.hs-chip__icon > .icon { width: 18px; height: 18px; }
.sh-ind__icon > .icon svg, .hs-chip__icon > .icon svg, .kfab__dot > .icon svg, .sh-kaia__dot > .icon svg, .hs-kaia__dot > .icon svg { display: block; width: 100%; height: 100%; }

/* floating Kaia button = the same black button as in the phone menu (owner 14.10), not glass */
.kfab { background: var(--ink); color: #fff; -webkit-backdrop-filter: none; backdrop-filter: none;
  box-shadow: 0 12px 28px -12px rgba(33, 33, 33, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.12); }
.kfab:focus-visible { outline-color: var(--sky); }