/* Joomla shell cleanup – home-neu only */
body.itemid-515 .com-content-article > .page-header,
body.itemid-515 .com-content-article > .article-info {
  display: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.itemid-515 > .container-header,
body.itemid-515 > .container-footer,
body.itemid-515 .com-content-article > .icons,
body.itemid-515 .com-content-article > .btn-group,
body.itemid-515 .com-content-article .edit-icon {
  display: none !important;
}

body.itemid-515 .com-content-article__body > p {
  min-height: 0;
  margin: 0;
  padding: 0;
}

/* Break the isolated Oxolon home out of Joomla's article container. */
body.itemid-515 { overflow-x: clip; }
body.itemid-515 .ox-home {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

.ox-home {
  --ox-ink: #172d3d;
  --ox-muted: #667985;
  --ox-soft: #f4f8f8;
  --ox-line: #dce6e7;
  --ox-accent: #087f8d;
  --ox-accent-2: #47b8b0;
  --ox-accent-bright: #11a9a1;
  --ox-accent-pale: #e9f5f4;
  --ox-blue: #416fb0;
  --ox-amber: #d79a4d;
  --ox-dark: #172326;
  --ox-white: #fff;
  --ox-radius: 22px;
  --ox-shell: min(1480px, calc(100% - 56px));
  --ox-workspace-shell: min(1580px, calc(100% - 40px));
  color: var(--ox-ink);
  background: var(--ox-white);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  overflow-x: clip;
  isolation: isolate;
}

.ox-home *, .ox-home *::before, .ox-home *::after { box-sizing: border-box; }
.ox-home h1, .ox-home h2, .ox-home h3, .ox-home p, .ox-home dl, .ox-home dd, .ox-home ul { margin: 0; }
.ox-home h1, .ox-home h2, .ox-home h3 { color: var(--ox-ink); font-family: inherit; font-weight: 590; letter-spacing: -.04em; line-height: 1.04; }
.ox-home a { color: inherit; text-decoration: none; }
.ox-home img, .ox-home svg { display: block; max-width: 100%; }
.ox-home a:focus-visible { outline: 3px solid var(--ox-accent-bright); outline-offset: 4px; }
.ox-home .ox-shell { width: var(--ox-shell); margin-inline: auto; }
.ox-home .ox-workspace-shell { width: var(--ox-workspace-shell); margin-inline: auto; }
.ox-home .ox-visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.ox-home .ox-skip-link { position: fixed; z-index: 100; top: 12px; left: 12px; padding: 10px 16px; border-radius: 8px; background: var(--ox-dark); color: #fff; transform: translateY(-150%); }
.ox-home .ox-skip-link:focus { transform: none; }

/* Sticky Oxolon navigation */
.ox-home .ox-header {
  position: sticky;
  z-index: 80;
  top: 0;
  border-bottom: 1px solid rgba(120,148,158,.24);
  background: rgba(255,255,255,.965);
  color: #17364b;
  box-shadow: 0 8px 28px rgba(20,53,70,.07);
  backdrop-filter: blur(16px);
}
.ox-home .ox-header__inner { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 34px; }
.ox-home .ox-brand { flex: 0 0 auto; display: inline-flex; align-items: center; }
.ox-home .ox-brand__image { width: auto; height: 54px; object-fit: contain; }
.ox-home .ox-nav { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: clamp(13px,1.75vw,27px); color: #24475c; font-size: .82rem; font-weight: 650; }
.ox-home .ox-nav > a { padding-block: 12px; border-bottom: 1px solid transparent; }
.ox-home .ox-nav > a:hover { color: var(--ox-accent); border-color: currentColor; }
.ox-home .ox-nav__actions { display: inline-flex; align-items: center; gap: 10px; }
.ox-home .ox-nav__legacy {
  min-height: 34px;
  padding: 7px 11px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #d8c7b5;
  border-radius: 999px;
  background: #f6f0e9;
  color: #755f4c;
  font-size: .69rem;
  font-weight: 720;
  white-space: nowrap;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.78);
  transition: color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease,box-shadow .18s ease;
}
.ox-home .ox-nav__legacy::after {
  content: "↗";
  font-size: .68rem;
  line-height: 1;
  opacity: .72;
}
.ox-home .ox-nav__legacy:hover {
  border-color: #bea58c;
  background: #efe5da;
  color: #594534;
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(91,67,47,.08);
}
.ox-home .ox-nav__login { padding: 9px 16px; border: 1px solid #8ab8c1; border-radius: 9px; color: #0b5365; white-space: nowrap; }
.ox-home .ox-nav__login:hover { border-color: var(--ox-accent); background: #edf7f7; color: #074b58; }
.ox-home .ox-nav__user { min-width: 0; max-width: 230px; padding: 8px 11px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid #d7e3e5; border-radius: 999px; background: #f8fbfb; color: #4e6877; font-size: .74rem; white-space: nowrap; transition: border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease; }
.ox-home .ox-nav__user:hover { border-color: #91c4c8; background: #f1f9f9; color: #173f53; box-shadow: 0 6px 18px rgba(19,82,94,.07); }
.ox-home .ox-nav__user > span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; }
.ox-home .ox-nav__user-dot { flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--ox-accent-2); box-shadow: 0 0 0 4px rgba(71,184,176,.12); }
.ox-home .ox-nav__user small { padding-left: 7px; border-left: 1px solid #d4dfe1; color: var(--ox-accent); font-size: .61rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }

/* First-screen composition */
.ox-home .ox-intro {
  position: relative;
  background:
    radial-gradient(circle at 76% 34%,rgba(25,169,165,.20),transparent 31%),
    linear-gradient(135deg,#ffffff 0%,#f9fdfd 48%,#e8f5f4 100%);
  overflow: hidden;
}
.ox-home .ox-intro::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .26;
  pointer-events: none;
  background-image: radial-gradient(circle,rgba(50,137,145,.42) 1px,transparent 1.2px);
  background-size: 24px 24px;
  mask-image: linear-gradient(90deg,transparent 28%,#000 62%,transparent 100%);
}
.ox-home .ox-hero { position: relative; z-index: 1; padding-bottom: 62px; color: #17364b; background: transparent; overflow: visible; }
.ox-home .ox-hero::before { display: none; }
.ox-home .ox-hero__grid { position: relative; z-index: 1; min-height: 455px; padding-block: clamp(38px,4.2vw,54px) 54px; display: grid; grid-template-columns: minmax(330px,.78fr) minmax(570px,1.22fr); align-items: center; gap: clamp(42px,5vw,76px); }
.ox-home .ox-eyebrow, .ox-home .ox-section-index, .ox-home .ox-panel-label { color: var(--ox-accent); font-size: .72rem; font-weight: 740; letter-spacing: .16em; line-height: 1.4; text-transform: uppercase; }
.ox-home .ox-eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 15px; }
.ox-home .ox-eyebrow::before { content: ""; width: 31px; height: 1px; background: currentColor; }
.ox-home .ox-hero h1 { max-width: 560px; color: #132f43; font-size: clamp(2.7rem,4.15vw,4.35rem); line-height: 1; }
.ox-home .ox-hero h1 span { display: block; }
.ox-home .ox-lead { max-width: 545px; margin-top: 20px; color: #506b79; font-size: clamp(.91rem,1vw,1rem); line-height: 1.58; }
.ox-home .ox-hero__proof { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 8px; }
.ox-home .ox-hero__proof span { padding: 6px 9px; border: 1px solid #cfe2e2; border-radius: 999px; background: rgba(255,255,255,.84); color: #55717e; font-size: .64rem; font-weight: 680; letter-spacing: .025em; }

.ox-home .ox-hero-visual { position: relative; min-height: 350px; }
.ox-home .ox-hero-visual__stage { position: relative; z-index: 2; min-height: 332px; display: grid; grid-template-columns: minmax(150px,1fr) 205px minmax(150px,1fr); align-items: center; gap: 38px; }
.ox-home .ox-hero-visual__connectors { position: absolute; z-index: 1; inset: 0 0 20px; width: 100%; height: calc(100% - 20px); overflow: visible; }
.ox-home .ox-hero-visual__connectors path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.ox-home .ox-hero-visual__connectors marker path { fill: var(--ox-accent); }
.ox-home .ox-connector--in { stroke: #087f8d; stroke-width: 3.05; opacity: .98; }
.ox-home .ox-connector--out { stroke: #056d7d; stroke-width: 3.25; }

.ox-home .ox-visual-stack { display: grid; gap: 17px; }
.ox-home .ox-visual-chip { position: relative; min-height: 60px; padding: 10px 12px 10px 38px; border: 1.5px solid rgba(64,157,164,.92); border-radius: 12px; background: rgba(255,255,255,.97); box-shadow: 0 9px 26px rgba(17,82,98,.12); color: #123b51; }
.ox-home .ox-visual-chip i { position: absolute; left: 14px; top: 18px; width: 12px; height: 12px; border: 2.5px solid #087f8d; border-radius: 50%; background: #fff; box-shadow: 0 0 0 5px rgba(8,127,141,.18); }
.ox-home .ox-visual-stack--output .ox-visual-chip { border-color: rgba(44,162,157,.95); background: rgba(241,252,250,.98); }
.ox-home .ox-visual-stack--output .ox-visual-chip i { border-color: #39a9a4; box-shadow: 0 0 0 5px rgba(57,169,164,.13); }
.ox-home .ox-visual-chip strong { display: block; font-size: .76rem; letter-spacing: -.01em; }
.ox-home .ox-visual-chip small { display: block; margin-top: 3px; color: #718590; font-size: .57rem; line-height: 1.35; }
.ox-home .ox-visual-core { position: relative; width: 205px; height: 205px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 2.5px solid #057482; border-radius: 50%; background: linear-gradient(145deg,#ffffff 0%,#e8f7f5 100%); box-shadow: 0 25px 64px rgba(6,91,108,.22),0 0 0 18px rgba(8,127,141,.16); text-align: center; }
.ox-home .ox-visual-core__orbit { position: absolute; inset: -32px; border: 2px solid rgba(8,127,141,.55); border-radius: 50%; box-shadow: 0 0 0 24px rgba(8,127,141,.09); }
.ox-home .ox-visual-core__database { width: 69px; height: auto; margin-bottom: 10px; overflow: visible; }
.ox-home .ox-visual-core__database ellipse, .ox-home .ox-visual-core__database path { fill: rgba(8,127,141,.28); stroke: #006d7c; stroke-width: 2.8; }
.ox-home .ox-visual-core strong { color: #0a344a; font-size: 1.16rem; font-weight: 840; letter-spacing: .15em; }
.ox-home .ox-visual-core > span:not(.ox-visual-core__orbit) { margin-top: 3px; color: #057c87; font-size: .74rem; font-weight: 790; letter-spacing: .1em; text-transform: uppercase; }
.ox-home .ox-visual-core small { max-width: 145px; margin-top: 9px; color: #718590; font-size: .58rem; line-height: 1.45; }
.ox-home .ox-hero-visual__caption { position: absolute; z-index: 3; left: 50%; bottom: 0; transform: translateX(-50%); display: flex; align-items: center; gap: 8px; color: #728790; font-size: .62rem; letter-spacing: .08em; white-space: nowrap; text-transform: uppercase; }
.ox-home .ox-hero-visual__caption > span, .ox-home .ox-demo-label span { flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--ox-accent-bright); box-shadow: 0 0 0 5px rgba(17,169,161,.1); }

/* Main entry cards – visually part of the first screen */
.ox-home .ox-entry { position: relative; z-index: 5; margin-top: -108px; padding: 0 0 58px; background: transparent; }
.ox-home .ox-entry__topline { min-height: 28px; margin-bottom: 9px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #6d8089; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.ox-home .ox-entry__topline p:first-child { color: #46616f; font-weight: 760; }
.ox-home .ox-entry__topline p:last-child { text-align: right; }
.ox-home .ox-entry__grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 14px; }
.ox-home .ox-entry__grid--system { grid-template-columns: repeat(5,minmax(0,1fr)); }
.ox-home .ox-entry-card { --card-accent: var(--ox-accent); --card-tint: #eef8f7; position: relative; min-height: 154px; padding: 21px 22px 18px; border: 1px solid #d7e4e6; border-radius: 19px; background: linear-gradient(145deg,#fff 0%,#fff 68%,var(--card-tint) 145%); box-shadow: 0 14px 38px rgba(22,63,80,.09); display: grid; grid-template-columns: 60px 1fr; grid-template-rows: 1fr auto; column-gap: 17px; overflow: hidden; transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.ox-home .ox-entry-card::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 4px; background: linear-gradient(90deg,var(--card-accent),color-mix(in srgb,var(--card-accent) 35%,transparent) 72%,transparent); }
.ox-home .ox-entry-card::after { content: ""; position: absolute; right: -36px; top: -46px; width: 120px; height: 120px; border-radius: 50%; background: color-mix(in srgb,var(--card-accent) 8%,transparent); pointer-events: none; }
.ox-home .ox-entry-card:hover { transform: translateY(-5px); border-color: color-mix(in srgb,var(--card-accent) 48%,#d9e5e7); box-shadow: 0 21px 48px rgba(22,63,80,.14); }
.ox-home .ox-entry-card--status { --card-accent: #2f9e73; --card-tint: #edf8f3; }
.ox-home .ox-entry-card--knowledge { --card-accent: #7568b8; --card-tint: #f3f1fb; }
.ox-home .ox-entry-card--hydraulics { --card-accent: #078c9b; --card-tint: #ebf8fa; }
.ox-home .ox-entry-card--monitoring { --card-accent: #3f7fb4; --card-tint: #eef5fb; }
.ox-home .ox-entry-card--controlling { --card-accent: #c58a2d; --card-tint: #fff7e9; }
.ox-home .ox-entry-card--system { --card-accent: #a45f69; --card-tint: #fbf0f2; }
.ox-home .ox-entry-card__icon { position: relative; z-index: 1; width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid color-mix(in srgb,var(--card-accent) 16%,transparent); border-radius: 16px; background: var(--card-tint); color: var(--card-accent); box-shadow: inset 0 1px 0 rgba(255,255,255,.9); }
.ox-home .ox-entry-card__icon svg { width: 31px; height: 31px; overflow: visible; }
.ox-home .ox-entry-card__icon svg path, .ox-home .ox-entry-card__icon svg circle, .ox-home .ox-entry-card__icon svg rect { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ox-home .ox-entry-card__icon svg .ox-icon-accent { fill: var(--card-accent); stroke: var(--card-accent); }
.ox-home .ox-entry-card__content { min-width: 0; }
.ox-home .ox-entry-card__kicker { display: inline-flex; padding: 2px 7px; border-radius: 999px; background: var(--card-tint); color: var(--card-accent); font-size: .58rem; font-weight: 780; letter-spacing: .1em; text-transform: uppercase; }
.ox-home .ox-entry-card strong { display: block; margin-top: 4px; color: #17364b; font-size: 1.1rem; letter-spacing: -.025em; }
.ox-home .ox-entry-card small { display: block; margin-top: 6px; color: #657b87; font-size: .73rem; line-height: 1.35; }
.ox-home .ox-entry-card__arrow { grid-column: 2; justify-self: end; align-self: end; width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid color-mix(in srgb,var(--card-accent) 25%,#d1dde0); border-radius: 50%; background: var(--card-tint); color: var(--card-accent); font-size: 1rem; transition: transform .2s ease,border-color .2s ease,background .2s ease; }
.ox-home .ox-entry-card:hover .ox-entry-card__arrow { transform: translateX(3px); border-color: var(--card-accent); }

.ox-home .ox-entry-card.is-active { transform: translateY(-7px); border-color: color-mix(in srgb,var(--card-accent) 72%,#cddadd); background: linear-gradient(145deg,#fff 0%,var(--card-tint) 122%); box-shadow: 0 0 0 3px color-mix(in srgb,var(--card-accent) 14%,transparent),0 26px 58px rgba(20,61,79,.17); }
.ox-home .ox-entry-card.is-active::before { height: 6px; background: var(--card-accent); }
.ox-home .ox-entry-card.is-active::after { width: 150px; height: 150px; opacity: .92; }
.ox-home .ox-entry-card.is-active .ox-entry-card__icon { border-color: var(--card-accent); background: color-mix(in srgb,var(--card-accent) 88%,#fff); color: #fff; box-shadow: 0 10px 24px color-mix(in srgb,var(--card-accent) 22%,transparent); }
.ox-home .ox-entry-card.is-active .ox-entry-card__icon svg .ox-icon-accent { fill: #fff; stroke: #fff; }
.ox-home .ox-entry-card.is-active .ox-entry-card__kicker { background: var(--card-accent); color: #fff; }
.ox-home .ox-entry-card.is-active .ox-entry-card__arrow { border-color: var(--card-accent); background: var(--card-accent); color: #fff; }

.ox-home .ox-entry-card.is-locked { cursor:not-allowed; opacity:.76; }
.ox-home .ox-entry-card.is-locked:hover { transform:none; border-color:#d7e2e4; box-shadow:0 10px 30px rgba(20,61,79,.07); }
.ox-home .ox-entry-card.is-locked .ox-entry-card__arrow { opacity:.32; }
.ox-home .ox-entry-card__lock { position:absolute; z-index:5; top:13px; right:14px; width:24px; height:24px; display:grid; place-items:center; border:1px solid #d4dfe1; border-radius:50%; background:rgba(255,255,255,.92); color:#78909a; box-shadow:0 4px 12px rgba(28,65,79,.08); }
.ox-home .ox-entry-card__lock svg { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.ox-home .ox-toast[hidden] { display:none !important; }
.ox-home .ox-toast { position:fixed; z-index:120; top:96px; right:22px; max-width:min(320px,calc(100vw - 36px)); padding:10px 15px; border:1px solid #a9c8cc; border-radius:10px; background:rgba(255,255,255,.97); color:#24495b; box-shadow:0 12px 34px rgba(17,58,73,.16); font-size:.76rem; font-weight:690; opacity:0; transform:translateY(-5px); transition:opacity .18s ease,transform .18s ease; }
.ox-home .ox-toast.is-visible { opacity:1; transform:translateY(0); }


/* Gemeinsamer Oxolon-Workspace für Hydraulik, Monitoring und Anmeldung */
.ox-home .ox-workspace[hidden] { display: none !important; }
.ox-home .ox-workspace { position: relative; z-index: 4; scroll-margin-top: 84px; padding: 28px 0 72px; border-block: 1px solid #c8dcdf; background: radial-gradient(circle at 82% 8%,rgba(31,157,157,.12),transparent 24%),linear-gradient(180deg,#eaf3f4 0%,#f3f7f8 52%,#edf4f5 100%); box-shadow: inset 0 18px 42px rgba(33,94,108,.045),inset 0 -18px 42px rgba(33,94,108,.035); }
.ox-home .ox-workspace::before { content:""; position:absolute; left:0; top:-1px; width:100%; height:4px; background:linear-gradient(90deg,transparent 0%,#087f8d 20%,#47b8b0 62%,transparent 100%); opacity:.78; }
.ox-home .ox-workspace__bar { min-height:70px; margin-bottom:13px; padding:0 6px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.ox-home .ox-workspace__eyebrow { color:var(--ox-accent); font-size:.62rem; font-weight:790; letter-spacing:.15em; text-transform:uppercase; }
.ox-home .ox-workspace__bar h2 { margin-top:2px; color:#15364a; font-size:clamp(1.45rem,2vw,1.95rem); letter-spacing:-.03em; }
.ox-home .ox-workspace__actions { display:flex; align-items:center; gap:10px; }
/* Direktlinks in den beiden Runtime-Ansichten derzeit bewusst ausgeblendet.
 * Zum Reaktivieren lediglich diese Regel entfernen. */
.ox-home .ox-workspace[data-ox-app="hydraulics"] .ox-workspace__external,
.ox-home .ox-workspace[data-ox-app="monitoring"] .ox-workspace__external {
  display: none !important;
}

.ox-home .ox-workspace__external,.ox-home .ox-workspace__fullscreen,.ox-home .ox-workspace__close { min-height:39px; padding:8px 14px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid #abcbd0; border-radius:10px; background:rgba(255,255,255,.9); color:#31586a; font:inherit; font-size:.72rem; font-weight:710; line-height:1; cursor:pointer; box-shadow:0 5px 16px rgba(21,72,87,.05); transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease; }
.ox-home .ox-workspace__external:hover,.ox-home .ox-workspace__fullscreen:hover,.ox-home .ox-workspace__close:hover { border-color:#58a8b0; background:#fff; color:#087985; transform:translateY(-1px); box-shadow:0 8px 20px rgba(21,72,87,.09); }
.ox-home .ox-workspace__fullscreen[hidden] { display:none !important; }
.ox-home .ox-workspace__fullscreen span { font-size:1rem; line-height:.8; }
.ox-home .ox-workspace__close span { font-size:1.05rem; line-height:.8; }
.ox-home .ox-workspace__frame-wrap { position:relative; overflow:hidden; border:1px solid #b9d1d5; border-radius:22px; background:#fff; box-shadow:0 25px 64px rgba(18,57,73,.14),0 0 0 5px rgba(255,255,255,.48); }
.ox-home .ox-workspace__panel[hidden] { display:none !important; }
.ox-home .ox-workspace__panel { width:100%; background:#fff; }
.ox-home .ox-workspace__frame { display:block; width:100%; min-height:0; max-height:none; border:0; background:#fff; }
.ox-home .ox-workspace__frame--hydraulics { height:560px; overflow:hidden; }
.ox-home .ox-workspace__frame--monitoring { height:clamp(640px,calc(100vh - 150px),920px); }

.ox-home .ox-workspace__panel:fullscreen,
.ox-home .ox-workspace__panel:-webkit-full-screen {
  width:100vw;
  height:100vh;
  margin:0;
  padding:0;
  border:0;
  background:#fff;
  overflow:hidden;
}
.ox-home .ox-workspace__panel:fullscreen .ox-workspace__frame,
.ox-home .ox-workspace__panel:-webkit-full-screen .ox-workspace__frame {
  display:block;
  width:100vw !important;
  max-width:none !important;
  height:100vh !important;
  min-height:100vh !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:#fff;
}


.ox-home .ox-login {
  min-height: 430px;
  padding: clamp(34px,5vw,68px);
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(320px,.72fr);
  align-items: center;
  gap: clamp(38px,6vw,86px);
  background:
    radial-gradient(circle at 82% 18%,rgba(39,166,161,.13),transparent 27%),
    linear-gradient(135deg,#ffffff 0%,#f7fbfb 58%,#eef7f6 100%);
}
.ox-home .ox-login__intro {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 24px;
}
.ox-home .ox-login__mark {
  flex: 0 0 auto;
  width: 88px;
  height: 88px;
  display: grid;
  place-items: center;
  border: 1px solid #bdd9dc;
  border-radius: 25px;
  background: rgba(255,255,255,.9);
  color: #315b6d;
  box-shadow: 0 16px 34px rgba(24,70,84,.10);
}
.ox-home .ox-login__mark svg {
  width: 56px;
  height: 56px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ox-home .ox-login__mark .ox-login__mark-accent {
  stroke: #159b9a;
}
.ox-home .ox-login__eyebrow {
  margin: 0 0 5px;
  color: #0c858d;
  font-size: .64rem;
  font-weight: 790;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.ox-home .ox-login h3 {
  margin: 0;
  color: #15394d;
  font-size: clamp(1.65rem,2.5vw,2.4rem);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.ox-home .ox-login__text {
  max-width: 620px;
  margin: 11px 0 0;
  color: #6b818b;
  font-size: .82rem;
  line-height: 1.58;
}
.ox-home .ox-login__form {
  padding: 24px;
  border: 1px solid #c7dadd;
  border-radius: 18px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 18px 42px rgba(21,68,82,.10);
}
.ox-home .ox-login__field + .ox-login__field {
  margin-top: 15px;
}
.ox-home .ox-login__field label {
  display: block;
  margin-bottom: 6px;
  color: #456575;
  font-size: .68rem;
  font-weight: 720;
}
.ox-home .ox-login__field input {
  width: 100%;
  height: 45px;
  padding: 9px 12px;
  border: 1px solid #bed0d4;
  border-radius: 10px;
  outline: none;
  background: #fff;
  color: #173a4d;
  font: inherit;
  font-size: .82rem;
  box-shadow: inset 0 1px 2px rgba(20,58,73,.025);
  transition: border-color .18s ease,box-shadow .18s ease;
}
.ox-home .ox-login__field input:focus {
  border-color: #3c9fa4;
  box-shadow: 0 0 0 3px rgba(32,151,154,.11);
}
.ox-home .ox-login__remember {
  margin: 14px 0 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #6c818b;
  font-size: .68rem;
  cursor: pointer;
}
.ox-home .ox-login__remember input {
  width: 15px;
  height: 15px;
  accent-color: #168c92;
}
.ox-home .ox-login { position: relative; }
.ox-home .ox-login__bridge {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 1px;
  height: 1px;
  border: 0;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
  clip-path: inset(50%);
}
.ox-home .ox-login__feedback[hidden] {
  display: none !important;
}
.ox-home .ox-login__feedback {
  margin-top: 14px;
  padding: 9px 11px;
  border: 1px solid #cbdadd;
  border-radius: 9px;
  background: #f6f9fa;
  color: #506d7b;
  font-size: .68rem;
  line-height: 1.45;
}
.ox-home .ox-login__feedback.is-error {
  border-color: #e3b8b8;
  background: #fff6f6;
  color: #8a4444;
}
.ox-home .ox-login__feedback.is-success {
  border-color: #aed8c9;
  background: #f3fbf7;
  color: #34735e;
}
.ox-home .ox-login__feedback.is-working {
  border-color: #b7d7d9;
  background: #f3f9f9;
  color: #3f6972;
}
.ox-home .ox-login__submit {
  width: 100%;
  min-height: 46px;
  margin-top: 17px;
  padding: 10px 17px;
  border: 1px solid #178f95;
  border-radius: 11px;
  background: #168c92;
  color: #fff;
  font: inherit;
  font-size: .77rem;
  font-weight: 740;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(17,111,118,.17);
  transition: transform .18s ease,background .18s ease,box-shadow .18s ease;
}
.ox-home .ox-login__submit:hover {
  transform: translateY(-1px);
  background: #087f86;
  box-shadow: 0 11px 26px rgba(17,111,118,.22);
}
.ox-home .ox-login__submit:disabled {
  cursor: wait;
  opacity: .68;
  transform: none;
}

.ox-home .ox-account {
  min-height: 360px;
  padding: clamp(34px,5vw,68px);
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 42px;
  background:
    radial-gradient(circle at 84% 22%,rgba(39,166,161,.13),transparent 28%),
    linear-gradient(135deg,#ffffff 0%,#f7fbfb 58%,#eef7f6 100%);
}
.ox-home .ox-account__identity {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 24px;
}
.ox-home .ox-account__mark {
  flex: 0 0 auto;
  width: 82px;
  height: 82px;
  display: grid;
  place-items: center;
  border: 1px solid #bdd9dc;
  border-radius: 24px;
  background: rgba(255,255,255,.88);
  color: #315b6d;
  box-shadow: 0 16px 34px rgba(24,70,84,.10);
}
.ox-home .ox-account__mark svg {
  width: 52px;
  height: 52px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ox-home .ox-account__mark .ox-account__mark-accent {
  stroke: #159b9a;
}
.ox-home .ox-account__eyebrow {
  margin: 0 0 5px;
  color: #0c858d;
  font-size: .64rem;
  font-weight: 790;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.ox-home .ox-account h3 {
  margin: 0;
  color: #15394d;
  font-size: clamp(1.6rem,2.5vw,2.35rem);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.ox-home .ox-account__status {
  max-width: 620px;
  margin: 11px 0 0;
  color: #6b818b;
  font-size: .82rem;
  line-height: 1.55;
}
.ox-home .ox-account__status strong {
  color: #315a6a;
  font-weight: 720;
}

.ox-home .ox-account__context-summary {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 9px;
  color: #607782;
  font-size: .68rem;
}
.ox-home .ox-account__context-summary > span {
  color: #728790;
}
.ox-home .ox-account__context-summary > strong {
  color: #174a5d;
  font-size: .74rem;
  letter-spacing: .02em;
}
.ox-home .ox-account__context-summary > em {
  padding: 3px 8px;
  border: 1px solid #bdd9d7;
  border-radius: 999px;
  background: #eff9f7;
  color: #167d78;
  font-size: .58rem;
  font-style: normal;
  font-weight: 730;
}
.ox-home .ox-account__masquerade {
  grid-column: 1 / -1;
  margin-top: 2px;
  padding: 24px;
  display: grid;
  grid-template-columns: minmax(0,.9fr) minmax(330px,1.1fr);
  gap: 34px;
  border: 1px solid #c7dcde;
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
.ox-home .ox-account__masquerade h4 {
  margin: 3px 0 0;
  color: #173d50;
  font-size: 1rem;
  letter-spacing: -.02em;
}
.ox-home .ox-account__masquerade-copy > p:not(.ox-account__eyebrow) {
  max-width: 650px;
  margin: 8px 0 0;
  color: #6b8089;
  font-size: .72rem;
  line-height: 1.55;
}
.ox-home .ox-account__masquerade code {
  padding: 1px 4px;
  border-radius: 4px;
  background: #edf4f4;
  color: #27616b;
  font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size: .66rem;
}
.ox-home .ox-account__masquerade dl {
  margin: 17px 0 0;
  display: grid;
  gap: 7px;
}
.ox-home .ox-account__masquerade dl div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding-top: 7px;
  border-top: 1px solid #e0e9ea;
}
.ox-home .ox-account__masquerade dt {
  color: #71858e;
  font-size: .64rem;
}
.ox-home .ox-account__masquerade dd {
  margin: 0;
  color: #244d5e;
  font-size: .69rem;
  font-weight: 740;
}
.ox-home .ox-account__masquerade-controls {
  align-self: center;
}
.ox-home .ox-account__masquerade-form label {
  display: block;
  margin-bottom: 7px;
  color: #456575;
  font-size: .67rem;
  font-weight: 720;
}
.ox-home .ox-account__masquerade-select {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 10px;
}
.ox-home .ox-account__masquerade-select select {
  min-width: 0;
  height: 46px;
  padding: 8px 34px 8px 12px;
  border: 1px solid #b9d0d3;
  border-radius: 10px;
  outline: 0;
  background: #fff;
  color: #173f52;
  font: inherit;
  font-size: .76rem;
}
.ox-home .ox-account__masquerade-select select:focus {
  border-color: #439fa4;
  box-shadow: 0 0 0 3px rgba(31,151,153,.10);
}
.ox-home .ox-account__masquerade-select select:disabled {
  cursor: wait;
  background: #f4f7f7;
  color: #71858e;
  opacity: .82;
}
.ox-home .ox-account__masquerade-select .ox-account__button:disabled,
.ox-home .ox-account__context-reset:disabled {
  cursor: wait;
  opacity: .58;
  transform: none;
  box-shadow: none;
}
.ox-home .ox-account__masquerade-reset {
  margin-top: 11px;
}
.ox-home .ox-account__context-reset {
  padding: 4px 0;
  border: 0;
  background: transparent;
  color: #167f84;
  font: inherit;
  font-size: .68rem;
  font-weight: 720;
  text-decoration: underline;
  text-decoration-color: rgba(22,127,132,.35);
  text-underline-offset: 3px;
  cursor: pointer;
}
.ox-home .ox-account__context-reset:hover {
  color: #075f66;
}
.ox-home .ox-account__masquerade-feedback[hidden] {
  display: none !important;
}
.ox-home .ox-account__masquerade-feedback {
  margin-top: 12px;
  padding: 8px 10px;
  border: 1px solid #c7d9dc;
  border-radius: 9px;
  background: #f5f9f9;
  color: #526f7b;
  font-size: .66rem;
}
.ox-home .ox-account__masquerade-feedback.is-error {
  border-color: #e1b9b9;
  background: #fff6f6;
  color: #8a4444;
}
.ox-home .ox-account__masquerade-feedback.is-working {
  border-color: #b6d5d8;
  background: #f2f9f9;
  color: #416d75;
}
.ox-home .ox-account__masquerade-feedback.is-success {
  border-color: #afd8ca;
  background: #f2faf6;
  color: #35735e;
}
.ox-home .ox-account__actions {
  min-width: 250px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ox-home .ox-account__button {
  min-height: 46px;
  padding: 10px 17px;
  border: 1px solid #b7ced2;
  border-radius: 11px;
  background: rgba(255,255,255,.92);
  color: #34596a;
  font: inherit;
  font-size: .76rem;
  font-weight: 720;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(21,67,82,.06);
  transition: transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.ox-home .ox-account__button:hover {
  transform: translateY(-1px);
  border-color: #68aeb4;
  background: #fff;
  box-shadow: 0 10px 24px rgba(21,67,82,.10);
}
.ox-home .ox-account__button--primary {
  border-color: #178f95;
  background: #168c92;
  color: #fff;
}
.ox-home .ox-account__button--primary:hover {
  border-color: #087d84;
  background: #087f86;
}
.ox-home .ox-account__button:disabled {
  cursor: wait;
  opacity: .58;
  transform: none;
}

.ox-home .ox-knowledge {
  --ox-knowledge-nav-width: 340px;
  background:#fff;
}
.ox-home .ox-knowledge__tabs {
  min-height:58px;
  padding:10px 0 0;
  display:grid;
  grid-template-columns:repeat(2,calc(var(--ox-knowledge-nav-width) / 2)) minmax(0,1fr);
  gap:0;
  border-bottom:1px solid #d8e4e6;
  background:linear-gradient(180deg,#fbfdfd,#f4f8f8);
}
.ox-home .ox-knowledge__tabs button { position:relative; min-height:47px; padding:0 12px; border:0; border-radius:11px 11px 0 0; background:transparent; color:#607985; font:inherit; font-size:.78rem; font-weight:730; cursor:pointer; }
.ox-home .ox-knowledge__tabs button::after { content:""; position:absolute; left:13px; right:13px; bottom:-1px; height:3px; border-radius:3px 3px 0 0; background:transparent; }
.ox-home .ox-knowledge__tabs button span { margin-left:6px; padding:2px 7px; border-radius:999px; background:#e8eff1; color:#68808b; font-size:.62rem; }
.ox-home .ox-knowledge__tabs button.is-selected { background:#fff; color:#153b50; }
.ox-home .ox-knowledge__tabs button.is-selected::after { background:#087f8d; }
.ox-home .ox-knowledge__tabs button.is-selected span { background:#e4f3f2; color:#087f8d; }

.ox-home .ox-knowledge__layout { height:min(720px,72vh); min-height:600px; display:grid; grid-template-columns:var(--ox-knowledge-nav-width) minmax(0,1fr); align-items:stretch; }
.ox-home .ox-knowledge__nav { position:relative; z-index:2; height:100%; min-height:0; overflow-y:auto; overflow-x:hidden; scrollbar-gutter:stable; border-right:1px solid #dbe5e7; background:#f8fbfb; }
.ox-home .ox-knowledge__list { padding:20px 15px 24px; }
.ox-home .ox-knowledge__list[hidden] { display:none !important; }
.ox-home .ox-knowledge__list-label { margin:0 6px 13px; color:#71858e; font-size:.62rem; font-weight:780; letter-spacing:.13em; text-transform:uppercase; }
.ox-home .ox-knowledge__filter {
  position: sticky;
  z-index: 4;
  top: -20px;
  margin: 0 -1px 12px;
  padding: 10px 1px 9px;
  display: grid;
  grid-template-columns: 24px minmax(0,1fr) 28px;
  align-items: center;
  border-bottom: 1px solid rgba(218,230,232,.84);
  background: rgba(248,251,251,.96);
  backdrop-filter: blur(8px);
}
.ox-home .ox-knowledge__filter-icon {
  display: grid;
  place-items: center;
  color: #739099;
}
.ox-home .ox-knowledge__filter-icon svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
}
.ox-home .ox-knowledge__filter input {
  width: 100%;
  height: 36px;
  padding: 7px 9px;
  border: 1px solid #cfdddf;
  border-radius: 9px;
  outline: 0;
  background: #fff;
  color: #264d5d;
  font: inherit;
  font-size: .69rem;
  -webkit-appearance: none;
  appearance: none;
}
.ox-home .ox-knowledge__filter input::-webkit-search-cancel-button {
  display: none;
}
.ox-home .ox-knowledge__filter input:focus {
  border-color: #78b5ba;
  box-shadow: 0 0 0 3px rgba(41,143,149,.09);
}
.ox-home .ox-knowledge__filter-clear {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #708790;
  font: inherit;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
}
.ox-home .ox-knowledge__filter-clear:hover {
  background: #e7f0f1;
  color: #145c69;
}
.ox-home .ox-knowledge__filter-clear[hidden],
.ox-home .ox-knowledge__no-results[hidden],
.ox-home .ox-knowledge__item[hidden] {
  display: none !important;
}
.ox-home .ox-knowledge__no-results {
  margin: 12px 6px 16px;
  padding: 14px 12px;
  border: 1px dashed #cbdcde;
  border-radius: 10px;
  background: #fff;
  color: #6d838c;
  font-size: .72rem;
  line-height: 1.45;
  text-align: center;
}
.ox-home .ox-knowledge__empty { padding:20px 10px; color:#71858e; font-size:.8rem; line-height:1.5; }

.ox-home .ox-knowledge__item { position:relative; width:100%; padding:14px 38px 14px 14px; display:block; border:1px solid transparent; border-radius:12px; background:transparent; color:#24485a; font:inherit; text-align:left; cursor:pointer; transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.ox-home .ox-knowledge__item + .ox-knowledge__item { margin-top:5px; }
.ox-home .ox-knowledge__item:hover { border-color:#d5e2e4; background:#fff; box-shadow:0 8px 22px rgba(24,69,85,.07); transform:translateX(2px); }
.ox-home .ox-knowledge__item.is-selected { border-color:#8fc4c7; background:#fff; box-shadow:0 10px 28px rgba(20,83,94,.10),inset 4px 0 0 #087f8d; }
.ox-home .ox-knowledge__date { display:block; margin-bottom:3px; color:#7b9099; font-size:.61rem; font-weight:680; letter-spacing:.05em; }
.ox-home .ox-knowledge__item strong { display:block; color:#173b50; font-size:.83rem; line-height:1.3; letter-spacing:-.01em; }
.ox-home .ox-knowledge__item small { display:-webkit-box; margin-top:5px; overflow:hidden; color:#6d818b; font-size:.68rem; line-height:1.4; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.ox-home .ox-knowledge__item i { position:absolute; right:14px; top:50%; transform:translateY(-50%); color:#0b8790; font-size:.95rem; font-style:normal; }

.ox-home .ox-knowledge__reader { position:relative; min-width:0; min-height:0; height:100%; display:grid; grid-template-rows:62px minmax(0,1fr); overflow:hidden; background:#fff; }
.ox-home .ox-knowledge__reader-head { min-height:0; padding:13px 20px; display:flex; flex-direction:column; justify-content:center; border-bottom:1px solid #e0e8ea; background:#fff; }
.ox-home .ox-knowledge__reader-head span { color:#087f8d; font-size:.58rem; font-weight:780; letter-spacing:.12em; text-transform:uppercase; }
.ox-home .ox-knowledge__reader-head strong { margin-top:2px; overflow:hidden; color:#173b50; font-size:.9rem; text-overflow:ellipsis; white-space:nowrap; }
.ox-home .ox-knowledge__placeholder { min-height:0; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#72868f; text-align:center; }
.ox-home .ox-knowledge__placeholder[hidden] { display:none !important; }
.ox-home .ox-knowledge__placeholder svg { width:62px; height:62px; margin-bottom:14px; fill:none; stroke:#83afb3; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.ox-home .ox-knowledge__placeholder strong { color:#31586a; font-size:1rem; }
.ox-home .ox-knowledge__placeholder span { margin-top:5px; font-size:.76rem; }
.ox-home .ox-knowledge__frame { display:block; width:100%; height:100%; min-height:0; border:0; background:#fff; overflow:auto; }
.ox-home .ox-knowledge__frame[hidden] { display:none !important; }


/* 01 / Grundidee */
.ox-home .ox-principle { padding-block: clamp(82px,9vw,122px); border-top: 1px solid var(--ox-line); background: #fff; }
.ox-home .ox-section-head { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(280px,.65fr); align-items: end; gap: 80px; margin-bottom: 58px; }
.ox-home .ox-section-head h2 { margin-top: 15px; font-size: clamp(2.25rem,3.7vw,4rem); }
.ox-home .ox-section-head h2 span { color: var(--ox-accent); }
.ox-home .ox-section-head > p { color: var(--ox-muted); font-size: .96rem; line-height: 1.65; }
.ox-home .ox-section-head--principle { margin-bottom: 46px; }
.ox-home .ox-architecture { display: grid; grid-template-columns: minmax(185px,1fr) 34px 116px 30px minmax(255px,1.22fr) 30px 116px 34px minmax(185px,1fr); align-items: center; gap: 12px; padding: 28px; border: 1px solid #d9e7e8; border-radius: 26px; background: linear-gradient(145deg,#fbfdfd,#f3f8f8); box-shadow: 0 22px 64px rgba(23,67,83,.07); }
.ox-home .ox-architecture__label { margin-bottom: 12px; color: #52707d; font-size: .65rem; font-weight: 780; letter-spacing: .12em; text-transform: uppercase; }
.ox-home .ox-device-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ox-home .ox-device-card { min-height: 100px; padding: 12px 10px; border: 1px solid #dce8e9; border-radius: 14px; background: #fff; box-shadow: 0 7px 20px rgba(26,67,82,.055); display: flex; flex-direction: column; justify-content: space-between; gap: 8px; }
.ox-home .ox-device-card svg { width: 34px; height: 34px; color: #3f6978; }
.ox-home .ox-device-card svg path,.ox-home .ox-device-card svg circle,.ox-home .ox-device-card svg rect { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ox-home .ox-device-card svg .ox-svg-accent { stroke: var(--ox-accent); fill: rgba(8,127,141,.08); }
.ox-home .ox-device-card strong { display: block; color: #1c4053; font-size: .73rem; letter-spacing: -.01em; }
.ox-home .ox-device-card small { display: block; margin-top: 2px; color: #78909a; font-size: .57rem; line-height: 1.35; }
.ox-home .ox-architecture__arrow,.ox-home .ox-example-link { display: grid; place-items: center; color: #0a8691; }
.ox-home .ox-architecture__arrow span,.ox-home .ox-example-link span { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(8,127,141,.28); border-radius: 50%; background: #fff; box-shadow: 0 5px 16px rgba(8,127,141,.08); font-size: 1rem; }
.ox-home .ox-architecture__arrow--short span { width: 26px; height: 26px; font-size: .9rem; }
.ox-home .ox-interface-node { min-height: 152px; padding: 15px 10px; border: 1px solid #9bc9cd; border-radius: 18px; background: linear-gradient(145deg,#fff,#eef8f7); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; text-align: center; }
.ox-home .ox-interface-node--out { border-color: #7dbdb9; background: linear-gradient(145deg,#f9fffe,#e9f8f5); }
.ox-home .ox-interface-node__eyebrow { color: #69828c; font-size: .55rem; font-weight: 760; letter-spacing: .1em; text-transform: uppercase; }
.ox-home .ox-interface-node strong { min-width: 62px; padding: 4px 7px; border-radius: 7px; background: #0b7f89; color: #fff; font-size: .66rem; letter-spacing: .08em; }
.ox-home .ox-interface-node--out strong { background: #258f87; }
.ox-home .ox-interface-node small { margin-top: 4px; color: #758a94; font-size: .51rem; line-height: 1.25; }
.ox-home .ox-architecture-core { min-height: 300px; padding: 21px; border: 1px solid #087987; border-radius: 22px; background: linear-gradient(150deg,#163b4d 0%,#102f40 54%,#0a6b72 150%); box-shadow: 0 20px 48px rgba(12,67,80,.19); color: #fff; }
.ox-home .ox-architecture-core__head { display: flex; align-items: center; gap: 13px; padding-bottom: 15px; border-bottom: 1px solid rgba(174,230,225,.2); }
.ox-home .ox-architecture-core__head svg { flex: 0 0 auto; width: 54px; }
.ox-home .ox-architecture-core__head svg ellipse,.ox-home .ox-architecture-core__head svg path { fill: rgba(66,198,188,.18); stroke: #79ddd4; stroke-width: 2.2; }
.ox-home .ox-architecture-core__head small { display: block; color: #77d9d2; font-size: .58rem; font-weight: 780; letter-spacing: .13em; }
.ox-home .ox-architecture-core__head strong { display: block; margin-top: 2px; color: #fff; font-size: .92rem; letter-spacing: -.01em; }
.ox-home .ox-core-process { margin-top: 14px; display: grid; gap: 5px; }
.ox-home .ox-core-process span,.ox-home .ox-core-process strong { padding: 7px 9px; border: 1px solid rgba(161,221,218,.16); border-radius: 8px; background: rgba(255,255,255,.055); color: #d8e8e9; font-size: .63rem; text-align: center; }
.ox-home .ox-core-process strong { border-color: rgba(91,215,204,.4); background: rgba(36,171,162,.17); color: #86e5dc; font-size: .67rem; }
.ox-home .ox-core-process i { color: #60cfc6; font-size: .72rem; font-style: normal; line-height: 1; text-align: center; }
.ox-home .ox-architecture__footer { margin-top: 18px; display: flex; align-items: center; justify-content: center; gap: 13px; color: #758b94; font-size: .66rem; }
.ox-home .ox-architecture__footer i { width: 4px; height: 4px; border-radius: 50%; background: var(--ox-accent); }

/* 02 / Praxisbeispiel */
.ox-home .ox-example { padding-block: clamp(82px,9vw,122px); background: linear-gradient(145deg,#14282f,#172326 62%,#0f373c 140%); color: #fff; }
.ox-home .ox-section-head--light h2 { color: #fff; }
.ox-home .ox-section-head--light > p { color: #b7c5c7; }
.ox-home .ox-section-head--example { margin-bottom: 44px; }
.ox-home .ox-example-flow { display: grid; grid-template-columns: minmax(230px,.9fr) 42px minmax(270px,1.04fr) 42px minmax(240px,.92fr); align-items: center; gap: 18px; }
.ox-home .ox-example-label { margin-bottom: 10px; color: #7ed8d0; font-size: .62rem; font-weight: 760; letter-spacing: .12em; text-transform: uppercase; }
.ox-home .ox-example-inputs { display: grid; gap: 9px; }
.ox-home .ox-example-input { min-height: 67px; padding: 9px 11px; border: 1px solid #34484e; border-radius: 13px; background: rgba(255,255,255,.035); display: grid; grid-template-columns: 45px 1fr; align-items: center; gap: 10px; }
.ox-home .ox-example-input__icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; background: rgba(26,151,145,.12); color: #79d8d0; }
.ox-home .ox-example-input__icon svg { width: 28px; height: 28px; }
.ox-home .ox-example-input__icon svg path,.ox-home .ox-example-input__icon svg circle { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ox-home .ox-example-input__icon svg .ox-svg-accent { stroke: #43beb5; }
.ox-home .ox-example-input small { display: block; color: #91a5aa; font-size: .58rem; }
.ox-home .ox-example-input strong { display: inline-block; margin-top: 1px; color: #fff; font-size: .86rem; }
.ox-home .ox-example-input em { margin-left: 7px; color: #65d1c8; font-size: .56rem; font-style: normal; }
.ox-home .ox-example-link span { border-color: rgba(85,213,203,.25); background: rgba(10,111,116,.18); color: #6de0d6; box-shadow: none; }
.ox-home .ox-example-logic { padding: 22px; border: 1px solid rgba(65,190,181,.48); border-radius: 22px; background: linear-gradient(150deg,rgba(17,82,89,.72),rgba(12,47,55,.95)); box-shadow: 0 18px 48px rgba(0,0,0,.18); }
.ox-home .ox-example-logic__database { display: flex; flex-direction: column; align-items: center; text-align: center; }
.ox-home .ox-example-logic__database svg { width: 62px; }
.ox-home .ox-example-logic__database svg ellipse,.ox-home .ox-example-logic__database svg path { fill: rgba(76,207,196,.13); stroke: #77ddd4; stroke-width: 2.3; }
.ox-home .ox-example-logic__database span { margin-top: 6px; color: #74ddd4; font-size: .62rem; font-weight: 790; letter-spacing: .14em; }
.ox-home .ox-example-logic__database strong { color: #fff; font-size: 1.08rem; }
.ox-home .ox-example-rules { margin-top: 18px; display: grid; gap: 7px; }
.ox-home .ox-example-rules span { min-height: 34px; padding: 6px 8px; border: 1px solid rgba(167,217,216,.12); border-radius: 9px; background: rgba(255,255,255,.035); display: flex; align-items: center; gap: 9px; color: #c6d5d7; font-size: .64rem; }
.ox-home .ox-example-rules i { flex: 0 0 auto; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: rgba(60,194,184,.16); color: #7de0d7; font-size: .56rem; font-style: normal; }
.ox-home .ox-example-decision { margin-top: 14px; padding: 10px; border: 1px solid rgba(82,218,205,.38); border-radius: 10px; background: rgba(31,166,156,.13); text-align: center; }
.ox-home .ox-example-decision small { display: block; color: #78d9d1; font-size: .55rem; letter-spacing: .1em; text-transform: uppercase; }
.ox-home .ox-example-decision strong { display: block; margin-top: 2px; color: #fff; font-size: .82rem; }
.ox-home .ox-example-output { padding: 18px; border: 1px solid #34484e; border-radius: 20px; background: rgba(255,255,255,.035); }
.ox-home .ox-boiler-visual { height: 145px; display: grid; place-items: center; border-radius: 14px; background: radial-gradient(circle at 42% 48%,rgba(41,173,164,.11),transparent 44%); }
.ox-home .ox-boiler-visual svg { width: min(100%,220px); height: 126px; }
.ox-home .ox-boiler-visual svg rect,.ox-home .ox-boiler-visual svg path,.ox-home .ox-boiler-visual svg circle { fill: none; stroke: #82999e; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ox-home .ox-boiler-visual .ox-boiler-flame { fill: rgba(216,154,77,.24); stroke: #e3ad65; }
.ox-home .ox-boiler-visual .ox-pump-arrow { fill: rgba(77,208,197,.2); stroke: #62d5cb; }
.ox-home .ox-command-list { margin-top: 6px; display: grid; gap: 7px; }
.ox-home .ox-command-list div { min-height: 34px; padding: 6px 8px; border-top: 1px solid #31454b; display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #bccbce; font-size: .66rem; }
.ox-home .ox-command-state { min-width: 42px; padding: 3px 7px; border-radius: 999px; background: #344347; color: #b9c4c6; font-size: .57rem; text-align: center; }
.ox-home .ox-command-state--on { background: rgba(41,183,172,.17); color: #72ddd4; }
.ox-home .ox-example-note { margin-top: 22px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; color: #82979b; font-size: .62rem; letter-spacing: .06em; text-transform: uppercase; }
.ox-home .ox-example-note span { width: 7px; height: 7px; border-radius: 50%; background: #4ec9bf; box-shadow: 0 0 0 5px rgba(78,201,191,.09); }


/* Bivalent / multivalent system – final content section */
.ox-home .ox-multivalent {
  padding-block: clamp(86px,9vw,128px);
  background:
    radial-gradient(circle at 84% 20%,rgba(52,168,161,.10),transparent 30%),
    linear-gradient(180deg,#ffffff 0%,#f5f9f9 100%);
}
.ox-home .ox-section-head--multivalent { margin-bottom: 34px; }
.ox-home .ox-section-head--multivalent h2 { max-width: 780px; }
.ox-home .ox-multivalent__statement { margin: 0 0 34px 25%; padding: 20px 24px; border-left: 3px solid var(--ox-accent); background: rgba(255,255,255,.74); box-shadow: 0 12px 34px rgba(19,64,78,.05); }
.ox-home .ox-multivalent__statement > p { color: #516d79; font-size: .9rem; line-height: 1.68; }
.ox-home .ox-multivalent__statement > p strong { color: #1c3c50; }
.ox-home .ox-multivalent__chips { margin-top: 15px; display: flex; flex-wrap: wrap; gap: 8px; }
.ox-home .ox-multivalent__chips span { padding: 5px 9px; border: 1px solid #c9dedf; border-radius: 999px; background: #fff; color: #31606c; font-size: .63rem; font-weight: 720; }

.ox-home .ox-multi-card { padding: 26px 28px 22px; border: 1px solid #d6e4e5; border-radius: 28px; background: rgba(255,255,255,.96); box-shadow: 0 22px 62px rgba(18,61,76,.09); overflow: hidden; }
.ox-home .ox-multi-card__head { display: grid; grid-template-columns: minmax(0,.82fr) minmax(300px,1.18fr); align-items: end; gap: 52px; padding-bottom: 22px; border-bottom: 1px solid #e3ecec; }
.ox-home .ox-multi-card__head span { display: block; color: var(--ox-accent); font-size: .6rem; font-weight: 780; letter-spacing: .12em; text-transform: uppercase; }
.ox-home .ox-multi-card__head strong { display: block; margin-top: 5px; color: #17384c; font-size: 1.12rem; letter-spacing: -.02em; }
.ox-home .ox-multi-card__head p { color: #647a84; font-size: .75rem; line-height: 1.55; }

.ox-home .ox-multi-stage { position: relative; min-height: 430px; margin-top: 20px; border-radius: 20px; background: linear-gradient(145deg,#f7fbfb,#eef6f5); overflow: hidden; }
.ox-home .ox-multi-stage::before { content: ""; position: absolute; inset: 0; opacity: .36; background-image: radial-gradient(circle,rgba(36,130,138,.20) 1px,transparent 1.2px); background-size: 26px 26px; mask-image: linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent); }
.ox-home .ox-multi-stage__lines { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; }
.ox-home .ox-multi-stage__lines path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.ox-home .ox-multi-stage__lines marker path { stroke: none; }
.ox-home .ox-multi-stage__lines marker[id="ox-heat-arrow"] path { fill: #d88443; }
.ox-home .ox-multi-stage__lines marker[id="ox-control-arrow"] path { fill: #087f8d; }
.ox-home .ox-multi-heat { stroke: #d88443; stroke-width: 3.2; }
.ox-home .ox-multi-heat--electric { stroke: #d1a13f; }
.ox-home .ox-multi-control-line { stroke: #087f8d; stroke-width: 2.2; opacity: .72; }

.ox-home .ox-multi-control { position: absolute; z-index: 4; left: 50%; top: 18px; transform: translateX(-50%); min-width: 290px; padding: 12px 18px; border: 1px solid #82bdc0; border-radius: 15px; background: rgba(255,255,255,.97); box-shadow: 0 12px 30px rgba(12,92,105,.12); display: flex; align-items: center; justify-content: center; gap: 13px; }
.ox-home .ox-multi-control svg { flex: 0 0 auto; width: 47px; }
.ox-home .ox-multi-control svg ellipse,.ox-home .ox-multi-control svg path { fill: rgba(8,127,141,.13); stroke: #087f8d; stroke-width: 2; }
.ox-home .ox-multi-control span { display: flex; flex-direction: column; }
.ox-home .ox-multi-control small { color: #087f8d; font-size: .54rem; font-weight: 820; letter-spacing: .14em; }
.ox-home .ox-multi-control strong { color: #153d51; font-size: .83rem; }
.ox-home .ox-multi-control em { margin-top: 2px; color: #70838c; font-size: .52rem; font-style: normal; }

.ox-home .ox-multi-source { position: absolute; z-index: 3; left: 2.7%; width: 220px; min-height: 82px; padding: 11px 12px; border: 1px solid #d5e2e3; border-radius: 15px; background: rgba(255,255,255,.96); box-shadow: 0 10px 26px rgba(22,67,79,.08); display: grid; grid-template-columns: 50px 1fr; align-items: center; gap: 10px; }
.ox-home .ox-multi-source--oil { top: 72px; }
.ox-home .ox-multi-source--wood { top: 177px; }
.ox-home .ox-multi-source--power { top: 282px; border-color: #dfd0a8; background: linear-gradient(145deg,#fff,#fff9e9); }
.ox-home .ox-multi-source__icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 12px; background: #eef7f6; color: #366773; }
.ox-home .ox-multi-source--oil .ox-multi-source__icon { background: #f7f1ec; color: #7b6455; }
.ox-home .ox-multi-source--wood .ox-multi-source__icon { background: #eef5ef; color: #4d745c; }
.ox-home .ox-multi-source--power .ox-multi-source__icon { background: #fff1c8; color: #9b7a28; }
.ox-home .ox-multi-source__icon svg { width: 34px; height: 34px; }
.ox-home .ox-multi-source__icon svg path,.ox-home .ox-multi-source__icon svg rect { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ox-home .ox-multi-source__icon svg .ox-svg-heat { fill: rgba(218,126,64,.14); stroke: #d77d3f; }
.ox-home .ox-multi-source__icon svg .ox-svg-electric { fill: rgba(210,163,61,.18); stroke: #b78a27; }
.ox-home .ox-multi-source span:last-child { min-width: 0; }
.ox-home .ox-multi-source small { display: block; color: #819099; font-size: .49rem; letter-spacing: .07em; text-transform: uppercase; }
.ox-home .ox-multi-source strong { display: block; margin-top: 1px; color: #24465a; font-size: .78rem; }
.ox-home .ox-multi-source em { display: block; margin-top: 2px; color: #778b94; font-size: .52rem; font-style: normal; line-height: 1.3; }

.ox-home .ox-multi-buffer { position: absolute; z-index: 3; left: 50%; top: 142px; transform: translateX(-50%); width: 224px; padding: 15px 14px 13px; border: 1px solid #b9d6d6; border-radius: 19px; background: rgba(255,255,255,.96); box-shadow: 0 14px 38px rgba(17,77,91,.10); text-align: center; }
.ox-home .ox-multi-buffer > p { color: #17465a; font-size: .71rem; font-weight: 780; }
.ox-home .ox-buffer-pair { height: 150px; margin: 10px 0 8px; display: flex; align-items: stretch; justify-content: center; gap: 16px; }
.ox-home .ox-buffer { position: relative; width: 64px; border: 2px solid #2b8f96; border-radius: 32px 32px 14px 14px; background: linear-gradient(to top,#e6f5f3 0 25%,#f7eadf 25% 58%,#f3c9a9 58% 100%); box-shadow: inset 0 0 0 5px rgba(255,255,255,.54); overflow: hidden; }
.ox-home .ox-buffer::before,.ox-home .ox-buffer::after { content: ""; position: absolute; left: 6px; right: 6px; height: 1px; background: rgba(68,111,118,.22); }
.ox-home .ox-buffer::before { top: 34%; }.ox-home .ox-buffer::after { top: 67%; }
.ox-home .ox-buffer i { position: absolute; left: 50%; top: 9px; width: 8px; height: 8px; transform: translateX(-50%); border-radius: 50%; background: #d9793b; box-shadow: 0 0 0 4px rgba(217,121,59,.12); }
.ox-home .ox-buffer b { position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%); color: #28737d; font-size: .56rem; }
.ox-home .ox-multi-buffer > small { display: block; color: #73878f; font-size: .52rem; line-height: 1.35; }

.ox-home .ox-multi-demand { position: absolute; z-index: 3; right: 2.7%; top: 166px; width: 210px; padding: 17px 15px; border: 1px solid #cbdfe0; border-radius: 18px; background: rgba(255,255,255,.97); box-shadow: 0 12px 30px rgba(20,66,80,.08); text-align: center; }
.ox-home .ox-multi-demand__icon { width: 74px; height: 64px; margin: 0 auto 8px; color: #3e6977; }
.ox-home .ox-multi-demand__icon svg path { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ox-home .ox-multi-demand__icon svg .ox-svg-accent { stroke: #159892; }
.ox-home .ox-multi-demand small { display: block; color: #15938f; font-size: .51rem; font-weight: 780; letter-spacing: .08em; text-transform: uppercase; }
.ox-home .ox-multi-demand strong { display: block; margin-top: 2px; color: #24475a; font-size: .81rem; }
.ox-home .ox-multi-demand em { display: block; margin-top: 3px; color: #748891; font-size: .54rem; font-style: normal; }

.ox-home .ox-multi-legend { min-height: 48px; padding: 12px 4px 0; display: flex; align-items: center; gap: 22px; color: #73858d; font-size: .59rem; }
.ox-home .ox-multi-legend span { display: inline-flex; align-items: center; gap: 7px; }
.ox-home .ox-multi-legend i { width: 26px; height: 3px; border-radius: 3px; }
.ox-home .ox-multi-legend__heat { background: #d88443; }
.ox-home .ox-multi-legend__control { background: #087f8d; }
.ox-home .ox-multi-legend strong { margin-left: auto; color: #245064; font-size: .67rem; }

/* Rechtliche Joomla-Inhalte direkt im Workspace + Footer-Navigation. */
.ox-home .ox-workspace__panel--legal { padding:0; background:#fff; }
.ox-home .ox-legal { min-height:420px; padding:clamp(26px,4vw,54px); background:#fff; }
.ox-home .ox-legal__article { max-width:920px; margin:0 auto; }
.ox-home .ox-legal__article[hidden] { display:none !important; }
.ox-home .ox-legal__eyebrow { margin:0 0 7px; color:#087f8d; font-size:.66rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.ox-home .ox-legal__article h3 { margin:0 0 24px; color:#173b50; font-size:clamp(1.55rem,3vw,2.25rem); line-height:1.15; }
.ox-home .ox-legal__content { color:#355866; font-size:.93rem; line-height:1.7; }
.ox-home .ox-legal__content h1,
.ox-home .ox-legal__content h2,
.ox-home .ox-legal__content h3,
.ox-home .ox-legal__content h4 { margin:1.55em 0 .55em; color:#244d5e; line-height:1.25; }
.ox-home .ox-legal__content p { margin:.75em 0; }
.ox-home .ox-legal__content a { color:#087f8d; text-decoration:underline; text-underline-offset:2px; }
.ox-home .ox-legal__missing { padding:18px 20px; border:1px solid #e0e8ea; border-radius:14px; background:#f8fbfb; color:#71858e; }

.ox-home .ox-footer { padding-block: 34px; border-top: 1px solid #d6e2e3; background: #101c20; color: #aebbbd; }
.ox-home .ox-footer__inner { display: flex; align-items: center; justify-content: center; }
.ox-home .ox-footer nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 32px; }
.ox-home .ox-footer nav button { padding:0; border:0; background:transparent; color:#c0cbcc; font:inherit; font-size:.72rem; letter-spacing:.04em; cursor:pointer; }
.ox-home .ox-footer nav button:hover,
.ox-home .ox-footer nav button:focus-visible { color:#fff; text-decoration:underline; text-underline-offset:3px; outline:none; }

@media (max-width: 1100px) {
  .ox-home { --ox-shell: min(100% - 48px,1040px); --ox-workspace-shell: min(100% - 30px,1080px); }
  .ox-home .ox-header__inner { min-height: 74px; }
  .ox-home .ox-brand__image { height: 50px; }
  .ox-home .ox-nav { gap: 12px 18px; }
  .ox-home .ox-hero { padding-bottom: 66px; }
  .ox-home .ox-hero__grid { grid-template-columns: 1fr; min-height: auto; padding-block: 42px 82px; gap: 34px; }
  .ox-home .ox-hero__copy { max-width: 820px; }
  .ox-home .ox-hero-visual { width: min(760px,100%); margin-inline: auto; }
  .ox-home .ox-entry__grid,.ox-home .ox-entry__grid--system { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ox-home .ox-architecture { grid-template-columns: 1fr; gap: 14px; padding: 22px; }
  .ox-home .ox-architecture__arrow { transform: rotate(90deg); justify-self: center; }
  .ox-home .ox-interface-node { width: min(220px,100%); min-height: 120px; margin-inline: auto; }
  .ox-home .ox-architecture-core { width: min(460px,100%); margin-inline: auto; }
  .ox-home .ox-architecture__footer { flex-wrap: wrap; text-align: center; }
  .ox-home .ox-example-flow { grid-template-columns: 1fr 34px 1fr; }
  .ox-home .ox-example-output { grid-column: 1 / -1; width: min(520px,100%); margin-inline: auto; }
  .ox-home .ox-example-flow > .ox-example-link:nth-of-type(2) { display: none; }
  .ox-home .ox-multivalent__statement { margin-left: 0; }
  .ox-home .ox-multi-card__head { grid-template-columns: 1fr; gap: 12px; }
  .ox-home .ox-multi-stage { min-height: 760px; }
  .ox-home .ox-multi-stage__lines { display: none; }
  .ox-home .ox-multi-control { top: 18px; }
  .ox-home .ox-multi-source { left: 4%; width: 43%; }
  .ox-home .ox-multi-source--oil { top: 130px; }
  .ox-home .ox-multi-source--wood { top: 230px; }
  .ox-home .ox-multi-source--power { top: 330px; }
  .ox-home .ox-multi-buffer { left: auto; right: 4%; top: 145px; transform: none; width: 43%; }
  .ox-home .ox-multi-demand { right: 4%; top: 505px; width: 43%; }
  .ox-home .ox-multi-legend { flex-wrap: wrap; }
  .ox-home .ox-multi-legend strong { width: 100%; margin-left: 0; }
}

@media (max-width: 780px) {
  .ox-home { --ox-shell: min(100% - 36px,680px); --ox-workspace-shell: calc(100% - 24px); }
  .ox-home .ox-header__inner { min-height: 68px; gap: 18px; }
  .ox-home .ox-brand__image { height: 46px; }
  .ox-home .ox-nav { gap: 5px 14px; flex-wrap: wrap; font-size: .74rem; }
  .ox-home .ox-nav__actions { max-width: 100%; }
  .ox-home .ox-nav__user { max-width: 170px; }
  .ox-home .ox-hero__grid { padding-block: 42px 74px; gap: 32px; }
  .ox-home .ox-hero h1 { font-size: clamp(2.7rem,10.5vw,4.25rem); }
  .ox-home .ox-hero-visual__stage { min-height: 470px; grid-template-columns: 1fr 180px 1fr; gap: 16px; }
  .ox-home .ox-visual-core { width: 180px; height: 180px; }
  .ox-home .ox-visual-chip { min-height: 57px; padding: 9px 8px 9px 30px; }
  .ox-home .ox-visual-chip i { left: 11px; top: 19px; width: 9px; height: 9px; }
  .ox-home .ox-visual-chip small { display: none; }
  .ox-home .ox-entry { margin-top: -52px; background: transparent; }
  .ox-home .ox-entry__topline { align-items: flex-end; }
  .ox-home .ox-entry__grid,.ox-home .ox-entry__grid--system { grid-template-columns: 1fr; }
  .ox-home .ox-entry-card { min-height: 148px; }
  .ox-home .ox-section-head { grid-template-columns: 1fr; gap: 22px; }
  .ox-home .ox-architecture { grid-template-columns: 1fr; gap: 14px; padding: 20px; }
  .ox-home .ox-architecture__arrow { transform: rotate(90deg); justify-self: center; }
  .ox-home .ox-interface-node { width: min(220px,100%); min-height: 120px; margin-inline: auto; }
  .ox-home .ox-architecture-core { width: min(420px,100%); margin-inline: auto; }
  .ox-home .ox-architecture__footer { flex-wrap: wrap; text-align: center; }
  .ox-home .ox-example-flow { grid-template-columns: 1fr; gap: 15px; }
  .ox-home .ox-example-link { transform: rotate(90deg); }
  .ox-home .ox-example-output { grid-column: auto; width: 100%; }
  .ox-home .ox-example-flow > .ox-example-link:nth-of-type(2) { display: grid; }
  .ox-home .ox-multivalent { padding-block: 74px 88px; }
  .ox-home .ox-multi-card { padding: 20px; border-radius: 22px; }
  .ox-home .ox-multi-stage { min-height: 900px; }
  .ox-home .ox-multi-control { min-width: 0; width: calc(100% - 32px); }
  .ox-home .ox-multi-source,.ox-home .ox-multi-buffer,.ox-home .ox-multi-demand { position: absolute; left: 16px; right: 16px; width: auto; }
  .ox-home .ox-multi-source--oil { top: 118px; }
  .ox-home .ox-multi-source--wood { top: 216px; }
  .ox-home .ox-multi-source--power { top: 314px; }
  .ox-home .ox-multi-buffer { top: 420px; transform: none; }
  .ox-home .ox-multi-demand { top: 718px; }
}

@media (max-width: 620px) {
  .ox-home .ox-header__inner { min-height: 64px; }
  .ox-home .ox-brand__image { height: 42px; }
  .ox-home .ox-nav > a { display: none; }
  .ox-home .ox-nav__user { max-width: 150px; padding: 7px 9px; }
  .ox-home .ox-nav__user small { display: none; }
  .ox-home .ox-hero { padding-bottom: 56px; }
  .ox-home .ox-hero__grid { padding-top: 34px; }
  .ox-home .ox-hero h1 { font-size: clamp(2.55rem,12.4vw,3.75rem); }
  .ox-home .ox-lead { margin-top: 23px; }
  .ox-home .ox-hero__proof { margin-top: 22px; }
  .ox-home .ox-hero-visual { min-height: 520px; }
  .ox-home .ox-hero-visual__stage { min-height: 500px; grid-template-columns: 1fr 1fr; grid-template-rows: 190px auto; align-items: start; gap: 16px 12px; }
  .ox-home .ox-visual-core { grid-column: 1 / -1; grid-row: 1; justify-self: center; width: 166px; height: 166px; }
  .ox-home .ox-visual-core__orbit { inset: -24px; }
  .ox-home .ox-visual-core__database { width: 55px; }
  .ox-home .ox-visual-stack { grid-row: 2; gap: 8px; }
  .ox-home .ox-visual-stack--input { grid-column: 1; }
  .ox-home .ox-visual-stack--output { grid-column: 2; }
  .ox-home .ox-visual-chip { min-height: 54px; padding: 8px 7px 8px 29px; font-size: .66rem; }
  .ox-home .ox-hero-visual__connectors { display: none; }
  .ox-home .ox-hero-visual__caption { bottom: 4px; max-width: 94%; text-align: center; white-space: normal; }
  .ox-home .ox-entry__topline { display: block; margin-bottom: 15px; }
  .ox-home .ox-entry__topline p:last-child { margin-top: 4px; text-align: left; text-transform: none; letter-spacing: 0; }
}

@media (max-width: 540px) {
  .ox-home .ox-account__context-summary { align-items: flex-start; flex-direction: column; gap: 4px; }
  .ox-home .ox-account__masquerade dl div { align-items: flex-start; flex-direction: column; gap: 3px; }
  .ox-home .ox-knowledge__filter { grid-template-columns: 22px minmax(0,1fr) 28px; }
  .ox-home { --ox-shell: calc(100% - 28px); --ox-workspace-shell: calc(100% - 18px); }
  .ox-home .ox-entry-card { min-height: 144px; padding: 19px; grid-template-columns: 52px 1fr; }.ox-home .ox-entry-card__icon { width: 52px; height: 52px; }
  .ox-home .ox-entry-card__icon svg { width: 29px; height: 29px; }
  .ox-home .ox-device-grid { grid-template-columns: 1fr; }
  .ox-home .ox-architecture__footer { display: none; }
  .ox-home .ox-multivalent__statement { padding: 17px 18px; }
  .ox-home .ox-multi-card { padding: 16px; }
  .ox-home .ox-multi-card__head p { font-size: .7rem; }
  .ox-home .ox-multi-stage { min-height: 915px; }
  .ox-home .ox-multi-source { grid-template-columns: 45px 1fr; }
  .ox-home .ox-multi-source__icon { width: 43px; height: 43px; }
  .ox-home .ox-footer nav { gap: 8px 20px; }
}


@media (max-width: 780px) {
  .ox-home .ox-workspace { scroll-margin-top: 76px; padding: 18px 0 48px; }
  .ox-home .ox-workspace__bar { align-items: flex-start; flex-direction: column; gap: 10px; margin-bottom: 10px; }
  .ox-home .ox-workspace__actions { width: 100%; justify-content: space-between; }
  .ox-home .ox-workspace__frame-wrap { border-radius: 15px; }
  .ox-home .ox-workspace__frame--hydraulics { height: 520px; }
  .ox-home .ox-workspace__frame--monitoring { height: 72vh; min-height: 580px; }
  .ox-home .ox-login { min-height: 0; padding: 30px 22px; grid-template-columns: 1fr; gap: 28px; }
  .ox-home .ox-login__intro { align-items: flex-start; }
  .ox-home .ox-login__mark { width: 68px; height: 68px; border-radius: 19px; }
  .ox-home .ox-login__mark svg { width: 44px; height: 44px; }
  .ox-home .ox-login__form { padding: 19px; }
  .ox-home .ox-account { min-height: 0; padding: 30px 22px; grid-template-columns: 1fr; gap: 28px; }
  .ox-home .ox-account__identity { align-items: flex-start; }
  .ox-home .ox-account__mark { width: 66px; height: 66px; border-radius: 19px; }
  .ox-home .ox-account__mark svg { width: 42px; height: 42px; }
  .ox-home .ox-account__actions { min-width: 0; }
  .ox-home .ox-account__masquerade { padding: 20px; grid-template-columns: 1fr; gap: 22px; }
  .ox-home .ox-account__masquerade-select { grid-template-columns: 1fr; }
  .ox-home .ox-account__masquerade-select .ox-account__button { width: 100%; }
  .ox-home .ox-knowledge__tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ox-home .ox-knowledge__layout { height: auto; min-height: 0; grid-template-columns: 1fr; }
  .ox-home .ox-knowledge__nav { height: 360px; min-height: 0; border-right: 0; border-bottom: 1px solid #dbe5e7; }
  .ox-home .ox-knowledge__list { max-height: none; overflow: visible; }
  .ox-home .ox-knowledge__reader { height: 620px; min-height: 0; }
  .ox-home .ox-knowledge__frame { height: 100%; min-height: 0; }
}

@media (max-width: 540px) {
  .ox-home .ox-workspace__actions { align-items: stretch; flex-direction: column; }
  .ox-home .ox-workspace__external,.ox-home .ox-workspace__fullscreen,.ox-home .ox-workspace__close { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .ox-home *, .ox-home *::before, .ox-home *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* ============================================================
 * V9.4: nach Login Arbeitsoberfläche statt Präsentationsseite
 * ============================================================ */
.ox-home.ox-home--user .ox-intro {
  background: #f4f8f8;
}

.ox-home.ox-home--user .ox-intro::before {
  display: none;
}

.ox-home.ox-home--user .ox-entry {
  margin-top: 0;
  padding: clamp(34px,4vw,54px) 0 clamp(38px,4.5vw,62px);
}

.ox-home.ox-home--user .ox-entry__topline {
  margin-bottom: 13px;
}

@media (max-width: 780px) {
  .ox-home.ox-home--user .ox-entry {
    margin-top: 0;
    padding-top: 28px;
  }
}


/* ============================================================
 * V9.5 – Arbeitsmodus: größere Hauptkacheln + Anlagenstatus
 * ============================================================ */
.ox-home.ox-home--user .ox-entry { margin-top:0; padding:34px 0 34px; }
.ox-home.ox-home--user .ox-entry__topline { margin-bottom:14px; }
.ox-home.ox-home--user .ox-entry__grid { gap:20px; }
.ox-home.ox-home--user .ox-entry-card { min-height:194px; padding:27px 25px 22px; grid-template-columns:72px 1fr; column-gap:20px; border-radius:22px; box-shadow:0 18px 44px rgba(22,63,80,.105); }
.ox-home.ox-home--user .ox-entry-card__icon { width:70px; height:70px; border-radius:19px; }
.ox-home.ox-home--user .ox-entry-card__icon svg { width:38px; height:38px; }
.ox-home.ox-home--user .ox-entry-card__kicker { padding:3px 8px; font-size:.62rem; }
.ox-home.ox-home--user .ox-entry-card strong { margin-top:7px; font-size:1.25rem; }
.ox-home.ox-home--user .ox-entry-card small { margin-top:8px; font-size:.78rem; line-height:1.42; }
.ox-home.ox-home--user .ox-entry-card__arrow { width:34px; height:34px; }

.ox-home.ox-home--user .ox-workspace { padding-top:24px; }
.ox-home .ox-workspace[data-ox-app="overview"] .ox-workspace__close,
.ox-home .ox-workspace[data-ox-app="overview"] .ox-workspace__external,
.ox-home .ox-workspace[data-ox-app="overview"] .ox-workspace__fullscreen { display:none !important; }
.ox-home .ox-workspace[data-ox-app="overview"] .ox-workspace__frame-wrap { overflow:visible; }
.ox-home .ox-workspace__panel--overview { background:transparent; }

.ox-home .ox-overview { padding:30px; background:#fff; }
.ox-home .ox-overview__hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,430px); align-items:center; gap:32px; padding:6px 6px 28px; border-bottom:1px solid #dce8ea; }
.ox-home .ox-overview__eyebrow { margin:0 0 5px; color:var(--ox-accent); font-size:.65rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.ox-home .ox-overview__hero h3 { margin:0; color:#15364a; font-size:clamp(1.55rem,2.2vw,2.2rem); letter-spacing:-.035em; }
.ox-home .ox-overview__hero > div:first-child > p:last-child { max-width:720px; margin:8px 0 0; color:#657b87; font-size:.86rem; line-height:1.55; }
.ox-home .ox-overview__health { display:grid; grid-template-columns:18px 1fr; gap:13px; align-items:start; min-height:112px; padding:20px 22px; border:1px solid #d8e5e7; border-radius:18px; background:#f7fafb; }
.ox-home .ox-overview__health-dot { width:14px; height:14px; margin-top:5px; border-radius:50%; background:#93a4ab; box-shadow:0 0 0 5px rgba(147,164,171,.13); }
.ox-home .ox-overview__health small { display:block; color:#71858e; font-size:.62rem; font-weight:780; letter-spacing:.11em; text-transform:uppercase; }
.ox-home .ox-overview__health strong { display:block; margin-top:3px; color:#23485a; font-size:1.15rem; }
.ox-home .ox-overview__health span:last-child { display:block; margin-top:5px; color:#6a7e87; font-size:.76rem; line-height:1.4; }
.ox-home .ox-overview__health--healthy { border-color:#b9ded1; background:#f1faf6; }
.ox-home .ox-overview__health--healthy .ox-overview__health-dot { background:#2f9e73; box-shadow:0 0 0 5px rgba(47,158,115,.13); }
.ox-home .ox-overview__health--healthy strong { color:#247b5c; }
.ox-home .ox-overview__health--warning { border-color:#ead9ad; background:#fffaf0; }
.ox-home .ox-overview__health--warning .ox-overview__health-dot { background:#c38a20; box-shadow:0 0 0 5px rgba(195,138,32,.13); }
.ox-home .ox-overview__health--warning strong { color:#986919; }
.ox-home .ox-overview__health--alert { border-color:#ecc8c2; background:#fff6f4; }
.ox-home .ox-overview__health--alert .ox-overview__health-dot { background:#c65b4d; box-shadow:0 0 0 5px rgba(198,91,77,.13); }
.ox-home .ox-overview__health--alert strong { color:#a54539; }

.ox-home .ox-overview__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; padding:24px 6px 4px; }
.ox-home .ox-overview-card { position:relative; min-height:142px; padding:20px; display:grid; grid-template-columns:50px 1fr; gap:15px; align-items:start; border:1px solid #d8e5e7; border-radius:17px; background:#fbfdfd; color:inherit; text-align:left; font:inherit; }
.ox-home button.ox-overview-card { cursor:pointer; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.ox-home button.ox-overview-card:hover { transform:translateY(-3px); border-color:#7fb8bf; background:#fff; box-shadow:0 13px 28px rgba(22,63,80,.1); }
.ox-home .ox-overview-card__icon { width:48px; height:48px; display:grid; place-items:center; border-radius:14px; background:#eef7f7; color:#087f8d; }
.ox-home .ox-overview-card__icon svg { width:27px; height:27px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.ox-home .ox-overview-card small { display:block; color:#73868f; font-size:.59rem; font-weight:790; letter-spacing:.1em; text-transform:uppercase; }
.ox-home .ox-overview-card strong { display:block; margin-top:4px; overflow-wrap:anywhere; color:#1d4052; font-size:1rem; line-height:1.25; }
.ox-home .ox-overview-card span:not(.ox-overview-card__icon) { display:block; margin-top:7px; color:#70828a; font-size:.7rem; line-height:1.4; }
.ox-home .ox-overview-card--action { padding-right:42px; }
.ox-home .ox-overview-card--action > i { position:absolute; right:18px; bottom:17px; width:28px; height:28px; display:grid; place-items:center; border:1px solid #bdd5d8; border-radius:50%; color:#087f8d; font-style:normal; }
.ox-home .ox-overview-card--measurement .ox-overview-card__icon { background:#f1f7f4; color:#4b9f8a; }

.ox-home .ox-overview__foot { margin:22px 6px 0; padding-top:17px; border-top:1px solid #e0e9ea; display:flex; align-items:center; justify-content:space-between; gap:20px; color:#74868e; font-size:.7rem; }
.ox-home .ox-overview__foot button { flex:0 0 auto; min-height:36px; padding:7px 13px; border:1px solid #b9d1d5; border-radius:9px; background:#fff; color:#31586a; font:inherit; font-size:.69rem; font-weight:730; cursor:pointer; }
.ox-home .ox-overview__foot button:hover { border-color:#58a8b0; color:#087985; }

@media (max-width:1180px) {
  .ox-home.ox-home--user .ox-entry__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ox-home.ox-home--user .ox-entry-card:last-child { grid-column:auto; }
  .ox-home .ox-overview__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .ox-home.ox-home--user .ox-entry { padding-top:24px; }
  .ox-home.ox-home--user .ox-entry__grid { grid-template-columns:1fr; gap:13px; }
  .ox-home.ox-home--user .ox-entry-card { min-height:158px; padding:21px; grid-template-columns:60px 1fr; }
  .ox-home.ox-home--user .ox-entry-card__icon { width:58px; height:58px; }
  .ox-home.ox-home--user .ox-entry-card__icon svg { width:32px; height:32px; }
  .ox-home .ox-overview { padding:20px 16px; }
  .ox-home .ox-overview__hero { grid-template-columns:1fr; gap:20px; padding:2px 2px 22px; }
  .ox-home .ox-overview__grid { grid-template-columns:1fr; padding-inline:2px; }
  .ox-home .ox-overview__foot { margin-inline:2px; align-items:flex-start; flex-direction:column; }
}


/* ============================================================
   V9.6 – Unit-Dashboard / persönliche Startseite
   ============================================================ */
.ox-home .ox-overview__summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:24px 6px 4px}
.ox-home .ox-dashboard-toolbar{margin:28px 6px 0;padding:20px 0 15px;border-top:1px solid #dce8ea;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.ox-home .ox-dashboard-toolbar>div:first-child strong{display:block;color:#1c4052;font-size:1.02rem}.ox-home .ox-dashboard-toolbar>div:first-child span{display:block;margin-top:4px;color:#71848d;font-size:.72rem}.ox-home .ox-dashboard-toolbar code{font-size:.68rem;color:#087f8d}
.ox-home .ox-dashboard-toolbar__actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}.ox-home .ox-dashboard-toolbar button,.ox-home .ox-dashboard-config__foot button{min-height:38px;padding:8px 14px;border:1px solid #b9d1d5;border-radius:10px;background:#fff;color:#31586a;font:inherit;font-size:.7rem;font-weight:750;cursor:pointer}.ox-home .ox-dashboard-toolbar button:hover,.ox-home .ox-dashboard-config__foot button:hover{border-color:#58a8b0;color:#087985}
.ox-home .ox-dashboard-message{margin:14px 6px;padding:24px;border:1px dashed #c9dadd;border-radius:15px;background:#f8fbfb;color:#6d818a;text-align:center;font-size:.76rem}
.ox-home .ox-unit-grid{margin:10px 6px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.ox-home .ox-unit-card{overflow:hidden;border:1px solid #d7e4e6;border-radius:18px;background:#fff;box-shadow:0 9px 26px rgba(21,62,77,.055)}
.ox-home .ox-unit-card>header{padding:17px 19px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#f8fbfb;border-bottom:1px solid #e1eaeb}.ox-home .ox-unit-card>header>div>small{display:block;color:#72868f;font-size:.59rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.ox-home .ox-unit-card>header>div>strong{display:block;margin-top:3px;color:#1e4254;font-size:.92rem;line-height:1.25}
.ox-home .ox-unit-state{display:grid;grid-template-columns:9px auto;align-items:center;column-gap:7px;min-width:145px}.ox-home .ox-unit-state i{width:9px;height:9px;border-radius:50%;background:#94a5ac;box-shadow:0 0 0 4px rgba(148,165,172,.13)}.ox-home .ox-unit-state b{color:#596f78;font-size:.68rem}.ox-home .ox-unit-state small{grid-column:2;color:#83949b;font-size:.59rem}
.ox-home .ox-unit-card--healthy .ox-unit-state i{background:#2f9e73;box-shadow:0 0 0 4px rgba(47,158,115,.12)}.ox-home .ox-unit-card--healthy .ox-unit-state b{color:#247b5c}.ox-home .ox-unit-card--alert{border-color:#e6bbb5}.ox-home .ox-unit-card--alert>header{background:#fff6f4}.ox-home .ox-unit-card--alert .ox-unit-state i{background:#c65b4d;box-shadow:0 0 0 4px rgba(198,91,77,.12)}.ox-home .ox-unit-card--alert .ox-unit-state b{color:#a54539}
.ox-home .ox-unit-values{padding:8px 19px 12px}.ox-home .ox-unit-value{min-height:48px;padding:9px 0;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid #edf2f2}.ox-home .ox-unit-value:last-child{border-bottom:0}.ox-home .ox-unit-value>span{min-width:0}.ox-home .ox-unit-value strong{display:block;color:#345562;font-size:.72rem;font-weight:720}.ox-home .ox-unit-value small{display:block;margin-top:2px;overflow:hidden;text-overflow:ellipsis;color:#8a989d;font-size:.56rem;white-space:nowrap}.ox-home .ox-unit-value em{flex:0 0 auto;color:#123d51;font-size:.9rem;font-style:normal;font-weight:780;text-align:right}.ox-home .ox-unit-empty{padding:18px 0;color:#87969c;font-size:.68rem}
.ox-home .ox-unit-card>footer{padding:9px 19px;background:#fbfcfc;border-top:1px solid #edf2f2;color:#86959b;font-size:.57rem}
.ox-home .ox-dashboard-config{margin:28px 6px 4px;border:1px solid #bcd5d8;border-radius:18px;background:#f9fcfc;box-shadow:0 18px 42px rgba(20,61,76,.09);overflow:hidden}.ox-home .ox-dashboard-config__head{padding:20px 22px;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;background:#eef7f7;border-bottom:1px solid #d3e4e5}.ox-home .ox-dashboard-config__head small{display:block;color:#087f8d;font-size:.58rem;font-weight:820;letter-spacing:.12em;text-transform:uppercase}.ox-home .ox-dashboard-config__head strong{display:block;margin-top:3px;color:#183d50;font-size:1.04rem}.ox-home .ox-dashboard-config__head span{display:block;margin-top:5px;color:#6f828b;font-size:.68rem}.ox-home .ox-dashboard-config__head>button{border:0;background:transparent;color:#617882;font-size:1.5rem;cursor:pointer}.ox-home .ox-dashboard-config__body{max-height:520px;padding:16px 22px;overflow:auto}.ox-home .ox-dashboard-config-unit{padding:12px 0 16px;border-bottom:1px solid #dfe9ea}.ox-home .ox-dashboard-config-unit:last-child{border-bottom:0}.ox-home .ox-dashboard-config-unit__toggle,.ox-home .ox-dashboard-config-value{display:flex;gap:10px;align-items:flex-start;cursor:pointer}.ox-home .ox-dashboard-config-unit__toggle input,.ox-home .ox-dashboard-config-value input{margin-top:3px;accent-color:#0b8c91}.ox-home .ox-dashboard-config-unit__toggle strong{display:block;color:#244b5b;font-size:.76rem}.ox-home .ox-dashboard-config-unit__toggle small{display:block;color:#83949a;font-size:.59rem}.ox-home .ox-dashboard-config-unit>div{margin:10px 0 0 27px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 18px}.ox-home .ox-dashboard-config-value{padding:6px 8px;border-radius:8px}.ox-home .ox-dashboard-config-value:hover{background:#f0f7f7}.ox-home .ox-dashboard-config-value strong{display:block;color:#4d6670;font-size:.66rem}.ox-home .ox-dashboard-config-value small{display:block;color:#91a0a5;font-size:.54rem}.ox-home .ox-dashboard-config__foot{padding:14px 22px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;background:#fff;border-top:1px solid #dce7e8}.ox-home .ox-dashboard-config__foot>span{text-align:right;color:#65808a;font-size:.64rem}.ox-home .ox-dashboard-config__save{background:#087f8d!important;border-color:#087f8d!important;color:#fff!important}
@media(max-width:1050px){.ox-home .ox-overview__summary{grid-template-columns:repeat(2,minmax(0,1fr))}.ox-home .ox-unit-grid{grid-template-columns:1fr}}
@media(max-width:720px){.ox-home .ox-overview__summary{grid-template-columns:1fr;padding-inline:2px}.ox-home .ox-dashboard-toolbar{margin-inline:2px;align-items:flex-start;flex-direction:column}.ox-home .ox-dashboard-toolbar__actions{justify-content:flex-start}.ox-home .ox-unit-grid{margin-inline:2px}.ox-home .ox-unit-card>header{align-items:flex-start;flex-direction:column}.ox-home .ox-dashboard-config{margin-inline:2px}.ox-home .ox-dashboard-config-unit>div{grid-template-columns:1fr}.ox-home .ox-dashboard-config__foot{grid-template-columns:1fr}.ox-home .ox-dashboard-config__foot>span{text-align:left}}

/* ==========================================================================\n * V9.7 – Anlagenstatus auf vollständiger Geräte-/Unit-Basis\n * ========================================================================== */
.ox-home .ox-entry-card--status .ox-entry-card__icon{background:var(--card-tint);color:var(--card-accent)}
.ox-home .ox-entry-card--status .ox-entry-card__icon .ox-icon-accent{fill:var(--card-accent);stroke:var(--card-accent)}
.ox-home .ox-status{padding:clamp(22px,3vw,38px);background:#fff}
.ox-home .ox-status__toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;padding:0 2px 18px;border-bottom:1px solid #dde8ea}
.ox-home .ox-status__eyebrow{margin:0 0 5px;color:#0b858d;font-size:.59rem;font-weight:820;letter-spacing:.13em;text-transform:uppercase}
.ox-home .ox-status__toolbar h3{margin:0;color:#173e51;font-size:clamp(1.35rem,2.2vw,1.9rem);line-height:1.1;letter-spacing:-.025em}
.ox-home .ox-status__toolbar p:last-child{max-width:780px;margin:8px 0 0;color:#70838c;font-size:.72rem;line-height:1.55}
.ox-home .ox-status__actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:9px}
.ox-home .ox-status__actions button,.ox-home .ox-status__back{min-height:38px;padding:8px 14px;border:1px solid #b9d1d5;border-radius:10px;background:#fff;color:#31586a;font:inherit;font-size:.7rem;font-weight:750;cursor:pointer;transition:border-color .18s ease,color .18s ease,background .18s ease}
.ox-home .ox-status__actions button:hover,.ox-home .ox-status__back:hover{border-color:#58a8b0;background:#f9fcfc;color:#087985}
.ox-home .ox-status__context{display:flex;align-items:center;gap:9px;margin:15px 2px 0;color:#7b8d94;font-size:.64rem}
.ox-home .ox-status__context strong{color:#315a6a;font-size:.72rem}.ox-home .ox-status__context em{padding:3px 8px;border-radius:999px;background:#eef7f6;color:#087f8d;font-size:.58rem;font-style:normal;font-weight:760}
.ox-home .ox-status__level{margin-top:16px}.ox-home .ox-unit-list{border-top:1px solid #dce7e9}
.ox-home .ox-unit-row{width:100%;min-height:76px;padding:13px 10px;display:grid;grid-template-columns:24px minmax(220px,1fr) minmax(210px,.75fr) 28px;align-items:center;gap:12px;border:0;border-bottom:1px solid #e3ebec;background:#fff;color:inherit;text-align:left;font:inherit;cursor:pointer;transition:background .16s ease,transform .16s ease}
.ox-home .ox-unit-row:hover{background:#f7fbfb}.ox-home .ox-unit-row__state{display:grid;place-items:center}.ox-home .ox-unit-row__state i,.ox-home .ox-device-row__state i,.ox-home .ox-status-detail__state i{display:block;width:10px;height:10px;border-radius:50%;background:#95a7ae;box-shadow:0 0 0 4px rgba(149,167,174,.12)}
.ox-home .ox-unit-row--healthy .ox-unit-row__state i,.ox-home .ox-device-row--healthy .ox-device-row__state i,.ox-home .ox-status-detail__state--healthy i{background:#2f9e73;box-shadow:0 0 0 4px rgba(47,158,115,.12)}
.ox-home .ox-unit-row--alert .ox-unit-row__state i,.ox-home .ox-device-row--alert .ox-device-row__state i,.ox-home .ox-status-detail__state--alert i{background:#c65b4d;box-shadow:0 0 0 4px rgba(198,91,77,.12)}
.ox-home .ox-unit-row__identity small{display:block;color:#85969c;font-size:.56rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.ox-home .ox-unit-row__identity strong{display:block;margin-top:3px;color:#244b5b;font-size:.82rem;line-height:1.3}
.ox-home .ox-unit-row__meta{text-align:right}.ox-home .ox-unit-row__meta strong{display:block;color:#45616d;font-size:.7rem}.ox-home .ox-unit-row--healthy .ox-unit-row__meta strong{color:#247b5c}.ox-home .ox-unit-row--alert .ox-unit-row__meta strong{color:#a54539}.ox-home .ox-unit-row__meta small{display:block;margin-top:3px;color:#84959b;font-size:.58rem}
.ox-home .ox-unit-row__arrow{color:#7e979f;font-size:1.15rem;text-align:center}
.ox-home .ox-status__back{margin:0 0 16px;padding-inline:12px}
.ox-home .ox-status-detail__head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 2px;border-top:1px solid #dce7e9;border-bottom:1px solid #dce7e9}.ox-home .ox-status-detail__head>div small{display:block;color:#85969c;font-size:.56rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.ox-home .ox-status-detail__head>div strong{display:block;margin-top:3px;color:#1e4658;font-size:1rem}
.ox-home .ox-status-detail__state{display:grid;grid-template-columns:10px auto;align-items:center;column-gap:9px;text-align:right}.ox-home .ox-status-detail__state b{color:#4e6873;font-size:.7rem}.ox-home .ox-status-detail__state small{grid-column:2;color:#87979d;font-size:.58rem}.ox-home .ox-status-detail__state--healthy b{color:#247b5c}.ox-home .ox-status-detail__state--alert b{color:#a54539}
.ox-home .ox-device-list{border-bottom:1px solid #dce7e9}.ox-home .ox-device-row{min-height:68px;padding:11px 8px;display:grid;grid-template-columns:22px minmax(220px,1fr) minmax(120px,.35fr) minmax(190px,.55fr);align-items:center;gap:12px;border-bottom:1px solid #edf2f2}.ox-home .ox-device-row:last-child{border-bottom:0}.ox-home .ox-device-row__state{display:grid;place-items:center}.ox-home .ox-device-row__identity strong{display:block;color:#345562;font-size:.72rem}.ox-home .ox-device-row__identity small{display:block;margin-top:2px;color:#8a999f;font-size:.56rem}.ox-home .ox-device-row__value{color:#123d51;font-size:.86rem;font-weight:780;text-align:right}.ox-home .ox-device-row__time{text-align:right}.ox-home .ox-device-row__time strong{display:block;color:#5f7882;font-size:.64rem}.ox-home .ox-device-row--healthy .ox-device-row__time strong{color:#247b5c}.ox-home .ox-device-row--alert .ox-device-row__time strong{color:#a54539}.ox-home .ox-device-row__time small{display:block;margin-top:2px;color:#929fa4;font-size:.54rem}
.ox-home .ox-dashboard-config-empty{color:#89999f;font-size:.62rem}
@media(max-width:800px){.ox-home .ox-status__toolbar{align-items:flex-start;flex-direction:column}.ox-home .ox-status__actions{justify-content:flex-start}.ox-home .ox-unit-row{grid-template-columns:22px minmax(0,1fr) 24px}.ox-home .ox-unit-row__meta{grid-column:2;text-align:left}.ox-home .ox-unit-row__arrow{grid-column:3;grid-row:1/3}.ox-home .ox-device-row{grid-template-columns:20px minmax(0,1fr) auto}.ox-home .ox-device-row__value{grid-column:3;grid-row:1}.ox-home .ox-device-row__time{grid-column:2/4;text-align:left}.ox-home .ox-status-detail__head{align-items:flex-start;flex-direction:column}.ox-home .ox-status-detail__state{text-align:left}}
@media(max-width:520px){.ox-home .ox-status{padding:18px 14px}.ox-home .ox-status__actions{width:100%}.ox-home .ox-status__actions button{flex:1}.ox-home .ox-unit-row{padding-inline:4px}.ox-home .ox-device-row{grid-template-columns:18px minmax(0,1fr)}.ox-home .ox-device-row__value,.ox-home .ox-device-row__time{grid-column:2;text-align:left}.ox-home .ox-device-row__value{grid-row:auto;margin-top:3px}}


/* ========================================================================== 
   V9.8 – Anlagenstatus: Gesamtanalyse + Master/Detail + Konfigurationsauswahl
   ========================================================================== */
.ox-home .ox-status-summary{margin:18px 2px 20px;padding:16px 18px;display:grid;grid-template-columns:minmax(240px,1.2fr) minmax(280px,1.45fr) minmax(280px,1fr);gap:18px;align-items:stretch;border:1px solid #d9e6e8;border-radius:16px;background:#f9fcfc}
.ox-home .ox-status-context,.ox-home .ox-status-overall,.ox-home .ox-status-counts{min-width:0}
.ox-home .ox-status-context{display:flex;flex-wrap:wrap;align-content:center;align-items:center;gap:6px 9px;padding:4px 0}
.ox-home .ox-status-summary__label{display:block;width:100%;color:#81939a;font-size:.55rem;font-weight:820;letter-spacing:.11em;text-transform:uppercase}
.ox-home .ox-status-context strong{color:#214b5d;font-size:.98rem}.ox-home .ox-status-context em{padding:3px 8px;border-radius:999px;font-size:.56rem;font-style:normal;font-weight:800}.ox-home .ox-status-context em.is-own{background:#eef7f6;color:#26765f}.ox-home .ox-status-context em.is-masked{background:#fff2df;color:#9b6418}.ox-home .ox-status-context small{display:block;width:100%;color:#788b93;font-size:.58rem;line-height:1.45}
.ox-home .ox-status-overall{display:grid;grid-template-columns:22px 1fr;align-items:center;gap:10px;padding:9px 14px;border-left:1px solid #dce7e8;border-right:1px solid #dce7e8}.ox-home .ox-status-overall__dot{display:grid;place-items:center}.ox-home .ox-status-overall__dot i{display:block;width:11px;height:11px;border-radius:50%;background:#98a8ad;box-shadow:0 0 0 5px rgba(152,168,173,.12)}.ox-home .ox-status-overall--healthy .ox-status-overall__dot i{background:#2f9e73;box-shadow:0 0 0 5px rgba(47,158,115,.12)}.ox-home .ox-status-overall--alert .ox-status-overall__dot i{background:#c65b4d;box-shadow:0 0 0 5px rgba(198,91,77,.12)}.ox-home .ox-status-overall strong{display:block;margin-top:3px;color:#315967;font-size:.78rem}.ox-home .ox-status-overall--healthy strong{color:#247b5c}.ox-home .ox-status-overall--alert strong{color:#a54539}.ox-home .ox-status-overall small{display:block;margin-top:3px;color:#819198;font-size:.57rem;line-height:1.4}
.ox-home .ox-status-counts{display:grid;grid-template-columns:repeat(4,minmax(55px,1fr));gap:8px;align-items:center}.ox-home .ox-status-counts div{padding:8px 5px;text-align:center}.ox-home .ox-status-counts span{display:block;color:#87979e;font-size:.52rem}.ox-home .ox-status-counts strong{display:block;margin-top:2px;color:#244d5d;font-size:1.02rem}
.ox-home .ox-status-split{margin-top:10px;display:grid;grid-template-columns:minmax(300px,34%) minmax(0,1fr);min-height:430px;border:1px solid #dce7e9;border-radius:15px;overflow:hidden;background:#fff}.ox-home .ox-status-units-pane{min-width:0;border-right:1px solid #dce7e9;background:#fbfdfd}.ox-home .ox-status-detail-pane{min-width:0;padding:0 18px 18px;background:#fff}.ox-home .ox-status-pane__head{padding:13px 14px;border-bottom:1px solid #dce7e9;background:#f4f9f9}.ox-home .ox-status-pane__head span{display:block;color:#315867;font-size:.7rem;font-weight:800}.ox-home .ox-status-pane__head small{display:block;margin-top:2px;color:#87989e;font-size:.54rem}.ox-home .ox-status-split .ox-unit-list{border-top:0}.ox-home .ox-status-split .ox-unit-row{min-height:70px;padding:11px 12px;grid-template-columns:20px minmax(0,1fr) 22px;gap:10px;border-bottom:1px solid #e5eded}.ox-home .ox-status-split .ox-unit-row__meta{grid-column:2;text-align:left}.ox-home .ox-status-split .ox-unit-row__arrow{grid-column:3;grid-row:1/3}.ox-home .ox-status-split .ox-unit-row.is-selected{background:#edf7f7;box-shadow:inset 3px 0 0 #198c92}.ox-home .ox-status-detail-placeholder{min-height:330px;display:grid;place-content:center;text-align:center;color:#84959b}.ox-home .ox-status-detail-placeholder strong{color:#54707b;font-size:.82rem}.ox-home .ox-status-detail-placeholder span{max-width:360px;margin-top:6px;font-size:.62rem;line-height:1.55}.ox-home .ox-status-split .ox-status__level{margin-top:0}.ox-home .ox-status-split .ox-status-detail__head{border-top:0;padding-top:18px}.ox-home .ox-dashboard-message--inline{margin:18px 0}
.ox-home .ox-dashboard-config-unit__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.ox-home .ox-dashboard-config-unit__bulk{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.ox-home .ox-dashboard-config-unit__bulk button{padding:4px 8px;border:1px solid #d0dfe1;border-radius:7px;background:#fff;color:#607983;font:inherit;font-size:.52rem;font-weight:700;cursor:pointer}.ox-home .ox-dashboard-config-unit__bulk button:hover{border-color:#7ebbc0;color:#087f8d}.ox-home .ox-dashboard-config__bulk{display:flex;gap:7px;flex-wrap:wrap}.ox-home .ox-dashboard-config__foot{grid-template-columns:minmax(0,auto) 1fr auto}.ox-home .ox-dashboard-config-unit>div[data-ox-config-device-group]{margin:10px 0 0 27px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 18px}
@media(max-width:1050px){.ox-home .ox-status-summary{grid-template-columns:1fr 1fr}.ox-home .ox-status-counts{grid-column:1/-1;border-top:1px solid #dce7e8;padding-top:8px}.ox-home .ox-status-overall{border-right:0}}
@media(max-width:900px){.ox-home .ox-status-split{grid-template-columns:1fr;overflow:visible}.ox-home .ox-status-units-pane{border-right:0;border-bottom:1px solid #dce7e9}.ox-home .ox-status-detail-pane{padding-inline:14px}.ox-home .ox-status-detail-placeholder{min-height:180px}}
@media(max-width:720px){.ox-home .ox-status-summary{grid-template-columns:1fr;padding:14px}.ox-home .ox-status-overall{border:0;border-top:1px solid #dce7e8;border-bottom:1px solid #dce7e8;padding:13px 0}.ox-home .ox-status-counts{grid-column:auto;border-top:0;padding-top:0}.ox-home .ox-dashboard-config-unit__head{flex-direction:column}.ox-home .ox-dashboard-config-unit__bulk{justify-content:flex-start}.ox-home .ox-dashboard-config-unit>div[data-ox-config-device-group]{grid-template-columns:1fr}.ox-home .ox-dashboard-config__foot{grid-template-columns:1fr}.ox-home .ox-dashboard-config__foot>span{text-align:left}.ox-home .ox-dashboard-config__bulk{width:100%}.ox-home .ox-dashboard-config__bulk button{flex:1}}


/* ========================================================================== 
   V9.9 – Statusfilter, größere Ampeln, Master/Detail-Politur, 30-s-Refresh
   ========================================================================== */
.ox-home .ox-workspace[data-ox-app="overview"] .ox-workspace__frame-wrap{overflow:hidden}
.ox-home .ox-workspace__panel--overview{overflow:hidden;border-radius:21px;background:#fff}
.ox-home .ox-status{border-radius:21px}

/* Ampelpunkte bewusst deutlich größer. */
.ox-home .ox-unit-row__state i,.ox-home .ox-device-row__state i,.ox-home .ox-status-detail__state i{width:20px;height:20px;box-shadow:0 0 0 6px rgba(149,167,174,.12)}
.ox-home .ox-unit-row--healthy .ox-unit-row__state i,.ox-home .ox-device-row--healthy .ox-device-row__state i,.ox-home .ox-status-detail__state--healthy i{box-shadow:0 0 0 6px rgba(47,158,115,.13)}
.ox-home .ox-unit-row--alert .ox-unit-row__state i,.ox-home .ox-device-row--alert .ox-device-row__state i,.ox-home .ox-status-detail__state--alert i{box-shadow:0 0 0 6px rgba(198,91,77,.13)}
.ox-home .ox-status-overall{grid-template-columns:38px 1fr;gap:14px}
.ox-home .ox-status-overall__dot i{width:22px;height:22px;box-shadow:0 0 0 7px rgba(152,168,173,.12)}
.ox-home .ox-status-overall--healthy .ox-status-overall__dot i{box-shadow:0 0 0 7px rgba(47,158,115,.13)}
.ox-home .ox-status-overall--alert .ox-status-overall__dot i{box-shadow:0 0 0 7px rgba(198,91,77,.13)}
.ox-home .ox-status-detail__state{grid-template-columns:24px auto;column-gap:12px}
.ox-home .ox-status-split .ox-unit-row{grid-template-columns:34px minmax(0,1fr) 22px;gap:12px}
.ox-home .ox-device-row{grid-template-columns:34px minmax(220px,1fr) minmax(140px,.4fr) minmax(190px,.55fr)}

/* Filter bleibt ausschließlich in der linken Unit-Spalte. */
.ox-home .ox-unit-filter{margin-top:11px;display:flex;flex-wrap:wrap;gap:6px}
.ox-home .ox-unit-filter button{min-height:29px;padding:5px 9px;border:1px solid #cfdddf;border-radius:999px;background:#fff;color:#657b84;font:inherit;font-size:.54rem;font-weight:760;cursor:pointer;transition:background .16s ease,border-color .16s ease,color .16s ease}
.ox-home .ox-unit-filter button:hover{border-color:#82b9be;color:#087f8d}
.ox-home .ox-unit-filter button.is-active{border-color:#178b94;background:#eaf7f7;color:#087985;box-shadow:0 0 0 2px rgba(23,139,148,.08)}
.ox-home .ox-unit-filter-empty{padding:24px 16px;color:#7d9097;font-size:.66rem;line-height:1.5;text-align:center}

/* Teilweise veraltete Geräte sollen trotz aktueller Unit sofort auffallen. */
.ox-home .ox-unit-row__meta small{margin-top:2px}
.ox-home .ox-unit-row__device-summary{display:inline-flex;margin-top:6px;padding:3px 7px;border-radius:999px;font-size:.55rem;font-weight:800;line-height:1.25}
.ox-home .ox-unit-row__device-summary.is-ok{background:#edf8f3;color:#247b5c}
.ox-home .ox-unit-row__device-summary.is-warning{background:#fff3dc;color:#9a651c;box-shadow:inset 0 0 0 1px #edd7ad}
.ox-home .ox-unit-row.has-device-issues{background-image:linear-gradient(90deg,rgba(197,138,45,.055),transparent 62%)}

/* Binäre Werte als reine Zustandsanzeige, nicht als bedienbarer Schalter. */
.ox-home .ox-device-switch{display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;white-space:nowrap}
.ox-home .ox-device-switch__track{position:relative;width:42px;height:22px;border-radius:999px;background:#c65b4d;box-shadow:inset 0 0 0 1px rgba(125,48,40,.15)}
.ox-home .ox-device-switch__track i{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(26,50,58,.22);transition:left .16s ease}
.ox-home .ox-device-switch strong{min-width:20px;color:#a54539;font-size:.62rem;font-weight:850;text-transform:lowercase}
.ox-home .ox-device-switch--on .ox-device-switch__track{background:#2f9e73;box-shadow:inset 0 0 0 1px rgba(30,109,79,.15)}
.ox-home .ox-device-switch--on .ox-device-switch__track i{left:23px}
.ox-home .ox-device-switch--on strong{color:#247b5c}

@media(max-width:900px){
  .ox-home .ox-workspace__panel--overview,.ox-home .ox-status{border-radius:14px}
  .ox-home .ox-status-split .ox-unit-row{grid-template-columns:34px minmax(0,1fr) 24px}
}
@media(max-width:800px){
  .ox-home .ox-device-row{grid-template-columns:34px minmax(0,1fr) auto}
}
@media(max-width:520px){
  .ox-home .ox-workspace__panel--overview,.ox-home .ox-status{border-radius:13px}
  .ox-home .ox-device-row{grid-template-columns:32px minmax(0,1fr)}
}


/* ==========================================================================
   V10 – mqtt_in_JSON-Roots als abgeleitete JSON-Quellen
   ========================================================================== */
.ox-home .ox-device-row--json-source{
  position:relative;
  min-height:86px;
  margin:14px 0 18px;
  padding:15px 14px;
  border:2px solid #79bfc7;
  border-radius:14px;
  background:linear-gradient(135deg,#edf9fa 0%,#f7fcfd 54%,#eef7fb 100%);
  box-shadow:0 9px 24px rgba(24,112,125,.11),inset 5px 0 0 #198c92;
}
.ox-home .ox-device-row--json-source:first-child{margin-top:14px}
.ox-home .ox-device-row--json-source .ox-device-row__state i{
  box-shadow:0 0 0 7px rgba(25,140,146,.11);
}
.ox-home .ox-device-row--json-source .ox-device-row__identity strong{
  margin-top:5px;
  color:#174f63;
  font-size:.82rem;
}
.ox-home .ox-device-row--json-source .ox-device-row__identity small{
  margin-top:3px;
  color:#65838e;
}
.ox-home .ox-json-source__badge{
  display:inline-flex;
  align-items:center;
  padding:3px 8px;
  border-radius:999px;
  background:#198c92;
  color:#fff;
  font-size:.51rem;
  font-weight:900;
  letter-spacing:.1em;
  line-height:1.2;
  text-transform:uppercase;
  box-shadow:0 2px 7px rgba(25,140,146,.2);
}
.ox-home .ox-json-source__summary{
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  padding:6px 10px;
  border-radius:999px;
  background:#dff1f4;
  color:#285f72;
  font-size:.62rem;
  font-weight:850;
  line-height:1.25;
  text-align:center;
  box-shadow:inset 0 0 0 1px rgba(53,107,125,.12);
}
.ox-home .ox-device-row--healthy .ox-json-source__summary{
  background:#edf8f3;
  color:#247b5c;
}
.ox-home .ox-device-row--warning .ox-json-source__summary{
  background:#fff3dc;
  color:#9a651c;
  box-shadow:inset 0 0 0 1px #edd7ad;
}
.ox-home .ox-device-row--alert .ox-json-source__summary{
  background:#fff0ed;
  color:#a54539;
}
.ox-home .ox-device-row--warning .ox-device-row__state i{
  background:#d69a34;
  box-shadow:0 0 0 6px rgba(214,154,52,.14);
}
.ox-home .ox-device-row--warning .ox-device-row__time strong{
  color:#9a651c;
}
.ox-home .ox-dashboard-config-value.is-json-source{
  background:#f7fbfd;
}
.ox-home .ox-dashboard-config-value.is-json-source strong{
  color:#356b7d;
}
@media(max-width:800px){
  .ox-home .ox-device-row--json-source{margin:12px 0 16px;padding:14px 12px}
  .ox-home .ox-json-source__summary{justify-content:flex-start}
}
@media(max-width:520px){
  .ox-home .ox-device-row--json-source{margin:10px 0 15px;padding:13px 11px}
  .ox-home .ox-device-row--json-source .ox-device-row__value{margin-top:7px}
}

/* V10.5 / Status-Drilldown: links scrollt nur die Unit-Liste, rechts die Detailansicht */
@media (min-width:901px){
  .ox-home .ox-status-split{
    height:min(72vh,760px);
    min-height:520px;
    overflow:hidden;
    scroll-margin-top:96px;
  }
  .ox-home .ox-status-units-pane{
    height:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }
  .ox-home .ox-status-units-pane .ox-status-pane__head{
    position:relative;
    flex:0 0 auto;
    z-index:1;
    box-shadow:0 1px 0 rgba(220,231,233,.92);
  }
  .ox-home .ox-status-units-pane .ox-unit-list{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
  }
  .ox-home .ox-status-detail-pane{
    height:100%;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
  }
  .ox-home .ox-status-detail__head{
    scroll-margin-top:18px;
  }
}

@media (max-width:900px){
  .ox-home .ox-status__level--detail{
    scroll-margin-top:96px;
  }
}

/* V11.1: Status-Detailfilter für Devices/Messwerte. */
.ox-home .ox-device-filter{
  margin:10px 0 8px;
  padding-bottom:10px;
  border-bottom:1px solid #e4ecee;
}