*{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
body{margin:0;font-family:Arial,sans-serif;background:#f3f6fb;color:#0f172a;position:relative}
body:not(.dashboard-body)::before{
  content:"";
  position:fixed;
  inset:0;
  background:url("Smart Business Solutions.jpeg") center center / cover no-repeat;
  opacity:.05;
  z-index:-2;
  pointer-events:none;
}
body:not(.dashboard-body)::after{
  content:"";
  position:fixed;
  inset:0;
  background:rgba(255,255,255,.88);
  z-index:-1;
  pointer-events:none;
}
a{color:inherit}
.container{max-width:100%;margin:0 auto;padding:24px 32px 40px;box-sizing:border-box}
.nav{position:sticky;top:0;z-index:20;background:#ffffff;border-bottom:1px solid #e5e7eb}
.nav-inner{max-width:100%;margin:0 auto;padding:12px 32px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.brand-link{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand-logo{height:44px;max-width:170px;object-fit:contain;display:block}
.brand-fallback{display:flex;flex-direction:column}
.brand-main{font-size:26px;font-weight:800;line-height:1}
.brand-sub{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#64748b}
.nav-links,.nav-userbox{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.nav-links a,.logout-link{color:#334155;text-decoration:none;padding:10px 12px;border-radius:12px}
.nav-links a:hover,.logout-link:hover{background:#f1f5f9}
.nav-userbox{gap:12px}
.nav-userstack{display:flex;flex-direction:column;align-items:flex-start}
.nav-user{font-weight:700;color:#0f172a}
.nav-role{font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.08em}
.clean-shell{display:grid;gap:18px}
.page-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;padding:6px 2px}
.eyebrow{margin:0 0 6px;color:#64748b;font-size:12px;text-transform:uppercase;letter-spacing:.12em;font-weight:700}
h1,h2,h3{margin:0}
.page-sub{margin:8px 0 0;color:#64748b;max-width:780px}
.quick-actions{display:flex;gap:10px;flex-wrap:wrap}
.btn-link,.btn-small,button{border:none;border-radius:12px;padding:11px 15px;background:#0f172a;color:#fff;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font:inherit}
.btn-link.secondary{background:#e2e8f0;color:#0f172a}
.btn-small{padding:8px 12px;font-size:14px}
.btn-small.danger{background:#b91c1c}
.kpi-grid.clean{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kpi-card,.panel,.mini-item,.lead-card,.card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;box-shadow:0 2px 8px rgba(15,23,42,.04)}
.kpi-card{padding:18px;display:flex;flex-direction:column;gap:8px}
.kpi-card span{font-size:12px;color:#64748b;text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.kpi-card strong{font-size:32px;line-height:1}
.kpi-card.dark{background:#0f172a;color:#fff}
.kpi-card.dark span{color:#cbd5e1}
.kpi-card.danger{background:#fff7ed}
.span-2{grid-column:span 2}
.dashboard-grid-clean{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.panel{padding:20px;min-width:0}
.panel.wide{grid-column:span 2}
.panel-head,.toolbar,.lead-card-head,.card-head,.card-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.panel-head a{color:#0f172a;font-weight:700;text-decoration:none}
.clean-toolbar{margin-bottom:14px}
.stack-list,.clean-cards{display:grid;gap:12px}
.mini-item,.lead-card{padding:16px;min-width:0}
.remind{background:#f8fafc}
.mini-item p,.lead-card p{margin:4px 0 0;color:#64748b}
.clean-lead-card{display:grid;gap:10px}
.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch}
.clean-table table, table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:12px 10px;border-bottom:1px solid #e5e7eb;font-size:14px}
th{color:#64748b;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.status-pill,.meta-chip,.date-chip,.score-pill{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;font-size:12px;font-weight:700}
.status-neutral{background:#e5e7eb;color:#374151}
.status-info{background:#dbeafe;color:#1d4ed8}
.status-accent{background:#ede9fe;color:#6d28d9}
.status-warn{background:#fef3c7;color:#92400e}
.status-success{background:#dcfce7;color:#166534}
.status-danger{background:#fee2e2;color:#b91c1c}
.meta-chip{background:#f1f5f9;color:#334155}
.date-chip{background:#0f172a;color:#fff}
.score-pill{background:#dcfce7;color:#166534}
.lead-meta{display:flex;gap:8px;flex-wrap:wrap}
.lead-step{font-weight:600;color:#334155 !important}
.lead-owner{font-size:13px}
.form-grid,.grid-1,.grid-2,.grid-5{display:grid;gap:12px}
.form-grid,.grid-2,.clean-form{grid-template-columns:repeat(2,1fr)}
input,textarea,select{width:100%;padding:12px 14px;border:1px solid #dbe4ee;border-radius:12px;font:inherit;background:#fff;min-width:0}
textarea{min-height:110px}
.success-msg{color:#065f46;background:#ecfdf5;border:1px solid #a7f3d0;padding:12px 14px;border-radius:12px;margin:0}
.error{color:#b91c1c;background:#fef2f2;border:1px solid #fecaca;padding:12px 14px;border-radius:12px;margin:0}
.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.info-grid div{display:grid;gap:4px;padding:12px;border:1px solid #e5e7eb;border-radius:14px;background:#fafcff;min-width:0}
.info-grid span,.detail-note span{font-size:12px;color:#64748b;text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.detail-note{margin-top:16px;padding:14px;border:1px solid #e5e7eb;border-radius:14px;background:#fafcff}
.detail-note p{margin:8px 0 0;color:#334155;line-height:1.5}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:#f3f6fb}
.login-box{width:100%;max-width:420px;background:#fff;padding:28px;border-radius:20px;border:1px solid #e5e7eb;box-shadow:0 10px 30px rgba(15,23,42,.08)}

code{background:#eef2f7;padding:2px 6px;border-radius:8px}

.drag-builder-grid{display:grid;gap:14px}
.drag-widget-card{background:#fff;border:1px solid #dbe4ee;border-radius:16px;padding:16px;box-shadow:0 2px 8px rgba(15,23,42,.04)}
.drag-widget-card.dragging{opacity:.55;border-color:#94a3b8}
.drag-widget-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
.drag-widget-head p{margin:4px 0 0;color:#64748b;font-size:12px}
.drag-handle{font-size:22px;line-height:1;color:#64748b;cursor:grab;user-select:none}
.drag-widget-controls{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.inline-option{display:flex;gap:8px;align-items:center;color:#334155;font-size:14px}
.inline-option select{width:auto;min-width:120px}

.offer-page{display:grid;gap:18px}
.offer-hero-card{padding:24px;border:1px solid #dbe4ee;background:linear-gradient(135deg,#f8fbff 0%,#eef4ff 52%,#f8f5ff 100%)}
.offer-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.offer-hero-badges{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.offer-badge{display:inline-flex;align-items:center;padding:10px 14px;border-radius:999px;font-size:13px;font-weight:700}
.offer-badge-primary{background:#0f172a;color:#fff}
.offer-badge-soft{background:#e0e7ff;color:#4338ca}
.offer-note-card{margin-bottom:0;padding:16px;background:#fffdf5;border-color:#f5deb3}
.offer-form-card{padding:22px;border-color:#dbe4ee;box-shadow:0 10px 28px rgba(15,23,42,.06)}
.offer-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.offer-form-grid{gap:14px}
.offer-label{display:block;margin-bottom:8px;font-size:12px;color:#475569;text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.offer-accent-box{padding:16px;border:1px solid #dbe4ee;border-radius:16px;background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)}
.offer-checkbox-row{display:flex;align-items:center;gap:10px;min-height:48px;padding:12px 14px;border:1px solid #dbe4ee;border-radius:12px;background:#f8fbff;font-weight:600;color:#334155}
.offer-checkbox-row input{width:auto;margin:0}
.offer-list-card{padding:18px;border-left:4px solid #c7d2fe}
.offer-inline-label{font-weight:700;color:#475569}
.offer-topic-pill{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#e0ecff;color:#1d4ed8;font-size:13px;font-weight:700}
.offer-reminder-date{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;background:#ecfeff;color:#155e75;font-size:12px;font-weight:700}
.offer-list-card .card-head p{margin:6px 0 0;color:#475569}
.offer-list-card .card-head strong{font-size:18px;color:#0f172a}
.offer-form-card input:focus,.offer-form-card select:focus,.offer-form-card textarea:focus{outline:none;border-color:#93c5fd;box-shadow:0 0 0 4px rgba(147,197,253,.22)}

body.dashboard-body{
  background:linear-gradient(180deg,#eef7ff 0%,#f5f9ff 32%,#f3f6fb 100%);
}

.premium-nav{
  background:linear-gradient(180deg,rgba(233,244,255,.98) 0%,rgba(248,252,255,.96) 100%);
  border-bottom:1px solid #d6e6f5;
  backdrop-filter:blur(8px);
}

.premium-nav-inner{
  display:grid;
  grid-template-columns:minmax(240px,320px) 1fr auto;
  align-items:start;
  gap:18px;
}

.nav-brand-area{display:grid;gap:10px;align-content:start}
.nav-brand-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.nav-brand-copy{display:grid;gap:4px}
.nav-brand-title{font-size:14px;font-weight:800;color:#12345b;letter-spacing:.04em;text-transform:uppercase}
.nav-brand-subtitle{font-size:12px;color:#52708f;line-height:1.45}

.nav-main-links{
  display:grid;
  grid-template-columns:repeat(6,max-content);
  justify-content:center;
  align-items:center;
  gap:10px 10px;
  padding-top:8px;
}

.nav-mobile-drawer{
  display:contents;
}

.nav-main-links a,
.nav-side-links a,
.logout-link{
  color:#163253;
  text-decoration:none;
  padding:9px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.6);
  border:1px solid transparent;
  transition:all .18s ease;
  font-size:14px;
  line-height:1.2;
  white-space:nowrap;
}

.nav-main-links a:hover,
.nav-side-links a:hover,
.logout-link:hover{
  background:#12345b;
  color:#fff;
  border-color:#12345b;
  transform:translateY(-1px);
}

.nav-side-panel{
  display:grid;
  gap:12px;
  justify-items:stretch;
  min-width:190px;
}

.nav-side-links{
  display:grid;
  gap:10px;
  width:100%;
}

.nav-side-links a{
  text-align:left;
}

.premium-userbox{
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  padding:12px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.72);
  border:1px solid #d6e6f5;
}

.nav-toggle{
  display:none;
  width:44px;
  height:44px;
  border:none;
  border-radius:12px;
  background:#12345b;
  padding:0;
  cursor:pointer;
}

.nav-toggle span{
  display:block;
  width:20px;
  height:2px;
  background:#fff;
  margin:4px auto;
  border-radius:2px;
}

.dashboard-shell{gap:20px;padding-top:22px}
.dashboard-hero-banner{
  position:relative;
  overflow:hidden;
  min-height:260px;
  padding:34px;
  border-radius:28px;
  border:1px solid #d5e6f5;
  background:
    linear-gradient(90deg,rgba(7,27,55,.82) 0%,rgba(18,52,91,.72) 34%,rgba(178,211,241,.34) 100%),
    url('assets/dashboard-hero.jpg') center center / cover no-repeat;
  box-shadow:0 18px 40px rgba(18,52,91,.14);
}
.dashboard-hero-banner:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,0));
  pointer-events:none;
}
.dashboard-hero-content{position:relative;z-index:1;max-width:640px;color:#fff;display:grid;gap:12px}
.eyebrow.light{color:#d8ebff}
.dashboard-hero-content h1{font-size:40px;line-height:1.05;color:#fff}
.hero-sub{color:#e8f2ff;max-width:620px}
.dashboard-actions .btn-link{background:#12345b}
.dashboard-actions .btn-link.secondary{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.34);color:#fff}
.dashboard-actions .btn-link.secondary:hover{background:#0f172a}
.dashboard-kpis .kpi-card,
.dashboard-grid-premium .panel{
  border-color:#d7e5f3;
  box-shadow:0 10px 26px rgba(18,52,91,.06);
}
.dashboard-grid-premium .panel{
  background:linear-gradient(180deg,#ffffff 0%,#fafdff 100%);
}
.dashboard-grid-premium .mini-item{
  background:#f6fbff;
  border:1px solid #deebf6;
}
.dashboard-grid-premium .panel-head a,
.dashboard-grid-premium td a{color:#12345b;font-weight:700}
.dashboard-grid-premium .clean-table table tbody tr:hover{background:#f7fbff}

.remind-blue{
  background:#eaf3ff !important;
  border:1px solid #7fb3ff !important;
}
.remind-blue strong,
.remind-blue h3,
.remind-blue h4{
  color:#0b3d91 !important;
}
.remind-blue p,
.remind-blue span{
  color:#355b8c !important;
}
.remind-red{
  background:#ffe5e5 !important;
  border:1px solid #e14b4b !important;
  box-shadow:0 0 0 2px rgba(225,75,75,.08);
}
.remind-red strong,
.remind-red h3,
.remind-red h4{
  color:#a40000 !important;
}
.remind-red p,
.remind-red span{
  color:#7a1f1f !important;
}

/* Klickbare KPI-Kacheln */
.kpi-link{
  text-decoration:none;
  cursor:pointer;
  transition:transform .15s,box-shadow .15s;
  display:flex;
  flex-direction:column;
}
.kpi-link:hover{
  transform:translateY(-3px);
  box-shadow:0 6px 20px rgba(18,52,91,.14);
}

/* Klickbare Mini-Items */
.dashboard-item-link{text-decoration:none;display:block;transition:transform .15s,box-shadow .15s}
.dashboard-item-link:hover{transform:translateY(-2px);box-shadow:0 4px 14px rgba(18,52,91,.12)}
.dashboard-item-link strong,.dashboard-item-link p{color:inherit}

/* Formular-Hilfsklassen */
.span-2-cols{grid-column:1 / -1}
.field-group{display:grid;gap:6px}
.field-label{margin:0;font-size:12px;font-weight:700;color:#475569;text-transform:uppercase;letter-spacing:.08em}

/* Lead-Formular volle Breite */
.lead-form-grid{display:grid;gap:14px}
.form-section-label{margin:0;font-size:11px;font-weight:800;color:#94a3b8;text-transform:uppercase;letter-spacing:.12em;padding-bottom:4px;border-bottom:1px solid #e5e7eb}
.lf-row{display:grid;gap:10px;align-items:start}
.lf-2{grid-template-columns:1fr 1fr}
.lf-3{grid-template-columns:1fr 1fr 1fr}
.lf-4{grid-template-columns:1fr 1fr 1fr 1fr}
.lf-street{grid-template-columns:3fr 1fr}
.lf-plz{grid-template-columns:1fr 2fr}
.lf-addr{grid-template-columns:3fr 1fr 1fr 2fr}
.lf-span2{grid-column:span 2}
.lf-span3{grid-column:span 3}
.lead-save-btn{padding:11px 28px;font-size:14px;font-weight:700}

/* Kompakte Inputs nur im Lead-Formular */
.lead-form-grid input,
.lead-form-grid select,
.lead-form-grid textarea{padding:9px 12px;font-size:13px}
.lead-form-grid textarea{min-height:72px}

@media(max-width:760px){
  .lf-2,.lf-3,.lf-4,.lf-addr{grid-template-columns:1fr}
  .lf-street,.lf-plz{grid-template-columns:1fr 1fr}
  .lf-span2,.lf-span3{grid-column:auto}
  .lead-save-btn{width:100%}
}

@media (max-width:1280px){
  .nav-main-links{
    grid-template-columns:repeat(5,max-content);
  }
}

@media (max-width:1180px){
  .kpi-grid.clean,
  .dashboard-grid-clean{
    grid-template-columns:1fr;
  }
  .panel.wide,
  .span-2{
    grid-column:auto;
  }
  .premium-nav-inner{
    grid-template-columns:1fr;
  }
  .nav-mobile-drawer{
    display:grid;
    gap:16px;
  }
  .nav-main-links{
    grid-template-columns:repeat(4,max-content);
    justify-content:flex-start;
    padding-top:0;
  }
  .nav-side-panel{
    justify-items:stretch;
  }
  .premium-userbox{
    justify-content:space-between;
    gap:12px;
  }
}

@media (max-width:760px){
  .container{
    padding:16px 12px 28px;
  }
  .form-grid,
  .grid-2,
  .clean-form,
  .info-grid{
    grid-template-columns:1fr;
  }
  .nav-userstack{
    align-items:flex-start;
  }
  .dashboard-shell{
    gap:14px;
    padding-top:14px;
  }
  .dashboard-hero-banner{
    padding:18px;
    min-height:auto;
    border-radius:20px;
  }
  .dashboard-hero-content{
    max-width:100%;
  }
  .dashboard-hero-content h1{
    font-size:28px;
    line-height:1.08;
  }
  .hero-sub{
    max-width:100%;
    font-size:15px;
  }
  .dashboard-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }
  .dashboard-actions .btn-link{
    width:100%;
  }
  .kpi-grid.clean{
    grid-template-columns:1fr;
    gap:12px;
  }
  .dashboard-grid-clean{
    grid-template-columns:1fr;
    gap:14px;
  }
  .panel,
  .kpi-card{
    padding:16px;
    border-radius:16px;
  }
  .panel-head,
  .toolbar,
  .lead-card-head,
  .card-head,
  .card-actions{
    flex-direction:column;
    align-items:flex-start;
  }
  .mini-item{
    padding:14px;
  }
  .mini-item .date-chip{
    margin-top:8px;
  }
  .clean-table table{
    min-width:640px;
  }
  .nav-toggle{
    display:block;
  }
  .nav-mobile-drawer{
    display:none;
    width:100%;
    gap:16px;
    padding-top:12px;
  }
  .premium-nav.is-open .nav-mobile-drawer{
    display:grid;
  }
  .nav-main-links{
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
    justify-content:stretch;
    gap:10px;
  }
  .nav-main-links a,
  .nav-side-links a{
    width:100%;
    text-align:left;
    white-space:normal;
  }
  .nav-side-links{
    grid-template-columns:1fr 1fr;
    display:grid;
  }
}

@media (max-width:520px){
  .brand-logo{
    height:46px;
    max-width:180px;
  }
  .nav-brand-subtitle{
    font-size:11px;
  }
  .dashboard-hero-content h1{
    font-size:24px;
  }
  .kpi-card strong{
    font-size:26px;
  }
  .panel h2{
    font-size:26px;
  }
  .clean-table table{
    min-width:560px;
  }
}

/* Users page polish */
.users-page{display:grid;gap:18px}
.users-intro{padding-bottom:0}
.users-form-card,.users-table-card{padding:22px;border-color:#d7e5f3;box-shadow:0 10px 24px rgba(18,52,91,.06)}
.users-form-card{background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)}
.users-table-card{background:#fff}
.users-card-head{margin-bottom:16px}
.users-form-grid button{grid-column:1 / -1;max-width:320px}
.users-table-card table tbody tr:hover{background:#f7fbff}
.users-table-card td:last-child{text-align:right}
.users-table-card .btn-small.danger{border-radius:12px;padding:10px 14px}
.brand-link{min-width:0}
.brand-logo{height:58px;max-width:250px}
.brand-fallback{padding:6px 0}
@media (max-width:760px){.users-form-grid button{max-width:none}.users-table-card td:last-child{text-align:left}}
