/* Standalone header styles: all rules are scoped to this component. */
.uh-header {
  --uh-u: clamp(.68px, .052083333vw, 1px);
  --uh-brand: #03a9f5;
  --uh-ink: #111;
  --uh-height: max(76px, calc(110 * var(--uh-u)));
  position: relative;
  z-index: 100;
  width: 100%;
  background: #fff;
  color: var(--uh-ink);
  font-family: var(--urovo-font-primary, "Poppins"), ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-weight: 400;
  transition: background-color .25s ease, transform .35s ease;
}
.uh-header *, .uh-header *::before, .uh-header *::after { box-sizing: border-box; }
.uh-header [hidden] { display: none !important; }
.uh-header :is(a, button) { -webkit-tap-highlight-color: transparent; }
.uh-header a:not(.urovo-button) { text-decoration: none; color: inherit; }
.uh-header button:not(.urovo-button) { border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.uh-header :is(button, input) { margin: 0; }
.uh-header :is(button, a, input):focus-visible { outline: 2px solid var(--uh-brand); outline-offset: 4px; }
.uh-header :is(h2, p) { margin: 0; }
/* Normal-flow headers reserve the toolbar space not already supplied by body. */
.uh-header--solid { padding-block-start: max(0px, calc(var(--drupal-displace-offset-top, 0px) - var(--uh-body-top-padding, 0px))); }
.uh-header--home { position: absolute; top: var(--drupal-displace-offset-top, 0px); inset-inline: 0; background: transparent; color: #fff; }
.uh-header.is-sticky { padding-block-start: 0; position: fixed; top: var(--drupal-displace-offset-top, 0px); left: 0; --uh-height: 76px; background: #fff; color: var(--uh-ink); box-shadow: 0 2px 16px #0a133010; }
.uh-header.is-sticky-hidden { transform: translateY(calc(-100% - var(--drupal-displace-offset-top, 0px))); pointer-events: none; }
.uh-header.is-menu-open { background: #fff; color: var(--uh-ink); }
.uh-bar { display: flex; align-items: center; justify-content: space-between; min-height: var(--uh-height); margin: auto; gap: 24px; }
.uh-logo { flex: 0 0 auto; }
.uh-logo img { filter: brightness(0) saturate(100%) invert(57%) sepia(93%) saturate(1832%) hue-rotate(159deg) brightness(95%) contrast(101%); display: block; width: calc(135 * var(--uh-u)); min-width: 100px; height: auto; }
.uh-header--home:not(.is-sticky):not(.is-menu-open) .uh-logo img { filter: brightness(0) invert(1); }
.uh-nav { display: flex; align-items: center; gap: 0; margin-inline: calc(-19 * var(--uh-u)); font-size: max(13px, calc(18 * var(--uh-u))); font-weight: 500; }
.uh-nav-item { display: flex; align-items: center; min-height: var(--uh-height); padding-inline: calc(19 * var(--uh-u)); }
.uh-nav-trigger, .uh-nav-link { position: relative; white-space: nowrap; padding: 12px 0; transition: color .25s ease; }
.uh-nav-item > :is(.uh-nav-trigger, .uh-nav-link)::before {
  content: '';
  position: absolute;
  top: calc(12px + 2 * var(--uh-u));
  left: calc(-10 * var(--uh-u));
  width: calc(5 * var(--uh-u));
  height: calc(5 * var(--uh-u));
  border-radius: 50%;
  background: var(--uh-brand);
  opacity: 0;
  scale: .5;
  transition: opacity .2s ease, scale .2s ease;
}
.uh-header .uh-nav-item:is(:hover, :focus-within) > :is(.uh-nav-trigger, .uh-nav-link),
.uh-header .uh-nav-item > :is(.uh-nav-trigger, .uh-nav-link)[aria-expanded="true"] { color: var(--uh-brand); }
.uh-nav-item:is(:hover, :focus-within) > :is(.uh-nav-trigger, .uh-nav-link)::before,
.uh-nav-item > :is(.uh-nav-trigger, .uh-nav-link)[aria-expanded="true"]::before { opacity: 1; scale: 1; }
.uh-header .uh-nav:has(> .uh-nav-item:hover) > .uh-nav-item:not(:hover) > :is(.uh-nav-trigger, .uh-nav-link) { color: inherit; }
.uh-nav:has(> .uh-nav-item:hover) > .uh-nav-item:not(:hover) > :is(.uh-nav-trigger, .uh-nav-link)::before { opacity: 0; scale: .5; }
.uh-tools { display: flex; align-items: center; gap: calc(18 * var(--uh-u)); --uh-control: max(34px, calc(42 * var(--uh-u))); }
.uh-search-slot { position: relative; width: var(--uh-control); height: var(--uh-control); }
.uh-search { position: absolute; right: 0; z-index: 2; display: flex; align-items: center; width: var(--uh-control); height: var(--uh-control); border: 1px solid currentColor; border-radius: 999px; padding: 8px; overflow: hidden; transition: width .45s ease, background .25s; }
.uh-search:is(:hover, :focus-within) { width: 240px; background: #fff; color: #111; }
.uh-search input { flex: 1; min-width: 0; width: 0; border: 0; background: transparent; color: inherit; font: inherit; font-size: 14px; opacity: 0; outline: none; padding: 0; }
.uh-search:is(:hover, :focus-within) input { opacity: 1; }
.uh-search button { flex: 0 0 20px; width: 20px; height: 20px; padding: 0; }
.uh-search svg { display: block; width: 20px; height: 20px; }
.uh-language { position: relative; }
.uh-language > button { display: flex; align-items: center; justify-content: center; width: var(--uh-control); height: var(--uh-control); border: 1px solid currentColor; border-radius: 50%; font-size: 13px; }
.uh-language nav { position: absolute; z-index: 3; right: 0; top: calc(100% + 10px); min-width: 120px; padding: 8px; border: 1px solid #d7dfe5; border-radius: 8px; background: #fff; color: #111; box-shadow: 0 8px 20px #0a133018; }
.uh-language a { display: block; padding: 8px; }
.uh-language a:hover { color: var(--uh-brand); }
.uh-sales { flex-shrink: 0; }
.uh-header--home:not(.is-sticky):not(.is-menu-open) .uh-sales { --button-bg: #fff; --button-fg: #111; --button-border: #fff; --button-fill: var(--uh-brand); --button-hover-fg: #fff; }
.uh-menu-toggle { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; width: var(--uh-control); height: var(--uh-control); padding: 4px; }
.uh-menu-toggle span { width: 24px; height: 2px; background: currentColor; border-radius: 99px; transition: width .2s, transform .2s; }
.uh-menu-toggle span:nth-child(2) { width: 16px; }
.uh-menu-toggle:hover span:nth-child(2) { width: 24px; }
.uh-menu-toggle:hover span:is(:first-child, :last-child) { width: 16px; }
.uh-desktop-surface { position: absolute; z-index: 0; top: 100%; left: 0; width: 100%; background: #fff; pointer-events: none; opacity: 0; transition: height .26s ease-in-out, opacity .26s ease-in-out; }
.uh-panel.is-active { z-index: 2; }
.uh-panel:not(.is-active) { pointer-events: none; }
.uh-panel { z-index: 1; overscroll-behavior: contain; position: absolute; top: 100%; left: 0; width: 100%; max-height: calc(100dvh - var(--uh-height) - var(--drupal-displace-offset-top, 0px)); overflow: auto; background: transparent; color: #111; border-top: 1px solid #d7dfe5; box-shadow: 0 8px 18px #0a133012; }
.uh-close { position: absolute; z-index: 4; top: 8px; right: 18px; width: 32px; height: 32px; padding: 0; font-size: 30px !important; line-height: 1; }
.uh-mega { display: grid; grid-template-columns: minmax(250px, 28.5%) minmax(0, 1fr); min-height: calc(460 * var(--uh-u)); }
.uh-categories { display: flex; flex-direction: column; gap: calc(4 * var(--uh-u)); border-right: 1px solid #d7dfe5; padding: calc(28 * var(--uh-u)) calc(28 * var(--uh-u)) calc(32 * var(--uh-u)) 0; }
.uh-categories [data-category] { display: flex; align-items: center; justify-content: space-between; min-height: calc(48 * var(--uh-u)); padding: 8px 12px; text-align: left; color: #17476b; font-size: max(14px, calc(17 * var(--uh-u))); font-weight: 500; line-height: 1.35; }
.uh-categories [data-category] span { opacity: 0; font-size: 24px; }
.uh-categories [data-category].is-active { color: var(--uh-brand); font-weight: 700; }
.uh-categories [data-category].is-active span { opacity: 1; }
.uh-header .uh-all { margin-top: 12px; padding: 8px 12px; color: var(--uh-brand); font-size: 13px; }
.uh-details { min-width: 0; padding: calc(32 * var(--uh-u)) 0 calc(36 * var(--uh-u)) calc(36 * var(--uh-u)); }
.uh-content-detail { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, calc(410 * var(--uh-u))); gap: calc(42 * var(--uh-u)); align-items: start; }
.uh-header h2 { font-size: max(24px, calc(30 * var(--uh-u))); font-weight: 500; line-height: 1.25; letter-spacing: normal; }
.uh-header :is(.uh-content-detail, .uh-feature) p { margin-top: calc(18 * var(--uh-u)); color: #315a76; font-size: max(14px, calc(17 * var(--uh-u))); line-height: 1.55; }
.uh-content-detail > img { display: block; width: 100%; height: calc(230 * var(--uh-u)); min-height: 170px; object-fit: cover; border-radius: 12px; }
.uh-cta { margin-top: calc(40 * var(--uh-u)); }
.uh-catalog-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: calc(48 * var(--uh-u)); }
.uh-catalog-heading strong { font-size: max(18px, calc(20 * var(--uh-u))); font-weight: 500; }
.uh-header .uh-catalog-heading a { color: var(--uh-brand); font-size: 13px; white-space: nowrap; }
.uh-product-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: calc(16 * var(--uh-u)); margin-top: calc(16 * var(--uh-u)); position: relative; }
.uh-product-card { position: relative; display: flex; align-items: flex-end; height: calc(155 * var(--uh-u)); min-height: 120px; overflow: hidden; border: 1px solid #eef1f4; border-radius: 8px; background: linear-gradient(145deg, #fbfcfd, #f2f4f6); padding: calc(16 * var(--uh-u)); color: #152f43; }
.uh-product-card img { position: absolute; inset: 8px 12px 34px; width: calc(100% - 24px); height: calc(100% - 42px); object-fit: contain; mix-blend-mode: multiply; }
.uh-product-card strong { position: relative; font-size: max(12px, calc(14 * var(--uh-u))); font-weight: 500; }
.uh-preview { position: absolute; z-index: 5; inset-block: 0; right: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto auto; width: 40%; padding: 20px; border: 1px solid #e8edf1; border-radius: 12px; background: #fff; color: #152f43; box-shadow: 0 6px 18px #0a133018; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(15px) scale(.96); transition: opacity .3s, transform .35s; }
.uh-product-wrap:nth-child(5n + 4) .uh-preview, .uh-product-wrap:nth-child(5n + 5) .uh-preview { right: auto; left: 0; }
.uh-product-wrap.is-preview .uh-preview { opacity: 1; visibility: visible; transform: none; }
.uh-preview img { width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.uh-preview strong { margin-top: 12px; font-size: 20px; font-weight: 500; text-align: center; }
.uh-preview p { margin-top: 10px; font-size: 13px; line-height: 1.55; color: #315a76; }
.uh-feature { display: grid; grid-template-columns: minmax(0, 1fr) minmax(310px, calc(410 * var(--uh-u))); gap: calc(54 * var(--uh-u)); min-height: calc(300 * var(--uh-u)); padding-block: calc(38 * var(--uh-u)); }
.uh-feature > img { width: 100%; height: calc(245 * var(--uh-u)); min-height: 180px; object-fit: contain; }
.uh-feature-links { display: grid; gap: 4px; }
.uh-feature-links a { display: flex; align-items: center; justify-content: space-between; min-height: 38px; color: #17476b; font-size: max(14px, calc(17 * var(--uh-u))); }
.uh-feature-links a:hover { color: var(--uh-brand); }
.uh-feature-links a span { opacity: 0; transition: opacity .2s; }
.uh-feature-links a:hover span { opacity: 1; }
.uh-feature-copy > p + nav { margin-top: 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 30px; }
.uh-mobile { overscroll-behavior: contain; position: absolute; inset-inline: 0; top: 100%; height: calc(100dvh - var(--uh-height) - var(--drupal-displace-offset-top, 0px)); background: #fff; color: #111; overflow: auto; }
.uh-mobile > nav { position: relative; min-height: 100%; padding: 20px 6vw 60px; }
.uh-mobile-row { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e4e9ed; min-height: 62px; }
.uh-mobile-row > a, .uh-mobile-row > .uh-mobile-label { display: block; flex: 1; padding-block: 16px; font-size: 17px; }
.uh-mobile-row > button { padding: 16px; font-size: 22px; }
.uh-mobile-level { display: none; position: absolute; z-index: 2; inset: 0; padding: 20px 6vw 60px; background: #fff; min-height: 100%; }
.uh-mobile-level.is-open { display: block; }
.uh-mobile-heading { display: flex; align-items: center; gap: 20px; padding-block: 16px; border-bottom: 1px solid #e4e9ed; }
.uh-mobile-heading button { padding: 8px 0; color: #17476b; }
.uh-mobile-search { display: flex; gap: 12px; margin-top: 28px; }
.uh-mobile-search input { min-width: 0; flex: 1; padding: 12px; border: 1px solid #d7dfe5; border-radius: 4px; font: inherit; }
.uh-mobile-search button { color: var(--uh-brand); }
.uh-mobile-languages { display: flex; gap: 20px; padding-top: 24px; }
@media (max-width: 1279px) { .uh-bar { gap: 18px; } .uh-nav { margin-inline: -9px; } .uh-nav-item { padding-inline: 9px; } .uh-tools { gap: 10px; } }
@media (max-width: 1023px) { .uh-menu-toggle[aria-expanded=true] span:first-child { transform: translateY(8px) rotate(45deg); } .uh-menu-toggle[aria-expanded=true] span:nth-child(2) { opacity: 0; } .uh-menu-toggle[aria-expanded=true] span:last-child { transform: translateY(-8px) rotate(-45deg); } .uh-header { --uh-height: 76px; } .uh-nav { display: none; } .uh-logo img { width: 112px; } .uh-panel { display: none !important; } }
@media (max-width: 639px) { .uh-header { --uh-height: 68px; } .uh-bar { gap: 12px; } .uh-tools { gap: 12px; } .uh-search-slot, .uh-language { display: none; } .uh-logo img { width: 100px; } }

.uh-software-categories a { display: flex; align-items: center; justify-content: space-between; min-height: calc(48 * var(--uh-u)); padding: 8px 12px; color: #17476b; font-size: max(14px, calc(17 * var(--uh-u))); line-height: 1.35; }
.uh-software-categories a:first-child, .uh-software-categories a:hover { color: var(--uh-brand); }
.uh-software-categories a span { opacity: 0; }
.uh-software-categories a:first-child span, .uh-software-categories a:hover span { opacity: 1; }
.uh-content-detail > .uh-software-image { object-fit: contain; }
