:root {
    --bg: #f5f6f8;
    --surface: #ffffff;
    --surface-soft: #f8f9fb;
    --surface-hover: #f1f3f6;
    --ink: #1f2933;
    --muted: #66727f;
    --line: #e3e7eb;
    --line-strong: #d4dae0;
    --primary: #00679e;
    --primary-hover: #005783;
    --primary-soft: #eaf5fb;
    --header: #00679e;
    --header-ink: #ffffff;
    --danger: #c0392b;
    --danger-bg: #fff1ef;
    --success: #16834b;
    --success-bg: #eaf8f0;
    --warning: #9b6500;
    --warning-bg: #fff6dc;
    --info: #12679a;
    --info-bg: #eaf5fb;
    --shadow: 0 2px 10px rgba(31, 41, 51, .08);
    --shadow-float: 0 12px 35px rgba(25, 42, 55, .16);
    --radius: 14px;
    --header-height: 58px;
    --sidebar-width: 260px;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); }
body {
    margin: 0;
    min-height: 100vh;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: var(--ink);
    background: var(--bg);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
button, input, select, textarea { font: inherit; }
code, .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .92em; }
svg { display: block; }

/* Grundlayout – Nextcloud-inspirierte Kopfzeile + App-Navigation */
.shell { min-height: 100vh; }
.global-header {
    position: fixed;
    inset: 0 0 auto 0;
    height: var(--header-height);
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 0 16px;
    background: var(--header);
    color: var(--header-ink);
    z-index: 50;
    box-shadow: 0 1px 0 rgba(0, 0, 0, .12);
}
.header-brand {
    min-width: calc(var(--sidebar-width) - 16px);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    text-decoration: none;
    overflow: hidden;
}
.cloud-mark {
    position: relative;
    width: 36px;
    height: 32px;
    flex: 0 0 36px;
}
.cloud-mark span {
    position: absolute;
    border: 3px solid currentColor;
    border-radius: 50%;
    width: 17px;
    height: 17px;
    top: 8px;
}
.cloud-mark span:nth-child(1) { left: 0; }
.cloud-mark span:nth-child(2) { left: 9px; top: 3px; width: 22px; height: 22px; }
.cloud-mark span:nth-child(3) { right: 0; }
.header-brand-copy { min-width: 0; }
.header-brand-copy strong,
.header-brand-copy small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.header-brand-copy strong { font-size: 14px; font-weight: 650; line-height: 1.15; }
.header-brand-copy small { font-size: 10px; opacity: .8; margin-top: 2px; }
.header-apps { display: flex; align-items: stretch; align-self: stretch; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.header-apps::-webkit-scrollbar { display: none; }
.header-app {
    position: relative;
    min-width: 74px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 12px;
    color: rgba(255,255,255,.78);
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
.header-app:hover { color: #fff; background: rgba(255,255,255,.08); }
.header-app.active { color: #fff; }
.header-app.active::after {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: #fff;
}
.header-app-icon { width: 17px; height: 17px; opacity: .95; }
.header-spacer { flex: 1; }
.header-security {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: rgba(255,255,255,.85);
    white-space: nowrap;
}
.header-security svg { width: 14px; height: 14px; }
.header-user {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}
.header-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.2);
    border: 2px solid rgba(255,255,255,.7);
    color: #fff;
    font-size: 12px;
    font-weight: 750;
    letter-spacing: .02em;
    flex: 0 0 34px;
}
.header-user-copy { max-width: 180px; }
.header-user-copy strong,
.header-user-copy span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.header-user-copy strong { font-size: 11px; }
.header-user-copy span { font-size: 10px; color: rgba(255,255,255,.7); }
.header-logout .link-button { color: rgba(255,255,255,.78); }
.header-logout .link-button:hover { color: #fff; }

.sidebar {
    position: fixed;
    top: var(--header-height);
    bottom: 0;
    left: 0;
    width: var(--sidebar-width);
    padding: 16px 12px;
    background: var(--surface);
    border-right: 1px solid var(--line);
    overflow-y: auto;
    z-index: 30;
}
.sidebar-primary { margin-bottom: 14px; }
.sidebar-primary .button { width: 100%; justify-content: flex-start; gap: 9px; min-height: 42px; border-radius: 12px; }
.sidebar-primary svg { width: 18px; height: 18px; }
.sidebar nav { display: grid; gap: 2px; }
.sidebar nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 10px;
    color: #3d4852;
    text-decoration: none;
    font-size: 13px;
    font-weight: 550;
}
.sidebar nav a svg { width: 18px; height: 18px; color: #63717d; flex: 0 0 18px; }
.sidebar nav a:hover { background: var(--surface-hover); color: #17212b; }
.sidebar nav a.active { background: var(--primary-soft); color: var(--primary); font-weight: 700; }
.sidebar nav a.active svg { color: var(--primary); }
.nav-label {
    padding: 18px 10px 6px;
    color: #89939d;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .09em;
    font-weight: 700;
}
.sidebar-footer {
    margin-top: 20px;
    padding: 14px 10px 0;
    border-top: 1px solid var(--line);
    color: var(--muted);
}
.sidebar-footer .sidebar-note { font-size: 10px; line-height: 1.45; }
.link-button { background: none; border: 0; padding: 0; cursor: pointer; color: var(--muted); font-size: 12px; }
.link-button:hover { color: var(--primary); }

.main {
    min-height: 100vh;
    margin-left: var(--sidebar-width);
    padding: calc(var(--header-height) + 26px) clamp(22px, 3vw, 42px) 54px;
}
.auth-main { margin-left: 0; padding: 0; }
.content-width { width: min(1320px, 100%); margin: 0 auto; }
.topbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
}
.breadcrumb { color: var(--muted); font-size: 11px; margin-bottom: 4px; }
.topbar h1 { margin: 0; font-size: clamp(24px, 2.5vw, 32px); line-height: 1.2; letter-spacing: -.025em; font-weight: 680; }
.topbar-actions { display: flex; align-items: center; gap: 8px; }
.secure-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--success);
    background: var(--success-bg);
    border: 1px solid #cbead7;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}
.secure-pill svg { width: 13px; height: 13px; }
.eyebrow { color: var(--primary); font-size: 10px; text-transform: uppercase; letter-spacing: .09em; font-weight: 750; }

/* Komponenten */
.card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 22px;
    box-shadow: none;
}
.card:hover.card-hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.grid { display: grid; gap: 16px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.section-gap { margin-top: 16px; }
.stats .card { min-height: 128px; }
.stat-card { position: relative; display: flex; flex-direction: column; justify-content: center; overflow: hidden; }
.stat-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--primary); opacity: .7; }
.stat-label { color: var(--muted); font-size: 11px; font-weight: 650; }
.stat-value { font-size: 32px; line-height: 1.1; margin: 7px 0 3px; letter-spacing: -.035em; }
.stat-text { font-size: 23px; }
.accent-card { background: var(--primary-soft); border-color: #cee6f3; color: #184b66; }
.accent-card::before { background: var(--primary); opacity: 1; }
.accent-card .stat-label, .accent-card span { color: #4b7288; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.section-head h2, .form-card h2, .info-card h2 { margin: 2px 0 0; font-size: 19px; letter-spacing: -.015em; }
.page-actions { margin-bottom: 14px; }
.page-actions p { margin: 0; }
.text-link { color: var(--primary); text-decoration: none; font-size: 12px; font-weight: 650; }
.text-link:hover { text-decoration: underline; }
.muted { color: var(--muted); }

.compact-list { display: grid; margin: 0 -10px; }
.compact-row {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    align-items: center;
    gap: 11px;
    padding: 10px;
    border-radius: 10px;
    color: inherit;
    text-decoration: none;
}
.compact-row:hover { background: var(--surface-hover); }
.compact-row strong, .compact-row small { display: block; }
.compact-row strong { font-size: 12px; font-weight: 650; }
.compact-row small { color: var(--muted); font-size: 10px; margin-top: 2px; }
.file-icon {
    width: 38px;
    height: 38px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}
.file-icon.file-pdf { background: #fdecec; color: #c5362e; }
.file-icon.file-sheet { background: #eaf7ee; color: #1d7e47; }
.file-icon.file-image { background: #f4edff; color: #6b43a4; }
.file-icon.file-archive { background: #fff4df; color: #9a650d; }
.file-icon.file-word { background: #eaf3ff; color: #245b9b; }
.file-icon.file-presentation { background: #fff0e8; color: #a64b19; }
.file-icon.file-text { background: #eef2f5; color: #52616d; }
.file-icon.file-xml { background: #e8f6f8; color: #176d79; }
.file-icon.file-generic { background: #eef1f4; color: #53616d; }

.action-grid { display: grid; gap: 7px; margin-top: 15px; }
.action-tile {
    position: relative;
    display: block;
    min-height: 52px;
    padding: 9px 10px 9px 52px;
    border-radius: 10px;
    color: inherit;
    text-decoration: none;
}
.action-tile::before {
    content: "+";
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 18px;
}
.action-tile:hover { background: var(--surface-hover); }
.action-tile strong, .action-tile span { display: block; }
.action-tile strong { font-size: 12px; }
.action-tile span { color: var(--muted); font-size: 10px; margin-top: 1px; }
.details { margin: 14px 0 0; }
.details div { display: grid; grid-template-columns: 105px 1fr; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.details div:last-child { border-bottom: 0; }
.details dt { color: var(--muted); font-size: 11px; }
.details dd { margin: 0; font-size: 12px; font-weight: 600; }

.button-row { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    padding: 8px 13px;
    border: 1px solid var(--line-strong);
    border-radius: 10px;
    background: var(--surface);
    color: #26323c;
    text-decoration: none;
    font-size: 12px;
    font-weight: 650;
    cursor: pointer;
    transition: background .12s ease, border-color .12s ease, transform .12s ease;
}
.button:hover { background: var(--surface-hover); border-color: #c4cbd2; }
.button:active { transform: translateY(1px); }
.button svg { width: 16px; height: 16px; }
.button-primary { color: #fff; background: var(--primary); border-color: var(--primary); }
.button-primary:hover { color: #fff; background: var(--primary-hover); border-color: var(--primary-hover); }
.button-danger { color: var(--danger); background: var(--danger-bg); border-color: #f2c7c2; }
.button-danger:hover { background: #ffe7e4; border-color: #eab2ac; }
.button-small { min-height: 31px; padding: 6px 9px; font-size: 11px; border-radius: 8px; }
.button-wide { width: 100%; }

.table-card { padding: 0; overflow: hidden; }
.table-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 7px 12px;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
}
.table-toolbar-title { font-size: 12px; font-weight: 650; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 12px; }
th {
    text-align: left;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
    color: #697681;
    font-size: 10px;
    font-weight: 650;
    white-space: nowrap;
}
td { padding: 11px 14px; border-bottom: 1px solid var(--line); vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fafbfc; }
.table-file { display: flex; align-items: center; gap: 10px; min-width: 230px; }
.table-file .file-icon { flex: 0 0 36px; width: 36px; height: 36px; }
.table-file-copy { min-width: 0; }
.table-file-copy strong { display: block; max-width: 420px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.table-note { display: block; max-width: 420px; color: var(--muted); font-size: 10px; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.actions-cell { display: flex; gap: 6px; justify-content: flex-end; align-items: center; }
.actions-cell form { margin: 0; }
.badge { display: inline-flex; align-items: center; padding: 4px 7px; border-radius: 999px; background: #eef1f4; color: #53616d; font-size: 10px; font-weight: 650; white-space: nowrap; }
.status { display: inline-flex; padding: 4px 7px; border-radius: 999px; font-size: 10px; font-weight: 700; }
.status-ok { color: var(--success); background: var(--success-bg); }
.status-off { color: #a23e34; background: #ffefed; }
.status-synced { color: var(--success); background: var(--success-bg); }
.status-pending { color: #8a6200; background: #fff4d6; }
.status-not_required { color: #53616d; background: #eef1f4; }
.status-not_reported { color: #a23e34; background: #ffefed; }
.sync-status { margin-bottom: 3px; }
.sync-detail { display: block; max-width: 210px; color: var(--muted); font-size: 9px; line-height: 1.35; }

.form-card p { max-width: 760px; }
.narrow-card { max-width: 760px; }
.form-stack { display: grid; gap: 15px; margin-top: 20px; }
.form-grid { gap: 13px; }
.span-2 { grid-column: span 2; }
label { display: grid; gap: 6px; color: #35414b; font-size: 12px; font-weight: 650; }
label small, .form-hint { color: var(--muted); font-size: 10px; font-weight: 400; }
input, select, textarea {
    width: 100%;
    min-height: 40px;
    padding: 9px 11px;
    border: 1px solid var(--line-strong);
    border-radius: 10px;
    outline: none;
    background: var(--surface);
    color: var(--ink);
    transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
textarea { resize: vertical; min-height: 100px; }
input:hover, select:hover, textarea:hover { border-color: #bcc4cc; }
input:focus, select:focus, textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(0,103,158,.12); }
input[type="file"] { padding: 7px; background: var(--surface-soft); }
.optional { color: var(--muted); font-weight: 400; }
.check-row { display: flex; align-items: center; gap: 8px; }
.check-row input { width: auto; min-height: auto; }
.search-form { display: grid; grid-template-columns: 1fr auto; gap: 9px; margin-top: 16px; }
.inline-activate { display: grid; grid-template-columns: minmax(170px, 1fr) auto; gap: 7px; }
.empty { color: var(--muted); padding: 18px 4px; font-size: 12px; }
.large-empty { min-height: 280px; padding: 44px 30px; text-align: center; display: grid; place-items: center; align-content: center; gap: 4px; }
.large-empty::before { content: ""; width: 52px; height: 42px; border: 2px solid #aeb8c0; border-radius: 10px; margin-bottom: 10px; background: linear-gradient(180deg,#fff,#f5f7f8); }
.large-empty strong { color: var(--ink); font-size: 16px; }
.info-card { background: #f8fbfd; }
.info-card p { color: var(--muted); }
hr { border: 0; border-top: 1px solid var(--line); margin: 24px 0; }
.alert { border-radius: 10px; padding: 11px 13px; margin-bottom: 16px; font-size: 11px; font-weight: 600; border: 1px solid transparent; }
.alert-success { color: var(--success); background: var(--success-bg); border-color: #cbead7; }
.alert-error { color: var(--danger); background: var(--danger-bg); border-color: #f2c7c2; }
.alert-warning { color: var(--warning); background: var(--warning-bg); border-color: #f0dda0; }
.alert-info { color: var(--info); background: var(--info-bg); border-color: #cbe5f2; }
.wrap-mono { white-space: normal; overflow-wrap: anywhere; }

/* Login – vertrauter Cloud-Login, ohne Nextcloud zu kopieren */
.auth-wrap {
    position: relative;
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 42px 20px;
    overflow: hidden;
    background:
        radial-gradient(circle at 20% 20%, rgba(255,255,255,.18), transparent 26%),
        radial-gradient(circle at 82% 12%, rgba(255,255,255,.11), transparent 28%),
        linear-gradient(145deg, #075f8e 0%, #00679e 42%, #0a78a7 100%);
}
.auth-wrap::before,
.auth-wrap::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 50%;
}
.auth-wrap::before { left: -180px; bottom: -210px; }
.auth-wrap::after { right: -180px; top: -220px; }
.auth-panel { min-height: auto; padding: 0; }
.auth-copy { display: none; }
.auth-form-panel { position: relative; z-index: 2; display: block; background: transparent; }
.auth-card {
    width: min(430px, calc(100vw - 40px));
    padding: 34px 34px 28px;
    background: rgba(255,255,255,.98);
    border: 1px solid rgba(255,255,255,.72);
    border-radius: 18px;
    box-shadow: var(--shadow-float);
}
.auth-logo { display: flex; align-items: center; justify-content: center; margin-bottom: 22px; color: var(--primary); }
.auth-logo .cloud-mark { width: 52px; height: 43px; transform: scale(1.2); }
.auth-title { text-align: center; }
.auth-title .eyebrow { margin-bottom: 3px; }
.auth-card h2 { margin: 0; font-size: 25px; letter-spacing: -.025em; }
.auth-card > .muted, .auth-title + .muted { text-align: center; font-size: 11px; }
.auth-card .form-stack { margin-top: 22px; }
.auth-card .button-primary { min-height: 42px; border-radius: 10px; }
.auth-card .form-hint { margin: 16px 0 0; text-align: center; line-height: 1.5; }
.auth-security-note { display: flex; justify-content: center; gap: 6px; margin-top: 18px; color: #63717d; font-size: 10px; }
.auth-security-note svg { width: 13px; height: 13px; }
.login-public-links {
    position: fixed;
    z-index: 3;
    left: 16px;
    right: 16px;
    bottom: 16px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 14px;
    margin: 0;
    font-size: 10px;
}
.login-public-links a { color: rgba(255,255,255,.82); text-decoration: none; }
.login-public-links a:hover { color: #fff; text-decoration: underline; }

/* CMS / öffentliche Seiten */
.compact-stack { gap: 10px; align-content: start; padding-top: 24px; }
.public-site { background: #f6f7f8; }
.public-header { position: sticky; top: 0; z-index: 10; background: #fff; border-bottom: 1px solid var(--line); }
.public-inner { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }
.public-nav-row { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.public-header .brand { display: flex; align-items: center; gap: 10px; text-decoration: none; margin: 0; }
.brand-mark { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--primary); color: #fff; font-size: 11px; font-weight: 800; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 13px; }
.brand small { color: var(--muted); font-size: 10px; }
.public-nav { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 7px 16px; }
.public-nav > a:not(.button) { color: #4f5c67; text-decoration: none; font-size: 12px; font-weight: 600; }
.public-nav > a:not(.button):hover { color: var(--primary); }
.public-main { min-height: calc(100vh - 145px); }
.public-hero { padding: 58px 0; background: linear-gradient(145deg, #075f8e, #0877a8); color: #fff; }
.public-hero.compact { padding: 46px 0; }
.public-hero .eyebrow { color: rgba(255,255,255,.75); }
.public-hero h1 { margin: 6px 0 0; font-size: clamp(31px, 4.5vw, 50px); letter-spacing: -.035em; }
.public-section { padding: 38px 0 64px; }
.cms-article { max-width: 880px; margin: 0 auto; padding: clamp(24px, 4vw, 42px); }
.cms-article p { margin: 0 0 1.2em; color: #3d4852; font-size: 14px; line-height: 1.75; }
.cms-article p:last-child { margin-bottom: 0; }
.public-footer { padding: 22px 0; background: #fff; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.public-footer-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.public-footer nav { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.public-footer a { color: inherit; text-decoration: none; }
.public-footer a:hover { color: var(--primary); }

@media (max-width: 1080px) {
    :root { --sidebar-width: 224px; }
    .header-brand { min-width: calc(var(--sidebar-width) - 16px); }
    .header-user-copy { display: none; }
    .grid-3 { grid-template-columns: 1fr 1fr; }
    .grid-3 > :last-child { grid-column: span 2; }
}

@media (max-width: 780px) {
    :root { --header-height: 54px; }
    .global-header { padding: 0 10px; gap: 8px; }
    .header-brand { min-width: auto; }
    .header-brand-copy, .header-security { display: none; }
    .header-app { min-width: 46px; padding: 0 8px; }
    .header-app span:not(.header-app-icon) { display: none; }
    .header-spacer { min-width: 4px; }
    .header-logout { display: none; }
    .sidebar {
        position: fixed;
        top: auto;
        left: 0;
        right: 0;
        bottom: 0;
        width: auto;
        height: 62px;
        padding: 6px 8px;
        border-top: 1px solid var(--line);
        border-right: 0;
        overflow: visible;
        display: block;
        z-index: 45;
        box-shadow: 0 -3px 12px rgba(31,41,51,.06);
    }
    .sidebar-primary, .nav-label, .sidebar-footer { display: none; }
    .sidebar nav { height: 100%; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 4px; }
    .sidebar nav a { min-height: 50px; padding: 4px 2px; flex-direction: column; justify-content: center; gap: 2px; text-align: center; font-size: 9px; }
    .sidebar nav a svg { width: 18px; height: 18px; }
    .sidebar nav a:nth-of-type(n+5) { display: none; }
    .main { margin-left: 0; padding: calc(var(--header-height) + 20px) 14px 82px; }
    .auth-main { padding: 0; }
    .topbar { align-items: flex-start; }
    .secure-pill { display: none; }
    .grid-2, .grid-3 { grid-template-columns: 1fr; }
    .grid-3 > :last-child, .span-2 { grid-column: auto; }
    .page-actions, .section-head { align-items: flex-start; flex-direction: column; }
    .button-row { width: 100%; }
    .button-row > * { flex: 1 1 auto; }
    .search-form, .inline-activate { grid-template-columns: 1fr; }
    .actions-cell { min-width: 145px; }
    .auth-wrap { padding: 28px 16px 58px; }
    .auth-card { width: min(420px, calc(100vw - 32px)); padding: 28px 22px 24px; }
    .public-nav-row, .public-footer-row { align-items: flex-start; flex-direction: column; padding: 14px 0; }
    .public-nav { justify-content: flex-start; }
    .public-header { position: static; }
}

@media (max-width: 470px) {
    .header-apps { display: none; }
    .header-spacer { flex: 1; }
    .topbar h1 { font-size: 24px; }
    .card { padding: 17px; }
    .stats .card { min-height: 112px; }
    .stat-value { font-size: 28px; }
}

/* Firmenwebsite – öffentliche Oberfläche, Inhalte aus Odoo */
.company-site { background: #fff; color: #17212b; }
.company-header { position: sticky; top: 0; z-index: 70; background: rgba(255,255,255,.96); backdrop-filter: blur(14px); border-bottom: 1px solid #e8edf1; }
.company-nav-row { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.company-brand { display: inline-flex; align-items: center; gap: 12px; color: #17212b; text-decoration: none; min-width: 0; }
.company-brand strong, .company-brand small { display: block; }
.company-brand strong { font-size: 14px; line-height: 1.15; }
.company-brand small { margin-top: 3px; max-width: 320px; color: #77838e; font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.company-nav { display: flex; align-items: center; justify-content: flex-end; gap: 4px; flex-wrap: wrap; }
.company-nav > a { padding: 10px 12px; border-radius: 10px; color: #56626d; font-size: 12px; font-weight: 650; text-decoration: none; }
.company-nav > a:hover, .company-nav > a.active { color: #00679e; background: #eef7fb; }
.company-nav .company-portal-link { margin-left: 7px; padding: 11px 15px; background: #00679e; color: #fff; }
.company-nav .company-portal-link:hover { background: #005783; color: #fff; }
.company-main { min-height: 60vh; }
.company-hero { position: relative; overflow: hidden; padding: clamp(72px, 9vw, 122px) 0; background: linear-gradient(135deg,#004d79 0%,#006d9f 58%,#0b8ab3 100%); color: #fff; }
.company-hero::before { content:""; position:absolute; width:520px; height:520px; right:-150px; top:-230px; border:1px solid rgba(255,255,255,.15); border-radius:50%; box-shadow: 0 0 0 70px rgba(255,255,255,.025), 0 0 0 140px rgba(255,255,255,.02); }
.company-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0,1.25fr) minmax(320px,.75fr); gap: clamp(42px,7vw,86px); align-items: center; }
.company-eyebrow { color: rgba(255,255,255,.76); font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.company-eyebrow.dark { color: #00679e; }
.company-hero h1 { max-width: 760px; margin: 12px 0 20px; font-size: clamp(40px,6vw,72px); line-height: 1.02; letter-spacing: -.045em; }
.company-lead { max-width: 680px; margin: 0; color: rgba(255,255,255,.84); font-size: clamp(17px,2vw,21px); line-height: 1.65; }
.company-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:30px; }
.company-button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 20px; border-radius:12px; font-size:13px; font-weight:750; text-decoration:none; transition:.15s ease; }
.company-button.primary { background:#fff; color:#005d8d; box-shadow:0 10px 26px rgba(0,0,0,.12); }
.company-button.primary:hover { transform:translateY(-1px); box-shadow:0 14px 32px rgba(0,0,0,.17); }
.company-button.secondary { border:1px solid rgba(255,255,255,.34); color:#fff; background:rgba(255,255,255,.08); }
.company-button.light { background:#fff; color:#005d8d; }
.company-button.compact { min-height:40px; padding:0 15px; }
.company-trust-row { display:flex; gap:14px 24px; flex-wrap:wrap; margin-top:30px; color:rgba(255,255,255,.76); font-size:11px; }
.company-hero-panel { position:relative; padding:24px; border-radius:22px; background:rgba(255,255,255,.96); color:#1f2933; box-shadow:0 30px 80px rgba(0,30,50,.28); transform:rotate(1deg); }
.hero-panel-top { display:flex; gap:6px; margin-bottom:22px; }
.hero-panel-top span { width:8px; height:8px; border-radius:50%; background:#d9e1e6; }
.hero-panel-card { display:flex; align-items:center; gap:14px; padding:16px 0; border-bottom:1px solid #e9eef2; }
.hero-panel-icon { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:13px; background:#e8f5fb; color:#00679e; font-size:19px; font-weight:800; }
.hero-panel-card strong, .hero-panel-card small { display:block; }
.hero-panel-card strong { font-size:13px; }
.hero-panel-card small { margin-top:3px; color:#71808c; font-size:10px; line-height:1.45; }
.hero-panel-login { display:flex; justify-content:space-between; margin-top:18px; padding:13px 14px; border-radius:11px; background:#00679e; color:#fff; text-decoration:none; font-size:12px; font-weight:750; }
.company-section { padding: clamp(64px,8vw,104px) 0; }
.company-section-soft { background:#f5f8fa; }
.company-section-heading { max-width:720px; margin-bottom:38px; }
.company-section-heading.compact { margin-bottom:0; }
.company-section-heading h2, .company-contact-band h2 { margin:8px 0 12px; font-size:clamp(30px,4vw,48px); line-height:1.1; letter-spacing:-.035em; }
.company-section-heading p { margin:0; color:#6a7782; font-size:15px; line-height:1.7; }
.service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.service-card { position:relative; padding:28px; border:1px solid #e4e9ed; border-radius:18px; background:#fff; box-shadow:0 9px 30px rgba(31,41,51,.04); }
.service-number { color:#9aabb7; font-size:11px; font-weight:800; letter-spacing:.12em; }
.service-card h3 { margin:22px 0 10px; font-size:20px; letter-spacing:-.02em; }
.service-card p { min-height:66px; margin:0 0 24px; color:#687581; font-size:13px; line-height:1.65; }
.service-card a { color:#00679e; font-size:12px; font-weight:750; text-decoration:none; }
.service-card a span { margin-left:5px; }
.company-content-split { display:grid; grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr); gap:clamp(40px,8vw,100px); align-items:start; }
.company-richtext { color:#35424d; font-size:15px; line-height:1.8; }
.company-richtext > *:first-child { margin-top:0; }
.company-richtext h2 { margin:1.6em 0 .5em; color:#17212b; font-size:28px; line-height:1.2; letter-spacing:-.025em; }
.company-richtext h3 { margin:1.5em 0 .45em; color:#17212b; font-size:21px; }
.company-richtext p { margin:0 0 1.2em; }
.company-richtext a { color:#00679e; }
.company-richtext blockquote { margin:1.5em 0; padding:4px 0 4px 18px; border-left:3px solid #80bedc; color:#5b6974; }
.company-contact-band { padding:64px 0; background:#073c5a; color:#fff; }
.company-contact-grid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr); gap:50px; align-items:center; }
.company-contact-band p { max-width:700px; color:rgba(255,255,255,.75); line-height:1.7; }
.company-contact-actions { display:flex; flex-direction:column; align-items:flex-start; gap:9px; }
.company-contact-actions > a:not(.company-button) { color:#fff; font-size:14px; font-weight:650; text-decoration:none; }
.company-page-hero { padding:76px 0 58px; background:linear-gradient(135deg,#005c8b,#087da9); color:#fff; }
.company-page-hero.legal { background:#2e3d48; }
.company-page-hero-inner { max-width:920px; }
.company-page-hero h1 { margin:10px 0 14px; font-size:clamp(38px,5vw,60px); line-height:1.04; letter-spacing:-.04em; }
.company-page-hero p { max-width:760px; margin:0; color:rgba(255,255,255,.8); font-size:18px; line-height:1.6; }
.company-page-grid { display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:70px; align-items:start; }
.company-page-content { max-width:820px; }
.company-page-aside { position:sticky; top:110px; padding:24px; border-radius:16px; background:#f2f7fa; border:1px solid #e1ebf0; }
.company-page-aside strong { font-size:15px; }
.company-page-aside p { color:#697680; font-size:12px; line-height:1.6; }
.company-page-aside .company-button.primary { background:#00679e; color:#fff; box-shadow:none; }
.company-footer { padding:56px 0 20px; background:#101820; color:#bac4cc; }
.company-footer-grid { display:grid; grid-template-columns:1.4fr .8fr .8fr; gap:50px; }
.company-footer .company-brand { color:#fff; }
.company-footer p { max-width:440px; color:#8997a2; font-size:12px; line-height:1.65; }
.company-footer-grid > div { display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.company-footer-grid > div > strong { margin-bottom:6px; color:#fff; font-size:11px; text-transform:uppercase; letter-spacing:.09em; }
.company-footer a, .company-footer span { color:#aeb9c2; font-size:11px; text-decoration:none; }
.company-footer a:hover { color:#fff; }
.company-footer-bottom { margin-top:44px; padding-top:18px; border-top:1px solid rgba(255,255,255,.08); color:#75838e; font-size:10px; }
.portal-back-link { display:inline-block; margin-bottom:18px; color:#65717c; font-size:11px; text-decoration:none; }
.portal-back-link:hover { color:#00679e; }

@media (max-width: 900px) {
    .company-nav-row { align-items:flex-start; flex-direction:column; padding:14px 0; gap:12px; }
    .company-header { position:static; }
    .company-nav { justify-content:flex-start; }
    .company-nav .company-portal-link { margin-left:0; }
    .company-hero-grid, .company-content-split, .company-contact-grid, .company-page-grid { grid-template-columns:1fr; }
    .company-hero-panel { max-width:560px; transform:none; }
    .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .company-page-aside { position:static; }
    .company-footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 620px) {
    .public-inner { width:min(100% - 28px,1120px); }
    .company-brand small { max-width:220px; }
    .company-nav { gap:2px; }
    .company-nav > a { padding:8px 9px; font-size:11px; }
    .company-hero { padding:64px 0; }
    .company-hero h1 { font-size:40px; }
    .service-grid, .company-footer-grid { grid-template-columns:1fr; }
    .company-actions { align-items:stretch; flex-direction:column; }
    .company-button { width:100%; }
    .company-trust-row { flex-direction:column; gap:7px; }
}

/* ==========================================================
   Firmenwebsite Vorlage v2
   Eigenständiges, ruhiges Beratungsdesign. Das Kundenportal
   behält seine separate Cloud-/Dateioberfläche.
   ========================================================== */
.company-site {
    --company-ink: #0f3352;
    --company-ink-2: #17486f;
    --company-accent: #00679e;
    --company-accent-soft: #eaf5fb;
    --company-green: #00679e;
    --company-soft: #f4f8fb;
    --company-line: #dce8f1;
    --company-muted: #617383;
    background: #f7fbfe;
    color: var(--company-ink);
}
.company-site .public-inner { width: min(1180px, calc(100% - 48px)); }
.company-header { background: rgba(247,251,254,.97); border-bottom-color: #dde7ef; box-shadow: 0 1px 0 rgba(21,51,59,.03); }
.company-info-bar { background: var(--company-ink); color: rgba(255,255,255,.78); }
.company-info-inner { min-height: 32px; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:10px; }
.company-info-left, .company-info-right { display:flex; align-items:center; gap:10px 18px; flex-wrap:wrap; }
.company-info-right a { color:#fff; text-decoration:none; font-weight:650; }
.company-info-left span + span::before { content:"·"; margin-right:18px; opacity:.45; }
.company-nav-row { min-height: 86px; }
.company-brand { gap:14px; }
.company-brand-copy { min-width:0; }
.company-brand strong { font-family: Georgia, "Times New Roman", serif; font-size:22px; font-weight:600; letter-spacing:-.025em; color:var(--company-ink); }
.company-brand small { max-width:430px; margin-top:2px; color:#7c94a3; font-size:10px; letter-spacing:.035em; text-transform:uppercase; }
.company-nav { gap:2px; }
.company-nav > a { padding:10px 11px; border-radius:999px; color:#4d6578; font-size:12px; font-weight:650; }
.company-nav > a:hover, .company-nav > a.active { color:var(--company-ink); background:#eaf5fb; }
.company-nav .company-portal-link { margin-left:10px; padding:12px 16px; background:var(--company-green); color:#fff; }
.company-nav .company-portal-link:hover { background:#005783; color:#fff; }

.company-hero { padding: clamp(76px, 9vw, 132px) 0 88px; background: var(--company-soft); color:var(--company-ink); }
.company-hero::before { width:720px; height:720px; right:-340px; top:-340px; border-color:rgba(0,103,158,.12); box-shadow:0 0 0 80px rgba(0,103,158,.025),0 0 0 160px rgba(0,103,158,.018); }
.company-hero::after { content:""; position:absolute; left:-130px; bottom:-180px; width:360px; height:360px; border-radius:50%; background:rgba(0,103,158,.06); }
.company-hero-grid { grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr); gap:clamp(46px,7vw,92px); }
.company-eyebrow { color:var(--company-accent); font-size:10px; letter-spacing:.16em; }
.company-eyebrow.dark { color:var(--company-accent); }
.company-hero h1 { max-width:780px; margin:14px 0 22px; color:var(--company-ink); font-family:Georgia,"Times New Roman",serif; font-weight:500; font-size:clamp(42px,5.7vw,70px); line-height:1.02; letter-spacing:-.04em; }
.company-lead { max-width:690px; color:#526c7c; font-size:clamp(17px,1.8vw,20px); line-height:1.68; }
.company-button { border-radius:999px; min-height:48px; padding:0 20px; }
.company-button.primary { background:var(--company-green); color:#fff; box-shadow:0 10px 24px rgba(0,103,158,.16); }
.company-button.primary:hover { background:#005783; box-shadow:0 13px 28px rgba(0,103,158,.2); }
.company-button.secondary { border:1px solid #cad8e4; background:transparent; color:var(--company-ink); }
.company-button.secondary:hover { background:#fff; border-color:#b5cadb; }
.company-trust-row { gap:12px 24px; color:#6b808d; }
.company-trust-row span { display:inline-flex; gap:8px; align-items:center; }
.company-trust-row b { color:var(--company-accent); font-size:9px; letter-spacing:.08em; }

.company-hero-visual { position:relative; min-height:430px; display:grid; place-items:center; }
.ledger-window { position:relative; width:min(100%,460px); padding:22px; border:1px solid #d7e3ed; border-radius:24px; background:rgba(255,255,255,.92); box-shadow:0 28px 70px rgba(42,60,64,.13); transform:rotate(1.2deg); }
.ledger-window-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:18px; border-bottom:1px solid #e2edf5; color:#597487; font-size:10px; font-weight:750; text-transform:uppercase; letter-spacing:.08em; }
.ledger-status { color:#00679e; text-transform:none; letter-spacing:0; }
.ledger-summary { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0; }
.ledger-summary > div { padding:16px; border-radius:16px; background:#f1f6fa; }
.ledger-summary small, .ledger-summary strong { display:block; }
.ledger-summary small { color:#8da3b2; font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.ledger-summary strong { margin-top:5px; color:var(--company-ink); font-family:Georgia,"Times New Roman",serif; font-size:18px; font-weight:600; }
.ledger-lines { display:grid; gap:9px; padding:6px 4px 18px; }
.ledger-lines span { height:8px; width:var(--w); border-radius:999px; background:linear-gradient(90deg,#d3e3ee 0 68%,#eaf5fb 68%); }
.ledger-upload { display:grid; grid-template-columns:44px 1fr auto; align-items:center; gap:12px; padding:13px 14px; border-radius:16px; background:var(--company-ink); color:#fff; }
.ledger-upload-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.12); font-size:18px; }
.ledger-upload strong,.ledger-upload small { display:block; }
.ledger-upload strong { font-size:12px; }
.ledger-upload small { margin-top:2px; color:rgba(255,255,255,.62); font-size:9px; }
.float-card { position:absolute; min-width:190px; padding:13px 15px; border:1px solid #dbe6ef; border-radius:15px; background:#fff; box-shadow:0 16px 35px rgba(40,55,58,.12); }
.float-card > span { display:block; margin-bottom:6px; color:var(--company-accent); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.float-card strong,.float-card small { display:block; }
.float-card strong { font-size:12px; }
.float-card small { margin-top:3px; color:#7a90a0; font-size:9px; }
.float-card-one { left:-16px; top:44px; transform:rotate(-2deg); }
.float-card-two { right:-4px; bottom:38px; transform:rotate(2deg); }

.company-facts { position:relative; z-index:4; border-top:1px solid var(--company-line); border-bottom:1px solid var(--company-line); background:#fff; }
.company-facts-grid { display:grid; grid-template-columns:repeat(3,1fr); }
.company-facts-grid > div { min-height:92px; padding:22px 26px; border-right:1px solid var(--company-line); display:flex; flex-direction:column; justify-content:center; }
.company-facts-grid > div:first-child { padding-left:0; }
.company-facts-grid > div:last-child { border-right:0; }
.company-facts small { color:#8ca0af; font-size:9px; font-weight:750; text-transform:uppercase; letter-spacing:.1em; }
.company-facts strong { margin-top:5px; color:var(--company-ink); font-size:12px; line-height:1.5; }
.company-facts a { color:inherit; text-decoration:none; }

.company-section { padding:clamp(70px,8vw,110px) 0; }
.service-section { background:#f7fbfe; }
.company-section-heading { max-width:780px; margin-bottom:44px; }
.company-section-heading h2,.company-contact-band h2 { font-family:Georgia,"Times New Roman",serif; font-weight:500; color:var(--company-ink); font-size:clamp(32px,4.4vw,52px); letter-spacing:-.035em; }
.company-section-heading p { color:var(--company-muted); }
.service-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.service-card { min-height:300px; display:flex; flex-direction:column; padding:28px; border:1px solid var(--company-line); border-radius:8px; background:#fff; box-shadow:none; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.service-card:hover { transform:translateY(-3px); border-color:#c8d9e5; box-shadow:0 16px 36px rgba(33,51,56,.07); }
.service-card-top { display:flex; justify-content:space-between; align-items:center; }
.service-number { color:var(--company-accent); }
.service-arrow { color:#9aa4a7; }
.service-card h3 { margin:42px 0 12px; color:var(--company-ink); font-family:Georgia,"Times New Roman",serif; font-size:25px; font-weight:600; }
.service-card p { min-height:0; margin:0 0 30px; color:#6b7f8c; }
.service-card a { margin-top:auto; color:var(--company-green); }
.company-section-soft { background:#eef5fa; }
.company-content-split { grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr); }
.company-richtext { color:#405c70; font-size:15px; line-height:1.82; }
.company-richtext h2,.company-richtext h3 { color:var(--company-ink); font-family:Georgia,"Times New Roman",serif; font-weight:600; }
.company-richtext h2 { font-size:30px; }
.company-richtext h3 { font-size:22px; }
.company-richtext a { color:var(--company-green); }
.company-richtext blockquote { border-left-color:var(--company-accent); background:#f7fbfe; padding:16px 18px; color:#5b7382; }
.company-richtext table { width:100%; margin:1.6em 0; border-collapse:collapse; border-spacing:0; overflow:hidden; border:1px solid var(--company-line); background:#fff; font-size:13px; line-height:1.55; }
.company-richtext th,.company-richtext td { padding:12px 14px; border:1px solid var(--company-line); text-align:left; vertical-align:top; }
.company-richtext th { background:var(--company-accent-soft); color:var(--company-ink); font-weight:750; }
.company-richtext tbody tr:nth-child(even) td { background:#f8fbfd; }
.company-richtext pre { overflow:auto; margin:1.5em 0; padding:14px 16px; border:1px solid var(--company-line); border-radius:8px; background:#f4f8fb; color:#28485f; font-size:12px; }
.company-richtext code { padding:.12em .32em; border-radius:4px; background:#eef5fa; color:#17486f; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.92em; }
.company-richtext pre code { padding:0; background:transparent; }
.company-richtext u { text-decoration-thickness:1px; text-underline-offset:2px; }

.company-mini-proof { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.company-mini-proof span { padding:7px 10px; border:1px solid #cddbe6; border-radius:999px; color:#71879a; font-size:10px; }

.company-process-section { padding:80px 0; background:#fff; border-top:1px solid var(--company-line); }
.company-process-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; align-items:start; }
.company-process-list { list-style:none; margin:0; padding:0; border-top:1px solid var(--company-line); }
.company-process-list li { display:grid; grid-template-columns:48px 1fr; gap:14px; padding:22px 0; border-bottom:1px solid var(--company-line); }
.company-process-list li > span { color:var(--company-accent); font-size:11px; font-weight:800; }
.company-process-list strong,.company-process-list small { display:block; }
.company-process-list strong { color:var(--company-ink); font-size:15px; }
.company-process-list small { margin-top:5px; color:#7a90a0; font-size:11px; line-height:1.55; }

.company-contact-band { padding:72px 0; background:var(--company-ink); }
.company-contact-band .company-eyebrow { color:#4da0d1; }
.company-contact-band h2 { color:#fff; }
.company-contact-actions .contact-big { font-family:Georgia,"Times New Roman",serif; font-size:25px !important; font-weight:500 !important; }
.company-button.light { background:#fff; color:var(--company-ink); }
.company-button.ghost-light { border:1px solid rgba(255,255,255,.3); color:#fff; }
.company-button.ghost-light:hover { background:rgba(255,255,255,.08); }
.compact-actions { margin-top:10px; }

.company-page-hero { padding:72px 0 62px; background:var(--company-soft); color:var(--company-ink); border-bottom:1px solid var(--company-line); }
.company-page-hero.service { background:#eef6fb; }
.company-page-hero.legal { background:#eef5fa; color:var(--company-ink); }
.company-page-hero .company-eyebrow { color:var(--company-accent); }
.company-page-hero h1 { color:var(--company-ink); font-family:Georgia,"Times New Roman",serif; font-weight:500; }
.company-page-hero p { color:#627a8b; }
.company-page-grid { grid-template-columns:minmax(0,1fr) 300px; }
.company-page-aside { border-radius:8px; background:#f2f4f1; border-color:#d9e6ef; }
.company-page-aside .aside-kicker { margin-bottom:14px; color:var(--company-accent); font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.11em; }
.company-page-aside .company-button.primary { background:var(--company-green); }
.company-inline-note { padding-top:16px; border-top:1px solid var(--company-line); color:#718084; font-size:12px; }
.company-contact-cards-wrap { background:#fff; border-bottom:1px solid var(--company-line); }
.company-contact-cards { display:grid; grid-template-columns:repeat(4,1fr); }
.company-contact-cards article { min-height:145px; padding:26px 24px; border-right:1px solid var(--company-line); display:flex; flex-direction:column; align-items:flex-start; }
.company-contact-cards article:first-child { padding-left:0; }
.company-contact-cards article:last-child { border-right:0; }
.company-contact-cards small { color:#8a9497; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }
.company-contact-cards strong,.company-contact-cards > article > a:not(.mini-link) { margin-top:10px; color:var(--company-ink); font-family:Georgia,"Times New Roman",serif; font-size:17px; font-weight:600; line-height:1.45; text-decoration:none; }
.company-contact-cards .mini-link { margin-top:auto; color:var(--company-green); font-size:10px; font-weight:750; text-decoration:none; }

.company-footer { padding:60px 0 20px; background:#103247; color:#c2d4df; }
.company-footer-grid { grid-template-columns:1.25fr .8fr .9fr .7fr; gap:42px; }
.company-footer .company-brand strong { color:#fff; }
.company-footer .company-brand small { color:#94a8b8; max-width:280px; white-space:normal; text-transform:none; }
.company-footer-note { color:#89a2b1 !important; line-height:1.5; }
.company-legal-note { margin-top:34px; padding:18px 0; border-top:1px solid rgba(255,255,255,.09); color:#90a8b7; font-size:10px; line-height:1.6; }
.company-footer-bottom { margin-top:0; }

@media (max-width: 980px) {
    .company-info-inner { align-items:flex-start; flex-direction:column; padding:7px 0; gap:3px; }
    .company-info-left span + span::before { display:none; }
    .company-hero-grid,.company-content-split,.company-contact-grid,.company-page-grid,.company-process-grid { grid-template-columns:1fr; }
    .company-hero-visual { max-width:650px; }
    .company-contact-cards { grid-template-columns:1fr 1fr; }
    .company-contact-cards article:nth-child(2) { border-right:0; }
    .company-contact-cards article:first-child { padding-left:24px; }
    .company-contact-cards article:nth-child(-n+2) { border-bottom:1px solid var(--company-line); }
    .company-footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 720px) {
    .company-site .public-inner { width:min(100% - 30px,1180px); }
    .company-nav-row { flex-direction:column; align-items:stretch; padding:14px 0; gap:12px; }
    .company-nav { flex-wrap:nowrap; overflow-x:auto; justify-content:flex-start; padding-bottom:2px; scrollbar-width:none; }
    .company-nav::-webkit-scrollbar { display:none; }
    .company-nav > a { white-space:nowrap; }
    .company-nav .company-portal-link { margin-left:4px; }
    .company-brand strong { font-size:20px; }
    .company-brand small { max-width:270px; }
    .company-hero { padding:62px 0 72px; }
    .company-hero h1 { font-size:42px; }
    .company-hero-visual { min-height:370px; }
    .float-card-one { left:0; top:25px; }
    .float-card-two { right:0; bottom:22px; }
    .company-facts-grid,.service-grid { grid-template-columns:1fr; }
    .company-facts-grid > div { min-height:auto; padding:18px 0; border-right:0; border-bottom:1px solid var(--company-line); }
    .company-facts-grid > div:last-child { border-bottom:0; }
    .company-contact-cards { grid-template-columns:1fr; }
    .company-contact-cards article { min-height:auto; padding:22px 0 !important; border-right:0; border-bottom:1px solid var(--company-line); }
    .company-contact-cards article:last-child { border-bottom:0; }
    .company-footer-grid { grid-template-columns:1fr; }
}
@media (max-width: 500px) {
    .company-info-left { display:none; }
    .company-info-inner { min-height:30px; justify-content:center; align-items:center; }
    .company-info-right { width:100%; justify-content:space-between; }
    .company-brand small { max-width:210px; }
    .company-hero h1 { font-size:36px; }
    .ledger-window { padding:17px; }
    .float-card { min-width:160px; }
    .company-actions { flex-direction:column; align-items:stretch; }
    .company-button { width:100%; }
    .company-hero-visual { min-height:350px; }
}


/* ==========================================================
   Hero-Schärfe-Fix
   Verhindert weiche Schrift durch gedrehte/transformierte Layer.
   ========================================================== */
.company-hero-visual,
.company-hero-visual * {
    -webkit-font-smoothing: antialiased;
    text-rendering: geometricPrecision;
}
.company-hero-visual {
    filter: none !important;
    opacity: 1 !important;
}
.company-hero-visual .ledger-window {
    transform: none !important;
    background: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
.company-hero-visual .float-card,
.company-hero-visual .float-card-one,
.company-hero-visual .float-card-two {
    transform: none !important;
    background: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Upload-Bereichsauswahl */
.field-help { display:block; margin-top:5px; color:var(--muted); font-size:10px; font-weight:400; line-height:1.45; }


/* Odoo-Zuständigkeiten im Kundenportal */
.responsibility-panel { margin: 2px 0 4px; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-soft); }
.responsibility-panel-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; }
.responsibility-panel-head strong { display:block; margin-top:3px; font-size:13px; }
.responsibility-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px; }
.responsibility-item,.responsibility-card { min-width:0; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.responsibility-item > span,.responsibility-area { display:block; color:var(--muted); font-size:10px; font-weight:750; text-transform:uppercase; letter-spacing:.06em; }
.responsibility-item strong,.responsibility-card strong { display:block; margin-top:5px; color:var(--ink); font-size:13px; line-height:1.35; overflow-wrap:anywhere; }
.responsibility-item a,.responsibility-card a { display:inline-block; margin-top:7px; color:var(--primary); font-size:11px; text-decoration:none; overflow-wrap:anywhere; }
.responsibility-item a:hover,.responsibility-card a:hover { text-decoration:underline; }
.responsibility-grid-wide { gap:14px; }
.responsibility-card { padding:18px; border-color:#dce8f1; background:#f8fbfd; }
.responsibility-card small { display:block; min-height:34px; margin-top:7px; color:var(--muted); font-size:10px; line-height:1.5; }
@media (max-width: 760px) { .responsibility-grid { grid-template-columns:1fr; } .responsibility-card small { min-height:0; } }


/* Mehrfachupload */
.multi-file-summary {
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-soft);
    color: var(--ink);
    font-size: 12px;
}
.multi-file-summary strong { display:block; margin-bottom:6px; color:var(--primary); }
.multi-file-summary ul { margin:0; padding-left:20px; color:var(--muted); }
.multi-file-summary li + li { margin-top:2px; }
.compact-alert { margin:0 0 8px; padding:8px 10px; }

/* Firmenwebsite: vier Leistungsbereiche auf der Startseite */
@media (min-width: 981px) {
    .company-site .service-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 721px) and (max-width: 980px) {
    .company-site .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Original-Dateiname v25 */
.upload-name-preflight {
    margin-top: -2px;
    padding: 9px 11px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 11px;
    line-height: 1.45;
}
.rename-document { position: relative; }
.rename-document > summary { list-style: none; cursor: pointer; }
.rename-document > summary::-webkit-details-marker { display: none; }
.rename-document-form {
    position: absolute;
    z-index: 20;
    right: 0;
    top: calc(100% + 6px);
    display: flex;
    gap: 6px;
    min-width: 320px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
    box-shadow: var(--shadow);
}
.rename-document-form input[type="text"] { min-width: 210px; }
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
@media (max-width: 760px) {
    .rename-document-form { position: static; min-width: 0; flex-direction: column; margin-top: 6px; }
    .rename-document-form input[type="text"] { min-width: 0; width: 100%; }
}

/* historical rows whose true original filename was never stored */
.document-name-warning { color: #b42318; font-weight: 600; }
.upload-name-preflight { font-weight: 600; }


/* editierbare Original-Dateinamen; interne Leerzeichen bleiben erhalten */
.filename-editor {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-soft, #f7f9fc);
}
.filename-editor[hidden] { display: none !important; }
.filename-editor > .field-help { margin-top: -4px; }
.filename-editor-row {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}
.filename-editor-row > span { font-size: .88rem; color: var(--muted); }
.filename-editor-row input { width: 100%; white-space: pre; }
@media (max-width: 620px) {
    .filename-editor-row { grid-template-columns: 1fr; gap: 4px; }
}

/* echte Upload-Fortschrittsanzeige */
.upload-progress {
    display: grid;
    gap: 9px;
    padding: 14px;
    border: 1px solid #cfe0ec;
    border-radius: 12px;
    background: #f7fbfe;
}
.upload-progress[hidden] { display: none !important; }
.upload-progress-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.upload-progress-head strong { color:var(--ink); font-size:12px; }
.upload-progress-head span { color:var(--primary); font-size:12px; font-weight:750; font-variant-numeric:tabular-nums; }
.upload-progress progress {
    display:block;
    width:100%;
    height:12px;
    border:0;
    border-radius:999px;
    overflow:hidden;
    background:#e5edf3;
    accent-color:var(--primary);
}
.upload-progress progress::-webkit-progress-bar { background:#e5edf3; border-radius:999px; }
.upload-progress progress::-webkit-progress-value { background:var(--primary); border-radius:999px; }
.upload-progress progress::-moz-progress-bar { background:var(--primary); border-radius:999px; }
.upload-progress-meta { color:var(--muted); font-size:10px; line-height:1.45; }
.upload-actions { align-items:center; }
.upload-actions #upload-submit { min-width:160px; }
@media (max-width:620px) {
    .upload-progress-head { align-items:flex-start; }
    .upload-actions > .button { width:100%; }
}

/* Odoo-Zuständigkeiten im Kundenportal */
.responsibility-subtitle {
    display: block;
    margin: 14px 0 7px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.compact-responsibilities {
    display: grid;
    gap: 7px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
}
.responsibility-contact {
    display: grid;
    grid-template-columns: minmax(120px,.9fr) minmax(130px,1fr);
    gap: 3px 10px;
    align-items: baseline;
    font-size: 11px;
}
.responsibility-contact > span { color: var(--muted); }
.responsibility-contact > strong { margin: 0; font-size: 11px; font-weight: 700; }
.responsibility-contact > a { grid-column: 2; margin: 0; font-size: 10px; }
.responsibility-empty { color: var(--muted); font-size: 11px; line-height: 1.5; }
.responsibility-customer-name { margin-bottom: 10px; font-size: 13px; font-weight: 700; }
.customer-responsibility-panel { margin-top: 2px; }
.customer-dms-link { margin-top: 12px !important; font-weight: 700; }
@media (max-width: 760px) {
    .responsibility-contact { grid-template-columns: 1fr; }
    .responsibility-contact > a { grid-column: 1; }
}

/* Ansprechpartner nebeneinander als DIV-Blöcke */
.responsibility-list-section { padding: 0; overflow: hidden; }
.responsibility-list-head { padding: 24px 26px 20px; border-bottom: 1px solid var(--line); }
.responsibility-list-head h2 { margin: 4px 0 5px; }
.responsibility-list-head p { margin: 0; font-size: 12px; }
.responsibility-customer-list { display: block; }
.responsibility-customer { padding: 20px 26px 24px; border-bottom: 1px solid var(--line); }
.responsibility-customer:last-child { border-bottom: 0; }
.responsibility-customer-head { margin-bottom: 14px; }
.responsibility-customer-head h3 { margin: 0; font-size: 14px; font-weight: 750; }
.responsibility-boxes {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: stretch;
}
.responsibility-box {
    flex: 1 1 190px;
    min-width: 0;
    padding: 16px 18px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
}
.responsibility-department { margin-bottom: 8px; color: var(--muted); font-size: 11px; font-weight: 700; line-height: 1.45; }
.responsibility-person { min-width: 0; }
.responsibility-person > strong { display: block; color: var(--ink); font-size: 13px; font-weight: 750; line-height: 1.4; }
.responsibility-contact-lines { display: flex; flex-direction: column; gap: 3px; margin-top: 7px; }
.responsibility-contact-lines a { color: var(--primary); font-size: 11px; line-height: 1.45; text-decoration: none; overflow-wrap: anywhere; }
.responsibility-contact-lines a:hover { text-decoration: underline; }
.responsibility-list-empty { padding: 20px 26px; color: var(--muted); font-size: 11px; line-height: 1.55; }
@media (max-width: 700px) {
    .responsibility-list-head, .responsibility-list-empty { padding-left: 17px; padding-right: 17px; }
    .responsibility-customer { padding: 17px; }
    .responsibility-boxes { display: grid; grid-template-columns: 1fr; gap: 9px; }
    .responsibility-box { padding: 14px 15px; }
}


/* Archivperiode: kundenspezifische Odoo-Vorgabe */
.archive-period-panel { margin-top: .25rem; }
.archive-period-grid { display: flex; gap: 1rem; flex-wrap: wrap; align-items: end; }
.archive-period-grid > label { flex: 1 1 220px; min-width: 0; }
.archive-period-grid > label[hidden] { display: none !important; }
.archive-period-note { margin: .75rem 0 0; }
@media (max-width: 640px) {
  .archive-period-grid { display: block; }
  .archive-period-grid > label { display: block; margin-top: .75rem; }
}

/* Optionale PDF-Zusammenführung beim Upload */
.pdf-merge-panel {
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f8fbfd;
}
.check-row.pdf-merge-toggle {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    cursor: pointer;
}
.pdf-merge-toggle input { margin-top: 3px; }
.pdf-merge-toggle span { display: grid; gap: 3px; }
.pdf-merge-toggle strong { font-size: 12px; color: var(--ink); }
.pdf-merge-toggle small { color: var(--muted); font-size: 10px; line-height: 1.45; }
.pdf-merge-toggle:has(input:disabled) { opacity: .55; cursor: not-allowed; }
.pdf-merge-options { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.pdf-merge-options[hidden] { display: none !important; }
.pdf-merge-state { margin-top: 8px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.merge-file-list { margin: 7px 0 0; padding: 0; list-style: none; display: grid; gap: 5px; }
.merge-file-list li { display: flex; align-items: center; gap: 7px; min-width: 0; }
.merge-file-index { width: 20px; flex: 0 0 20px; color: var(--muted); font-variant-numeric: tabular-nums; }
.merge-file-name { min-width: 0; flex: 1 1 auto; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.merge-file-size { flex: 0 0 auto; color: var(--muted); font-size: 9px; }
.merge-order-controls { display: inline-flex; gap: 3px; flex: 0 0 auto; }
.merge-order-button { width: 28px; height: 26px; padding: 0; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--primary); cursor: pointer; font-weight: 800; }
.merge-order-button:hover:not(:disabled) { background: #eef7fb; }
.merge-order-button:disabled { opacity: .3; cursor: default; }
@media (max-width: 620px) {
    .merge-file-size { display: none; }
}


/* DMS-Referenzen / Akten */
.upload-mode-panel{margin:0 0 1rem;padding:1rem;border:1px solid var(--border,#d8dee6);border-radius:12px;background:var(--surface-soft,#f7f9fb)}
.upload-mode-options{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:.55rem}
.upload-mode-option{display:flex;align-items:flex-start;gap:.65rem;flex:1 1 280px;padding:.85rem;border:1px solid var(--border,#d8dee6);border-radius:10px;background:#fff;cursor:pointer}
.upload-mode-option input{margin-top:.2rem}
.upload-mode-option span{display:flex;flex-direction:column;gap:.2rem}
.upload-mode-option small{color:var(--muted,#667085);font-weight:400;line-height:1.35}
.upload-mode-option:has(input:checked){border-color:#2b6cb0;box-shadow:0 0 0 2px rgba(43,108,176,.12)}