@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  --navy: #071d2e;
  --navy-2: #0c2840;
  --blue: #1769ff;
  --blue-2: #3b8cff;
  --sky: #eaf3ff;
  --ink: #0c1f3a;
  --muted: #68778f;
  --line: #dce5f0;
  --panel: #ffffff;
  --bg: #f4f7fb;
  --green: #18a86b;
  --amber: #d99316;
  --red: #d94a4a;
  --shadow: 0 18px 45px rgba(7, 29, 46, .10);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: Inter, Arial, sans-serif;
  color: var(--ink);
  background: #fff;
  line-height: 1.55;
}

a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button, .btn { cursor: pointer; }

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-weight: 800;
  letter-spacing: -.02em;
}
.brand b {
  color: var(--blue);
  font-size: 38px;
  line-height: 1;
}
.brand span {
  display: block;
  max-width: 120px;
  font-size: 14px;
  line-height: 1.05;
}
.brand.light span { color: #fff; }

.eyebrow {
  display: inline-block;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 12px;
  padding: 14px 22px;
  color: #fff;
  background: linear-gradient(135deg, var(--blue), #0f5be4);
  font-weight: 800;
  box-shadow: 0 12px 28px rgba(23, 105, 255, .22);
  transition: transform .18s ease, box-shadow .18s ease;
}
.btn:hover { transform: translateY(-1px); box-shadow: 0 16px 32px rgba(23, 105, 255, .28); }
.btn.secondary { color: var(--blue); background: #fff; border: 1px solid #cddcf1; box-shadow: none; }
.plain { font-weight: 700; color: #42526c; }

.top {
  height: 88px;
  padding: 0 5.2vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border-bottom: 1px solid #e7edf5;
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(255,255,255,.95);
  backdrop-filter: blur(12px);
}
.top nav { display: flex; gap: 34px; font-weight: 700; color: #526178; }
.top > div { display: flex; align-items: center; gap: 22px; }

.hero {
  min-height: 680px;
  padding: 90px 5.2vw 70px;
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 70px;
  align-items: center;
}
.hero h1 {
  margin: 24px 0 22px;
  font-size: clamp(48px, 6.2vw, 90px);
  line-height: .98;
  letter-spacing: -.055em;
}
.hero h1 em { color: var(--blue); font-style: normal; }
.hero p { max-width: 670px; font-size: 20px; color: var(--muted); }
.actions { display: flex; gap: 14px; margin-top: 30px; }
.checks { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 28px; color: #53637b; font-weight: 600; }

.mock {
  background: var(--navy);
  border-radius: 28px;
  padding: 14px;
  box-shadow: 0 28px 70px rgba(5, 28, 48, .24);
}
.mocktop { padding: 12px 18px 18px; color: #a8bad0; display: flex; justify-content: space-between; }
.mockbody {
  overflow: hidden;
  min-height: 470px;
  border-radius: 20px;
  display: grid;
  grid-template-columns: 155px 1fr;
  background: #f5f8fc;
}
.mockbody aside { background: #071d2e; color: #8fa6bd; padding: 34px 22px; display: flex; flex-direction: column; gap: 24px; }
.mockbody aside b { color: #fff; font-size: 34px; margin-bottom: 14px; }
.mockbody section { padding: 32px; }
.mockbody section header small { display:block; color:#8a98aa; }
.mockbody section header strong { display:block; font-size:28px; }
.kpis { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:24px 0; }
.kpis article { background:#fff; border:1px solid #e1e8f1; border-radius:15px; padding:18px; }
.kpis small,.kpis b,.kpis i { display:block; }
.kpis b { font-size:26px; margin:7px 0; }
.kpis i { color:var(--green); font-style:normal; font-size:12px; }
.chart { height:170px; padding:22px; border-radius:16px; background:#fff; border:1px solid #e1e8f1; display:flex; gap:12px; align-items:flex-end; }
.chart i { flex:1; background:linear-gradient(#4b9aff,#1769ff); border-radius:5px 5px 0 0; }
.rows p { margin:10px 0; padding:13px 15px; border:1px solid #e5ebf3; border-radius:12px; background:#fff; display:flex; justify-content:space-between; gap:12px; font-size:12px; }
.rows span { border-radius:999px; padding:5px 9px; font-size:10px; font-weight:800; }
.green { color:#078451; background:#dff7ed; }
.amber { color:#9c6500; background:#fff0cf; }
.blue { color:#0e5cd7; background:#e3efff; }

.strip {
  display:flex;
  justify-content:space-around;
  gap:25px;
  padding:18px 5vw;
  color:#9aacbf;
  background:var(--navy);
  font-size:12px;
  font-weight:800;
  letter-spacing:.18em;
  overflow:hidden;
}

.section { padding:100px 5.2vw; }
.section h2,.process h2 { margin:16px 0 42px; font-size:clamp(38px,4.5vw,64px); line-height:1.04; letter-spacing:-.04em; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.cards article {
  position:relative;
  min-height:390px;
  padding:32px;
  border:1px solid #dfe7f1;
  border-radius:22px;
  background:#fff;
  box-shadow:0 10px 30px rgba(10,36,61,.05);
}
.cards article > small { color:#8fa0b3; font-weight:800; }
.cards .icon { width:56px; height:56px; display:grid; place-items:center; margin:42px 0 26px; border-radius:16px; background:var(--sky); color:var(--blue); font-weight:800; }
.cards h3 { font-size:25px; margin:0 0 14px; }
.cards p { color:var(--muted); }
.cards a { position:absolute; left:32px; bottom:30px; color:var(--blue); font-weight:800; }

.process {
  padding:100px 5.2vw;
  background:var(--navy);
  color:#fff;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:80px;
}
.process p { color:#aab9c8; }
.steps article { display:grid; grid-template-columns:60px 1fr; gap:20px; padding:25px 0; border-bottom:1px solid rgba(255,255,255,.13); }
.steps article > b { color:var(--blue-2); font-size:24px; }
.steps h3 { margin:0 0 7px; font-size:22px; }

footer {
  padding:38px 5.2vw;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  border-top:1px solid #e2e9f2;
  color:#66758a;
}

/* Login */
.login { min-height:100vh; display:grid; grid-template-columns:1.1fr .9fr; background:#fff; }
.loginvisual { padding:60px 7vw; background:linear-gradient(150deg,#061b2b,#0c2c47); color:#fff; display:flex; flex-direction:column; justify-content:space-between; }
.loginvisual h1 { max-width:690px; margin:22px 0; font-size:clamp(48px,6vw,84px); line-height:1; letter-spacing:-.055em; }
.loginvisual p { max-width:640px; color:#b8c6d3; font-size:20px; }
.loginpanel { display:grid; place-items:center; padding:50px; background:#f5f8fc; }
.loginpanel form { width:min(480px,100%); padding:44px; border:1px solid #dce5f0; border-radius:22px; background:#fff; box-shadow:var(--shadow); }
.loginpanel h2 { margin:15px 0 10px; font-size:38px; }
.loginpanel p,.demo { color:var(--muted); }
.loginpanel label { display:block; margin:18px 0 8px; font-weight:700; }
.loginpanel input {
  width:100%;
  margin-top:8px;
  padding:14px 15px;
  border:1px solid #cfd9e6;
  border-radius:11px;
  outline:none;
}
.loginpanel input:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(23,105,255,.12); }
.loginpanel .btn { width:100%; margin:22px 0 15px; }
.demo { padding:13px; border-radius:10px; background:#f3f6fa; margin-bottom:16px; font-size:13px; }

/* App */
.app {
  min-height:100vh;
  display:grid;
  grid-template-columns:280px 1fr;
  background:var(--bg);
}
.app > aside {
  position:sticky;
  top:0;
  height:100vh;
  padding:34px 22px;
  background:var(--navy);
  color:#fff;
  display:flex;
  flex-direction:column;
}
.app > aside nav { display:flex; flex-direction:column; gap:10px; margin:48px 0; }
.app > aside nav button,#logout {
  width:100%;
  border:0;
  border-radius:12px;
  padding:15px 16px;
  color:#c5d2df;
  background:transparent;
  text-align:left;
  font-weight:600;
}
.app > aside nav button:hover,.app > aside nav button.active { color:#fff; background:#12456b; }
#logout { margin-top:auto; }
.app > main { padding:48px 46px 70px; min-width:0; }
.app > main > header { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin-bottom:30px; }
.app h1 { margin:12px 0 9px; font-size:46px; letter-spacing:-.04em; }
.mode-badge { display:inline-flex; border-radius:999px; padding:7px 12px; background:#e8eef6; color:#52647b; font-size:12px; font-weight:800; }
.mode-badge.supabase { color:#087448; background:#dcf7ea; }
.mode-badge.local { color:#875900; background:#fff0c7; }
.view { display:none; }
.view.active { display:block; }
.appkpis { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.appkpis article,.panel {
  border:1px solid var(--line);
  border-radius:19px;
  background:var(--panel);
  box-shadow:0 8px 22px rgba(12,31,58,.035);
}
.appkpis article { padding:28px 30px; }
.appkpis small { display:block; color:#55667d; margin-bottom:14px; }
.appkpis b { font-size:34px; }
.panel { margin-top:20px; padding:30px; }
.panel h2 { margin:0 0 22px; font-size:28px; }
.pipeline { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
.pipeline article { padding:18px; border-radius:14px; background:#f5f8fc; border:1px solid #e2e9f2; }
.pipeline b { display:block; font-size:27px; }
.pipeline span { color:#697990; font-size:12px; }
.message { position:fixed; z-index:100; top:20px; right:20px; max-width:430px; padding:15px 18px; border-radius:12px; box-shadow:var(--shadow); background:#eaf3ff; color:#164f9c; font-weight:700; }
.message.success { background:#daf5e7; color:#087047; }
.message.error { background:#fee4e4; color:#a92525; }
.empty { padding:28px; text-align:center; color:#8391a4; border:1px dashed #d7e0eb; border-radius:13px; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; min-width:760px; }
th,td { padding:15px 12px; border-bottom:1px solid #e5ebf2; text-align:left; }
th { color:#65758b; font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
td b,td small { display:block; }
td small { color:#8491a2; margin-top:3px; }
select,input {
  border:1px solid #ccd7e4;
  border-radius:9px;
  padding:10px 11px;
  background:#fff;
}
.status-badge { display:inline-block; padding:7px 10px; border-radius:999px; background:#e8f1ff; color:#155cb9; font-size:12px; font-weight:800; }
.danger-button { border:0; border-radius:9px; padding:9px 12px; background:#fee5e5; color:#b62d2d; font-weight:700; }
.paygrid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.paygrid a { padding:28px; border-radius:17px; color:#fff; background:linear-gradient(135deg,#112f4b,#1769ff); font-weight:800; box-shadow:var(--shadow); }

dialog {
  width:min(560px,calc(100% - 32px));
  border:0;
  border-radius:20px;
  padding:32px;
  box-shadow:0 35px 90px rgba(5,24,42,.30);
}
dialog::backdrop { background:rgba(3,15,27,.55); backdrop-filter:blur(3px); }
dialog > button { float:right; border:0; background:#eef2f7; width:36px; height:36px; border-radius:50%; font-size:20px; }
dialog h2 { font-size:30px; margin-top:10px; }
dialog form { display:grid; gap:13px; }
dialog input,dialog select { width:100%; padding:13px; }

/* Portal */
.portal { min-height:100vh; display:grid; grid-template-columns:260px 1fr; background:var(--bg); }
.portal > aside { min-height:100vh; padding:34px 22px; background:var(--navy); color:#fff; display:flex; flex-direction:column; }
.portal > aside nav { display:flex; flex-direction:column; gap:8px; margin:45px 0; }
.portal > aside nav a { padding:14px 15px; border-radius:11px; color:#becbd8; }
.portal > aside nav a.active { color:#fff; background:#12456b; }
.portal > aside > a:last-child { margin-top:auto; color:#c8d3df; }
.portal > main { padding:48px; }
.portal > main > header { display:flex; justify-content:space-between; gap:24px; align-items:center; }
.portal h1 { margin:12px 0 8px; font-size:42px; letter-spacing:-.035em; }
.portal header p { color:var(--muted); }
.user { display:flex; align-items:center; gap:12px; padding:12px 15px; border-radius:14px; background:#fff; border:1px solid var(--line); font-weight:800; }
.user span,.user small { display:block; }
.user small { color:#7b899a; font-weight:500; }
.status { margin:28px 0; padding:32px; border-radius:20px; color:#fff; background:linear-gradient(135deg,#0b2a45,#1769ff); display:flex; justify-content:space-between; align-items:center; box-shadow:var(--shadow); }
.status h2 { font-size:32px; margin:9px 0; }
.ring { width:120px; height:120px; border-radius:50%; display:grid; place-items:center; align-content:center; background:conic-gradient(#fff 0 75%,rgba(255,255,255,.2) 75%); color:var(--navy); box-shadow:inset 0 0 0 16px rgba(23,105,255,.2); }
.ring b { font-size:28px; }
.ring small { font-size:11px; }
.portalcards { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.portalcards article,.timeline { padding:28px; border:1px solid var(--line); border-radius:19px; background:#fff; }
.portalcards .icon { width:48px; height:48px; display:grid; place-items:center; border-radius:13px; background:#eaf3ff; color:var(--blue); font-size:21px; margin-bottom:18px; }
.portalcards h3 { font-size:22px; }
.portalcards p { color:var(--muted); min-height:50px; }
.portalcards button[disabled] { padding:11px 14px; border:0; border-radius:9px; color:#9aa5b3; background:#edf1f5; }
.paid { color:var(--green); }
.timeline { margin-top:20px; }
.timeline > div { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }
.timeline article { display:flex; gap:12px; padding:18px; border-radius:13px; background:#f5f8fb; }
.timeline article > b { width:32px; height:32px; display:grid; place-items:center; flex:0 0 32px; border-radius:50%; background:#dfe7f1; }
.timeline article.done > b { color:#fff; background:var(--green); }
.timeline article.active > b { color:#fff; background:var(--blue); }
.timeline strong,.timeline small { display:block; }
.timeline small { color:#8290a1; margin-top:4px; }

/* Responsive */
@media (max-width: 1050px) {
  .top nav { display:none; }
  .hero { grid-template-columns:1fr; }
  .hero .mock { max-width:850px; }
  .cards { grid-template-columns:1fr 1fr; }
  .process { grid-template-columns:1fr; }
  .app { grid-template-columns:220px 1fr; }
  .appkpis { grid-template-columns:1fr 1fr; }
  .pipeline { grid-template-columns:repeat(3,1fr); }
  .portalcards { grid-template-columns:1fr; }
  .timeline > div { grid-template-columns:1fr 1fr; }
}

@media (max-width: 760px) {
  .top { height:auto; padding:18px 20px; }
  .top > div .plain { display:none; }
  .hero,.section,.process { padding:65px 22px; }
  .hero h1 { font-size:52px; }
  .mockbody { grid-template-columns:90px 1fr; }
  .mockbody aside { padding:25px 12px; font-size:10px; }
  .mockbody section { padding:20px; }
  .kpis { grid-template-columns:1fr; }
  .cards { grid-template-columns:1fr; }
  footer { flex-direction:column; text-align:center; }

  .login { grid-template-columns:1fr; }
  .loginvisual { min-height:420px; padding:40px 25px; }
  .loginpanel { padding:25px; }
  .loginpanel form { padding:28px 22px; }

  .app,.portal { display:block; }
  .app > aside,.portal > aside { position:static; width:100%; height:auto; min-height:0; padding:18px; }
  .app > aside nav,.portal > aside nav { margin:20px 0; flex-direction:row; overflow:auto; }
  .app > aside nav button,.portal > aside nav a { white-space:nowrap; }
  #logout,.portal > aside > a:last-child { display:none; }
  .app > main,.portal > main { padding:25px 16px 45px; }
  .app > main > header,.portal > main > header { align-items:flex-start; flex-direction:column; }
  .app h1,.portal h1 { font-size:34px; }
  .appkpis { grid-template-columns:1fr 1fr; }
  .pipeline { grid-template-columns:1fr 1fr; }
  .paygrid { grid-template-columns:1fr; }
  .status { align-items:flex-start; flex-direction:column; gap:20px; }
  .timeline > div { grid-template-columns:1fr; }
}

@media (max-width: 480px) {
  .appkpis { grid-template-columns:1fr; }
  .pipeline { grid-template-columns:1fr; }
  .hero h1 { font-size:43px; }
  .actions { flex-direction:column; }
}

/* Klantdossier */
.dossier-details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 16px;
  margin: 24px 0;
}
.dossier-details p {
  margin: 0;
  padding: 16px;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #f8fafc;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.dossier-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 20px;
}
.dossier-actions button,
#backToLeads,
[data-open-id] {
  border: 0;
  border-radius: 10px;
  padding: 10px 14px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
[data-open-id],
.dossier-actions button {
  background: #1769ff;
  color: #fff;
}
#backToLeads {
  background: #eef2ff;
  color: #102a56;
  margin-bottom: 18px;
}

/* V6 Notities */
.dossier-panel{padding:0;overflow:hidden}.dossier-header{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;padding:28px 30px 22px;border-bottom:1px solid #e8edf2}.dossier-header h2{margin:12px 0 4px;font-size:30px}.dossier-header p{margin:0;color:#64748b}.back-button{padding:0;background:none;border:0;color:#0f6d5c;font-weight:700;cursor:pointer}.dossier-tabs{display:flex;gap:6px;flex-wrap:wrap;padding:14px 30px;border-bottom:1px solid #e8edf2;background:#f8fafc}.dossier-tabs button{border:0;background:transparent;border-radius:9px;padding:10px 14px;font-weight:700;color:#64748b;cursor:pointer}.dossier-tabs button.active{background:#fff;color:#0f6d5c;box-shadow:0 2px 10px rgba(15,23,42,.08)}.dossier-tabs button:disabled{opacity:.45;cursor:not-allowed}.dossier-tabs button span{display:inline-flex;min-width:20px;height:20px;align-items:center;justify-content:center;margin-left:5px;border-radius:999px;background:#dff4ed;color:#0f6d5c;font-size:12px}.dossier-section{padding:28px 30px}.dossier-section h3{margin:5px 0 20px;font-size:23px}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.note-count{background:#eef3f7;border-radius:999px;padding:7px 11px;color:#526273;font-size:13px;font-weight:700}.note-form{background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;padding:18px;margin-bottom:22px}.note-form label{display:block;font-weight:800;margin-bottom:9px}.note-form textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:110px;border:1px solid #cbd5e1;border-radius:10px;padding:13px;font:inherit;background:#fff}.note-form textarea:focus{outline:2px solid rgba(15,109,92,.18);border-color:#0f6d5c}.note-form-actions{display:flex;justify-content:flex-end;margin-top:12px}.notes-list{display:grid;gap:12px}.note-card{border:1px solid #e2e8f0;border-radius:13px;padding:16px 18px;background:#fff}.note-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.note-card-top strong,.note-card-top small{display:block}.note-card-top small{margin-top:3px;color:#64748b}.note-card p{margin:14px 0 0;line-height:1.6;color:#273444}.note-delete{border:0;background:#fff1f2;color:#be123c;border-radius:8px;padding:7px 10px;font-weight:700;cursor:pointer}.note-empty{padding:25px}.btn:disabled{opacity:.65;cursor:wait}@media(max-width:720px){.dossier-header,.section-heading{flex-direction:column}.dossier-header,.dossier-tabs,.dossier-section{padding-left:18px;padding-right:18px}}

/* V7 */
.brand-logo{gap:11px}.brand-mark{width:52px;height:52px;border-radius:15px;display:grid!important;place-items:center;color:#fff!important;background:linear-gradient(145deg,#287bff,#0d56d8);font-size:20px!important;box-shadow:0 10px 24px rgba(23,105,255,.3)}.brand-copy{display:flex!important;flex-direction:column;line-height:1.05}.brand-copy strong{font-size:13px}.brand-copy small{font-size:11px;letter-spacing:.18em;color:#9fb4c8}.portal-link{margin-top:auto;padding:13px 15px;border:1px solid rgba(255,255,255,.14);border-radius:11px;color:#c5d2df;font-size:13px}.page-intro{margin-bottom:18px}.page-intro h2{margin:8px 0 4px;font-size:34px}.page-intro p{margin:0;color:var(--muted)}.invoice-kpis{margin-bottom:20px}.status-badge.is-paid{background:#dcf7ea;color:#087448}.status-badge.is-open{background:#fff0c7;color:#875900}.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.contact-card{margin-top:0}.contact-card h3{font-size:24px}.contact-icon{font-size:30px}.paygrid a{display:flex;flex-direction:column}.paygrid small{opacity:.75}.paygrid strong{font-size:20px}.portal>aside nav button{border:0;background:transparent;text-align:left;padding:14px 15px;border-radius:11px;color:#becbd8;font:inherit;cursor:pointer}.portal>aside nav button.active,.portal>aside nav button:hover{color:#fff;background:#12456b}.portal-view{display:none}.portal-view.active{display:block}.portal-page-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:34px;box-shadow:0 8px 22px rgba(12,31,58,.04)}.portal-page-card h2{font-size:34px;margin:10px 0 14px}.document-preview,.invoice-row{display:flex;align-items:center;gap:20px;padding:22px;border:1px solid var(--line);border-radius:16px;margin:22px 0}.document-icon{width:64px;height:76px;display:grid;place-items:center;background:#eaf3ff;color:#1769ff;border-radius:10px;font-weight:800}.info-box,.inline-message{padding:18px;border-radius:14px;background:#f3f7fc}.appointment-card{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:25px 0}.appointment-card div{padding:18px;border:1px solid var(--line);border-radius:14px}.appointment-card small,.appointment-card strong{display:block}.invoice-row>div{flex:1}.invoice-row small{display:block;color:var(--muted)}.paid-badge{padding:7px 10px;border-radius:999px;background:#dcf7ea;color:#087448;font-weight:800}.muted-note{color:var(--muted)}.portal-contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:24px}.portal-contact-grid a{padding:22px;border:1px solid var(--line);border-radius:15px}.portal-contact-grid span,.portal-contact-grid strong,.portal-contact-grid small{display:block}.portal-contact-grid span{font-size:28px}.portal-contact-grid small{color:var(--muted)}
@media(max-width:900px){.contact-grid,.appointment-card,.portal-contact-grid{grid-template-columns:1fr}}

/* V7 zichtbaar dashboard */
.brand-copy em{font-style:normal;color:#fff;background:#1769ff;border-radius:999px;padding:2px 6px;margin-left:4px;font-size:9px;letter-spacing:.08em}.v7-welcome{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:20px;padding:28px 30px;border-radius:20px;background:linear-gradient(135deg,#0b2a45,#124e78);color:#fff;box-shadow:0 14px 32px rgba(11,42,69,.16)}.v7-welcome h2{margin:7px 0 7px;font-size:30px}.v7-welcome p{margin:0;color:#c8d7e4;max-width:650px}.v7-welcome .eyebrow{color:#7ec6ff}.v7-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}.v7-actions button,.v7-actions a{border:1px solid rgba(255,255,255,.23);border-radius:10px;padding:11px 14px;background:rgba(255,255,255,.08);color:#fff;font:inherit;font-weight:700;cursor:pointer}.v7-actions button:hover,.v7-actions a:hover{background:#fff;color:#0b2a45}@media(max-width:900px){.v7-welcome{align-items:flex-start;flex-direction:column}.v7-actions{justify-content:flex-start}}

/* Officieel DW-logo */
.brand-mark.brand-image{width:58px;height:58px;display:block!important;object-fit:contain;border-radius:0;background:#fff;box-shadow:none;padding:0;flex:0 0 58px}
@media(max-width:900px){.brand-mark.brand-image{width:46px;height:46px;flex-basis:46px}}

/* V8 Leads professioneel */
.lead-tools{display:grid;grid-template-columns:minmax(220px,2fr) minmax(180px,1fr) auto auto;gap:16px;align-items:end;margin-bottom:18px}.lead-tools label{display:grid;gap:7px;font-weight:700;color:#415269}.lead-tools input[type="search"],.lead-tools select{width:100%;box-sizing:border-box;border:1px solid #d7e0ea;border-radius:11px;padding:12px 13px;font:inherit;background:#fff}.favorite-filter{display:flex!important;align-items:center;gap:9px;padding:12px 0;white-space:nowrap}.favorite-filter input{width:18px;height:18px}.secondary-button{border:1px solid #d7e0ea;background:#fff;color:#17314f;border-radius:10px;padding:12px 15px;font:inherit;font-weight:800;cursor:pointer}.result-summary{margin:0 0 14px;color:#64748b;font-size:14px}.favorite-button{border:0;background:transparent;color:#9aa8b6;font-size:25px;line-height:1;cursor:pointer;padding:4px}.favorite-button.active{color:#e6a700}.table-actions{display:flex;flex-wrap:wrap;gap:8px}.dossier-header-side{display:flex;align-items:center;gap:12px}.dossier-favorite{font-size:14px;border:1px solid #e2e8f0;border-radius:999px;padding:8px 11px;background:#fff}.dossier-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:24px}.dossier-action-grid button,.dossier-action-grid a{display:flex;align-items:center;gap:14px;text-align:left;border:1px solid #dfe7ef;border-radius:14px;padding:18px;background:#fff;color:#17314f;font:inherit;cursor:pointer;text-decoration:none;transition:.2s}.dossier-action-grid button:hover,.dossier-action-grid a:hover{border-color:#1769ff;box-shadow:0 8px 22px rgba(23,105,255,.10);transform:translateY(-1px)}.dossier-action-grid>*>span{display:grid;gap:3px}.dossier-action-grid strong,.dossier-action-grid small{display:block}.dossier-action-grid small{color:#718096}.dossier-timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.dossier-timeline article{display:flex;gap:12px;padding:16px;border:1px solid #e2e8f0;border-radius:13px;background:#f8fafc}.dossier-timeline article>b{width:31px;height:31px;display:grid;place-items:center;border-radius:50%;background:#dbe4ee;color:#526273;flex:0 0 31px}.dossier-timeline article.done>b{background:#0f8b6d;color:#fff}.dossier-timeline article.active{border-color:#1769ff;background:#f2f7ff}.dossier-timeline article.active>b{background:#1769ff;color:#fff}.dossier-timeline small{display:block;color:#7b8796;margin-top:3px}
@media(max-width:980px){.lead-tools{grid-template-columns:1fr 1fr}.dossier-timeline{grid-template-columns:1fr 1fr}}@media(max-width:680px){.lead-tools,.dossier-action-grid,.dossier-timeline{grid-template-columns:1fr}.dossier-header-side{align-items:flex-start;flex-direction:column}}


/* V8.1 - officieel DW-logo ook op hoofdportaal en login */
.brand-logo-public .brand-image{width:52px;height:52px;flex-basis:52px}
.brand-logo-public .brand-copy strong{color:#0b2a45;font-size:13px}
.brand-logo-public .brand-copy small{color:#64758a;font-size:10px}
.brand-logo-footer .brand-image{width:52px;height:52px;flex-basis:52px}
.brand-logo-footer .brand-copy strong{color:#fff}
.brand-logo-footer .brand-copy small{color:#9fb4c8}
.mock-logo{width:42px;height:42px;object-fit:contain;border-radius:0;background:#fff;margin-bottom:12px}
.loginvisual .brand-logo .brand-image{width:62px;height:62px;flex-basis:62px}
@media(max-width:700px){
  .brand-logo-public .brand-image{width:44px;height:44px;flex-basis:44px}
  .brand-logo-public .brand-copy{display:none!important}
  .brand-logo-footer .brand-image{width:46px;height:46px;flex-basis:46px}
}


/* V9 Rapportgenerator */
.report-page-intro{display:flex;justify-content:space-between;align-items:center;gap:20px}.report-kpis{margin-bottom:20px}.report-empty{display:grid;gap:7px;text-align:center;padding:50px 20px}.report-empty span{color:#718096}.report-card-list{display:grid;gap:13px}.report-card{display:flex;align-items:center;gap:16px;padding:17px;border:1px solid #e1e8f0;border-radius:15px;background:#fff}.report-card-icon{width:48px;height:58px;display:grid;place-items:center;flex:0 0 48px;border-radius:9px;background:#eaf3ff;color:#1769ff;font-weight:900}.report-card-copy{flex:1;min-width:0}.report-card-copy h3{margin:6px 0 4px;font-size:18px}.report-card-copy p{margin:0;color:#718096;font-size:13px}.report-card-meta{display:flex;gap:9px;align-items:center;color:#1769ff;font-size:12px;font-weight:800}.report-status{border-radius:999px;padding:4px 8px;background:#eef2f6;color:#526273}.report-gereed{background:#e5f7ef;color:#087448}.report-verzonden{background:#eaf3ff;color:#125bb9}.report-card-actions{display:flex;gap:8px;flex-wrap:wrap}.report-card-actions button{border:1px solid #d9e2ec;border-radius:9px;padding:9px 11px;background:#fff;color:#17314f;font:inherit;font-weight:750;cursor:pointer}.report-dialog{width:min(880px,calc(100% - 28px));max-height:92vh;border:0;border-radius:20px;padding:0;box-shadow:0 25px 80px rgba(15,35,55,.28)}.report-dialog::backdrop{background:rgba(7,24,40,.6)}.report-dialog-heading{padding:28px 30px 18px;border-bottom:1px solid #e6edf3}.report-dialog-heading h2{margin:5px 0 5px;font-size:28px}.report-dialog-heading p{margin:0;color:#718096}.dialog-close{position:absolute;right:18px;top:16px;border:0;background:#eef3f7;width:34px;height:34px;border-radius:50%;font-size:22px;cursor:pointer}.report-form{display:grid;gap:16px;padding:24px 30px 30px}.report-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.report-form label{display:grid;gap:7px;font-weight:800;color:#34465a}.report-form input,.report-form select,.report-form textarea{width:100%;box-sizing:border-box;border:1px solid #cfdae5;border-radius:10px;padding:12px 13px;font:inherit;background:#fff}.report-form textarea{resize:vertical;line-height:1.55}.report-form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:4px}@media(max-width:800px){.report-page-intro,.report-card{align-items:flex-start;flex-direction:column}.report-card-actions{width:100%}.report-form-grid{grid-template-columns:1fr}.report-dialog-heading,.report-form{padding-left:18px;padding-right:18px}}

/* V10 producten & verdienmodellen */
.product-dashboard{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.product-dashboard article{display:flex;align-items:center;gap:12px;border:1px solid #e2e8f0;border-radius:14px;padding:16px;background:#fff}.product-dashboard article b{margin-left:auto}.product-dashboard small{display:block;color:#64748b;margin-top:4px}.product-icon{font-size:26px}.lead-dialog form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.lead-dialog form>input,.lead-dialog form>select,.lead-dialog form>button{grid-column:span 2}.lead-dialog label{display:flex;flex-direction:column;gap:6px;font-weight:700;color:#334155}.lead-dialog label input,.lead-dialog label select{font-weight:400}.table-wrap td small{display:block;color:#64748b;margin-top:4px}@media(max-width:700px){.lead-dialog form{grid-template-columns:1fr}.lead-dialog form>*{grid-column:span 1!important}}

/* V11 SaaS-verkooppagina */
.saas-home{background:#fff;color:#10243b}.saas-top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);border-bottom:1px solid #e8eef5}.saas-top nav{display:flex;gap:24px}.saas-top nav a{font-weight:700;color:#43556a}.top-actions{display:flex;align-items:center;gap:14px}.saas-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(500px,.95fr);gap:64px;align-items:center;max-width:1260px;margin:auto;padding:92px 34px 82px;background:radial-gradient(circle at 7% 0%,#edf7ff 0,transparent 38%)}.saas-hero h1{font-size:clamp(48px,6vw,76px);line-height:1.02;letter-spacing:-.045em;margin:15px 0 24px}.saas-hero h1 em{font-style:normal;color:#1769ff}.saas-hero-copy>p{font-size:20px;line-height:1.65;color:#586a7e;max-width:670px}.trust-row{display:flex;flex-wrap:wrap;gap:18px;margin-top:28px;color:#3e5268;font-weight:750}.saas-dashboard-preview{border:1px solid #dce6f0;border-radius:24px;background:#fff;box-shadow:0 35px 75px rgba(15,44,76,.18);overflow:hidden;transform:perspective(1000px) rotateY(-2deg)}.preview-toolbar{display:flex;justify-content:space-between;padding:15px 18px;background:#0b2a45;color:#fff}.preview-toolbar span{background:#daf6e9;color:#087448;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:800}.preview-layout{display:grid;grid-template-columns:130px 1fr;min-height:420px}.preview-layout aside{display:flex;flex-direction:column;gap:14px;background:#0f3859;color:#bcd0df;padding:22px 17px;font-size:12px}.preview-layout aside img{width:46px;height:46px;object-fit:contain;background:#fff;margin-bottom:8px}.preview-layout aside b{background:#1769ff;color:#fff;border-radius:8px;padding:9px}.preview-layout aside span{padding:8px}.preview-layout section{padding:25px;background:#f6f9fc}.preview-layout h3{font-size:25px;margin:5px 0 20px}.preview-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.preview-kpis article{background:#fff;border:1px solid #e1e9f1;border-radius:12px;padding:14px}.preview-kpis small,.preview-kpis b,.preview-kpis i{display:block}.preview-kpis b{font-size:22px;margin:5px 0}.preview-kpis i{font-style:normal;font-size:11px;color:#11835f}.preview-chart{height:120px;display:flex;align-items:end;gap:8px;padding:22px 18px 0;margin-top:13px;background:#fff;border:1px solid #e1e9f1;border-radius:12px}.preview-chart i{flex:1;background:linear-gradient(#1769ff,#73b6ff);border-radius:5px 5px 0 0}.preview-products{margin-top:13px;background:#fff;border:1px solid #e1e9f1;border-radius:12px;padding:5px 15px}.preview-products p{display:flex;justify-content:space-between;padding:10px 0;margin:0;border-bottom:1px solid #eef2f6;font-size:12px}.preview-products p:last-child{border:0}.preview-products span{color:#64748b}.saas-proofbar{display:flex;justify-content:center;flex-wrap:wrap;gap:42px;padding:20px;background:#0b2a45;color:#8fb1ca;font-size:12px;font-weight:900;letter-spacing:.12em}.saas-section{padding-top:100px;padding-bottom:100px}.section-heading-centered{text-align:center;max-width:790px;margin:0 auto 48px}.section-heading-centered h2{font-size:clamp(34px,4vw,52px);letter-spacing:-.03em;margin:12px 0 15px}.section-heading-centered p{color:#64758a;font-size:18px;line-height:1.65}.section-heading-centered.light h2{color:#fff}.section-heading-centered.light p{color:#bfd0df}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.feature-grid article{border:1px solid #e1e9f1;border-radius:18px;padding:27px;background:#fff;box-shadow:0 10px 28px rgba(15,44,76,.05)}.feature-grid article>span{font-size:30px}.feature-grid h3{margin:18px 0 9px}.feature-grid p{margin:0;color:#68798c;line-height:1.6}.branch-section{padding:100px max(34px,calc((100vw - 1192px)/2));background:linear-gradient(140deg,#092941,#124e78)}.branch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.branch-grid article{display:grid;gap:8px;padding:24px;border:1px solid rgba(255,255,255,.14);border-radius:17px;background:rgba(255,255,255,.07);color:#fff}.branch-grid article>span{font-size:28px}.branch-grid small{color:#b9cfde;line-height:1.4}.workflow-section{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:start}.workflow-copy h2{font-size:48px;line-height:1.08;margin:14px 0}.workflow-copy p{color:#64758a;font-size:18px;line-height:1.65}.workflow-steps{display:grid;gap:13px}.workflow-steps article{display:flex;gap:18px;padding:22px;border:1px solid #e0e8f0;border-radius:16px}.workflow-steps article>b{display:grid;place-items:center;width:46px;height:46px;flex:0 0 46px;border-radius:12px;background:#eaf3ff;color:#1769ff}.workflow-steps h3{margin:2px 0 5px}.workflow-steps p{margin:0;color:#697a8d}.dw-example{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:90px max(34px,calc((100vw - 1192px)/2));background:#1769ff;color:#fff}.dw-example h2{font-size:47px;margin:13px 0}.dw-example p{color:#dceaff;font-size:18px;line-height:1.65}.secondary-light{border-color:rgba(255,255,255,.45)!important;color:#fff!important;background:transparent!important}.example-list{display:grid;gap:12px}.example-list article{display:flex;gap:16px;align-items:center;padding:19px;border:1px solid rgba(255,255,255,.2);border-radius:15px;background:rgba(255,255,255,.09)}.example-list article>span{font-size:28px}.example-list b,.example-list small{display:block}.example-list small{color:#d7e8ff;margin-top:4px}.ai-ready-section{padding-top:90px;padding-bottom:90px}.ai-ready-card{display:grid;grid-template-columns:1.1fr .9fr;gap:55px;align-items:center;padding:48px;border-radius:25px;background:#091f34;color:#fff}.ai-ready-card h2{font-size:42px;margin:12px 0}.ai-ready-card p{color:#b8ccdc;line-height:1.7}.ai-flow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:9px}.ai-flow span{padding:11px 13px;border-radius:10px;background:#153c5b;border:1px solid #285777;font-weight:800}.ai-flow i{font-style:normal;color:#61b6ff}.pricing-section{padding:100px max(34px,calc((100vw - 1192px)/2));background:#f5f8fb}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}.pricing-grid article{position:relative;padding:34px;border:1px solid #dce5ee;border-radius:20px;background:#fff;display:flex;flex-direction:column}.pricing-grid article.featured{border:2px solid #1769ff;box-shadow:0 20px 45px rgba(23,105,255,.14)}.pricing-grid h3{font-size:25px;margin:10px 0}.pricing-grid p{color:#66778a;line-height:1.6;flex:1}.popular{position:absolute;right:18px;top:17px;font-size:10px;font-weight:900;color:#1769ff}.final-cta{display:flex;justify-content:space-between;align-items:center;gap:40px;padding:70px max(34px,calc((100vw - 1192px)/2));background:linear-gradient(135deg,#0b2a45,#102f4e);color:#fff}.final-cta h2{font-size:42px;margin:12px 0}.final-cta p{max-width:730px;color:#bdd0df}.saas-footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:30px max(34px,calc((100vw - 1192px)/2));background:#071b2c;color:#a9bfd0}.saas-footer a{color:#fff;font-weight:800}
@media(max-width:1050px){.saas-hero{grid-template-columns:1fr;padding-top:65px}.saas-dashboard-preview{transform:none;max-width:720px}.feature-grid,.branch-grid{grid-template-columns:repeat(2,1fr)}.workflow-section,.dw-example,.ai-ready-card{grid-template-columns:1fr}.pricing-grid{grid-template-columns:1fr}.saas-top nav{display:none}}
@media(max-width:700px){.saas-top{padding-left:16px;padding-right:16px}.saas-top .plain{display:none}.saas-hero{padding:52px 18px}.saas-hero h1{font-size:46px}.preview-layout{grid-template-columns:88px 1fr}.preview-layout aside{padding:16px 8px}.preview-layout aside span{font-size:0}.preview-layout aside span:before{content:'•';font-size:18px}.preview-kpis{grid-template-columns:1fr}.preview-chart{height:90px}.feature-grid,.branch-grid{grid-template-columns:1fr}.saas-section,.branch-section,.dw-example,.pricing-section{padding-left:18px;padding-right:18px}.workflow-section{padding-left:18px;padding-right:18px}.ai-ready-card{padding:28px 20px}.final-cta,.saas-footer{align-items:flex-start;flex-direction:column;padding-left:18px;padding-right:18px}.final-cta .actions{align-items:stretch;flex-direction:column;width:100%}.final-cta .actions a{text-align:center}}

/* V12 Interactief Demo Center */
.demo-center-page{background:#f5f8fb;color:#10243b}.demo-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:56px;align-items:center;max-width:1192px;margin:auto;padding:78px 34px 62px}.demo-hero h1{font-size:clamp(43px,5vw,68px);line-height:1.04;letter-spacing:-.04em;margin:14px 0 20px}.demo-hero h1 em{font-style:normal;color:#1769ff}.demo-hero p{max-width:710px;color:#607287;font-size:19px;line-height:1.65}.demo-hero-note{display:grid;gap:12px;padding:28px;border-radius:22px;background:#0b2a45;color:#fff}.demo-hero-note b{font-size:20px;margin-bottom:5px}.demo-hero-note span{padding:11px 13px;border-radius:10px;background:rgba(255,255,255,.08);color:#c6d8e7}.demo-branch-picker{padding:74px max(34px,calc((100vw - 1192px)/2));background:#fff}.demo-branch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.demo-branch-grid button{display:grid;gap:7px;text-align:left;border:1px solid #dde6ef;border-radius:16px;padding:20px;background:#fff;color:#18324f;font:inherit;cursor:pointer;transition:.2s}.demo-branch-grid button:hover,.demo-branch-grid button.active{border-color:#1769ff;background:#f0f6ff;transform:translateY(-2px);box-shadow:0 12px 30px rgba(23,105,255,.11)}.demo-branch-grid button>span{font-size:29px}.demo-branch-grid button small{color:#718297}.demo-stage{max-width:1260px;margin:70px auto;padding:0 34px;scroll-margin-top:95px}.demo-stage-top{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-bottom:18px}.demo-company-brand{display:flex;align-items:center;gap:15px}.demo-company-brand>span{width:58px;height:58px;display:grid;place-items:center;border-radius:16px;background:#e9f2ff;font-size:29px}.demo-company-brand small,.demo-company-brand h2,.demo-company-brand p{display:block;margin:0}.demo-company-brand h2{margin:3px 0;font-size:28px}.demo-company-brand p{color:#66798e}.demo-stage-actions{display:flex;align-items:center;gap:12px}.demo-live{padding:8px 11px;border-radius:999px;background:#dcf7ea;color:#087448;font-size:11px;font-weight:900;letter-spacing:.08em}.demo-app-shell{display:grid;grid-template-columns:220px 1fr;min-height:690px;border:1px solid #d9e3ed;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 25px 65px rgba(14,43,74,.15)}.demo-sidebar{display:flex;flex-direction:column;padding:23px 16px;background:linear-gradient(180deg,#0b2a45,#102f4e);color:#fff}.demo-logo{display:flex;align-items:center;gap:10px;padding:5px 7px 24px;border-bottom:1px solid rgba(255,255,255,.11)}.demo-logo>span{width:39px;height:39px;display:grid;place-items:center;border-radius:11px;background:#fff;font-size:21px}.demo-logo b{font-size:13px}.demo-sidebar nav{display:grid;gap:7px;margin-top:22px}.demo-sidebar nav button{border:0;border-radius:10px;padding:12px 13px;text-align:left;background:transparent;color:#bfd0df;font:inherit;font-weight:700;cursor:pointer}.demo-sidebar nav button:hover,.demo-sidebar nav button.active{background:#1769ff;color:#fff}.demo-user{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:20px;border-top:1px solid rgba(255,255,255,.11)}.demo-user>span{width:35px;height:35px;display:grid;place-items:center;border-radius:50%;background:#dceaff;color:#1769ff;font-weight:900}.demo-user b,.demo-user small{display:block}.demo-user b{font-size:12px}.demo-user small{font-size:10px;color:#abc1d2}.demo-workspace{padding:28px;background:#f5f8fb;min-width:0}.demo-workspace-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}.demo-workspace-head small{font-weight:900;letter-spacing:.12em;color:#1769ff}.demo-workspace-head h3{margin:5px 0 0;font-size:31px}.demo-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.demo-metrics article{padding:18px;border:1px solid #e0e8f0;border-radius:14px;background:#fff}.demo-metrics small,.demo-metrics b,.demo-metrics span{display:block}.demo-metrics small{color:#65778b}.demo-metrics b{font-size:25px;margin:7px 0}.demo-metrics span{font-size:12px;color:#0c8560;font-weight:800}.demo-two-col{display:grid;grid-template-columns:1.2fr .8fr;gap:16px;margin-top:16px}.demo-panel{padding:22px;border:1px solid #e0e8f0;border-radius:16px;background:#fff}.demo-panel-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px}.demo-panel-head h4{margin:0;font-size:19px}.demo-panel-head span{color:#718297;font-size:12px}.demo-product-row{display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px 0;border-bottom:1px solid #edf1f5}.demo-product-row:last-child{border:0}.demo-product-row small,.demo-product-row b{display:block}.demo-product-row small{color:#75869a;margin-top:3px}.demo-product-row strong{font-size:13px}.demo-product-row i{grid-column:1/-1;height:8px;border-radius:999px;background:#e8eef5;overflow:hidden}.demo-product-row u{display:block;height:100%;border-radius:999px;background:#1769ff}.demo-agenda-row{display:flex;gap:13px;padding:12px 0;border-bottom:1px solid #edf1f5}.demo-agenda-row:last-child{border:0}.demo-agenda-row>b{color:#1769ff;min-width:42px}.demo-agenda-row strong,.demo-agenda-row small{display:block}.demo-agenda-row small{color:#75869a;margin-top:3px}.demo-ai-banner{display:flex;align-items:center;gap:14px;margin-top:16px;padding:17px 18px;border-radius:14px;background:#0b2a45;color:#fff}.demo-ai-banner>span{font-size:27px}.demo-ai-banner div{flex:1}.demo-ai-banner b,.demo-ai-banner p{display:block;margin:0}.demo-ai-banner p{margin-top:4px;color:#bfd0df;font-size:13px}.demo-ai-banner button{border:1px solid rgba(255,255,255,.25);border-radius:9px;padding:9px 11px;background:rgba(255,255,255,.08);color:#fff;font-weight:800}.demo-table-head,.demo-table-row{display:grid;grid-template-columns:1.2fr 1fr .8fr;gap:15px;align-items:center;padding:13px}.demo-table-head{background:#f4f7fa;border-radius:10px;color:#708197;font-size:12px;font-weight:900}.demo-table-row{border-bottom:1px solid #edf1f5}.demo-table-row em,.demo-report-row em{justify-self:start;padding:6px 9px;border-radius:999px;background:#eef4ff;color:#1769ff;font-style:normal;font-size:11px;font-weight:800}.demo-product-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.demo-product-cards article{position:relative;padding:22px;border:1px solid #e0e8f0;border-radius:16px;background:#fff}.demo-product-cards article>span{font-size:27px}.demo-product-cards small,.demo-product-cards h4,.demo-product-cards p,.demo-product-cards b{display:block}.demo-product-cards small{margin-top:14px;color:#1769ff;font-size:10px;font-weight:900;letter-spacing:.1em}.demo-product-cards h4{margin:5px 0 7px;font-size:20px}.demo-product-cards p{margin:0;color:#708197}.demo-product-cards b{margin-top:14px}.demo-product-cards button{position:absolute;right:17px;bottom:17px;border:0;background:transparent;color:#1769ff;font-weight:800;cursor:pointer}.demo-tip{margin-top:16px;padding:17px;border:1px dashed #a9c4e7;border-radius:14px;background:#f3f8ff}.demo-tip p{margin:5px 0 0;color:#61758b}.demo-timeline{display:grid}.demo-timeline article{display:grid;grid-template-columns:65px 16px 1fr;gap:12px;min-height:82px}.demo-timeline time{font-weight:900;color:#1769ff}.demo-timeline article>i{position:relative;width:10px;height:10px;margin-top:4px;border-radius:50%;background:#1769ff}.demo-timeline article>i:after{content:'';position:absolute;left:4px;top:13px;width:2px;height:58px;background:#dce5ef}.demo-timeline article:last-child>i:after{display:none}.demo-timeline b,.demo-timeline span,.demo-timeline small{display:block}.demo-timeline span{color:#687b91;margin:4px 0}.demo-timeline small{font-size:11px;color:#0b8560}.demo-ai-intro{display:flex;gap:18px;padding:24px;border-radius:17px;background:#0b2a45;color:#fff}.demo-ai-intro>span{font-size:35px}.demo-ai-intro small{color:#6ec0ff;font-weight:900}.demo-ai-intro h4{font-size:23px;margin:6px 0}.demo-ai-intro p{color:#bfd0df;margin:0;line-height:1.6}.demo-ai-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin-top:16px}.demo-ai-grid article{display:flex;align-items:center;gap:12px;padding:17px;border:1px solid #e0e8f0;border-radius:14px;background:#fff}.demo-ai-grid article>span{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#eaf3ff;color:#1769ff;font-weight:900}.demo-ai-grid article>div{flex:1}.demo-ai-grid b,.demo-ai-grid small{display:block}.demo-ai-grid small{color:#718297;margin-top:3px}.demo-switch input{display:none}.demo-switch i{display:block;width:37px;height:21px;border-radius:999px;background:#cbd5df;position:relative}.demo-switch i:after{content:'';position:absolute;width:15px;height:15px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}.demo-switch input:checked+i{background:#1769ff}.demo-switch input:checked+i:after{left:19px}.demo-report-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:13px;align-items:center;padding:14px 0;border-bottom:1px solid #edf1f5}.demo-report-row>span{font-size:23px}.demo-report-row b,.demo-report-row small{display:block}.demo-report-row small{color:#75869a;margin-top:3px}.demo-report-row button{border:1px solid #dce5ee;border-radius:8px;padding:7px 10px;background:#fff;color:#18324f;font-weight:800}.demo-conversion{display:flex;justify-content:space-between;align-items:center;gap:45px;padding:70px max(34px,calc((100vw - 1192px)/2));background:linear-gradient(135deg,#1769ff,#0d4eaf);color:#fff}.demo-conversion h2{font-size:40px;margin:12px 0}.demo-conversion p{max-width:770px;color:#dceaff;line-height:1.65}.branch-grid article{position:relative}.branch-grid article a{position:absolute;inset:0;border-radius:17px}.branch-grid article:has(a):hover{background:rgba(255,255,255,.13);transform:translateY(-2px)}
@media(max-width:1050px){.demo-hero{grid-template-columns:1fr}.demo-branch-grid{grid-template-columns:repeat(3,1fr)}.demo-app-shell{grid-template-columns:180px 1fr}.demo-metrics{grid-template-columns:repeat(2,1fr)}.demo-two-col{grid-template-columns:1fr}}
@media(max-width:760px){.demo-hero,.demo-stage{padding-left:18px;padding-right:18px}.demo-branch-picker{padding-left:18px;padding-right:18px}.demo-branch-grid{grid-template-columns:repeat(2,1fr)}.demo-stage-top,.demo-conversion{align-items:flex-start;flex-direction:column}.demo-stage-actions{flex-wrap:wrap}.demo-app-shell{grid-template-columns:1fr}.demo-sidebar{display:block}.demo-sidebar nav{display:flex;overflow-x:auto;padding-bottom:6px}.demo-sidebar nav button{white-space:nowrap}.demo-user{display:none}.demo-workspace{padding:18px}.demo-workspace-head{align-items:flex-start;flex-direction:column}.demo-product-cards,.demo-ai-grid{grid-template-columns:1fr}.demo-table{overflow-x:auto}.demo-table-head,.demo-table-row{min-width:620px}.demo-conversion{padding-left:18px;padding-right:18px}.demo-conversion .actions{width:100%;flex-direction:column}.demo-conversion .actions a{text-align:center}}
@media(max-width:460px){.demo-branch-grid{grid-template-columns:1fr}.demo-metrics{grid-template-columns:1fr}.demo-ai-banner{align-items:flex-start;flex-wrap:wrap}.demo-report-row{grid-template-columns:auto 1fr}.demo-report-row em,.demo-report-row button{grid-column:2}}


/* V13 onboarding en interactieve rondleiding */
.app-header-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.tour-button,.setup-link{border:1px solid rgba(23,105,255,.3);background:#fff;color:#1769ff;border-radius:10px;padding:11px 15px;font-weight:800;cursor:pointer}.setup-link{margin-top:auto;width:100%;background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.18);text-align:left}.setup-dialog{width:min(620px,calc(100% - 28px));border:0;border-radius:24px;padding:30px;color:#18314f}.setup-dialog::backdrop{background:rgba(7,25,43,.72)}.setup-progress{margin-bottom:24px;font-weight:800;color:#64748b}.setup-progress>div{height:8px;background:#e6edf5;border-radius:999px;margin-top:8px;overflow:hidden}.setup-progress i{display:block;height:100%;width:20%;background:#1769ff;transition:width .25s}.setup-step{display:none;min-height:270px}.setup-step.active{display:block}.setup-step h2{font-size:28px;margin:8px 0}.setup-step p{color:#64748b;line-height:1.6}.setup-step label{display:block;font-weight:800;margin:14px 0}.setup-step input,.setup-step select{display:block;width:100%;box-sizing:border-box;margin-top:7px;padding:13px;border:1px solid #ccd8e5;border-radius:10px;font:inherit}.setup-icon{font-size:42px}.setup-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.setup-help{font-size:14px}.setup-summary{background:#f1f6ff;border:1px solid #d3e2ff;border-radius:14px;padding:16px;margin-top:18px}.tour-overlay{position:fixed;inset:0;z-index:10000}.tour-backdrop{position:absolute;inset:0;background:rgba(3,18,34,.68)}.tour-card{position:fixed;right:24px;bottom:24px;width:min(410px,calc(100% - 48px));background:#fff;border-radius:22px;padding:25px;box-shadow:0 24px 80px rgba(0,0,0,.35);z-index:2}.tour-card h2{margin:7px 0 10px;color:#18314f}.tour-card p{color:#64748b;line-height:1.6}.tour-counter{font-size:12px;font-weight:900;letter-spacing:.08em;color:#1769ff}.tour-actions{display:flex;justify-content:space-between;gap:10px;margin-top:22px}.tour-target{position:relative;z-index:10001!important;box-shadow:0 0 0 5px #fff,0 0 0 10px #1769ff!important;border-radius:12px}.tour-target aside{z-index:10001!important}@media(max-width:700px){.app-header-actions{width:100%}.app-header-actions>*{flex:1}.tour-card{right:14px;bottom:14px;width:calc(100% - 28px);box-sizing:border-box}.setup-dialog{padding:22px}}

/* V14 UX-opruimronde */
.app > aside{padding:24px 18px;overflow-y:auto}.app > aside nav{gap:6px;margin:28px 0 18px}.app > aside nav button,#logout{padding:11px 13px}.sidebar-help{display:grid;gap:7px;margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.12)}.sidebar-help>span{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#7894aa;font-weight:900}.setup-link,.sidebar-tour{width:100%;border:0;border-radius:10px;padding:11px 12px;text-align:left;font:inherit;font-weight:800;cursor:pointer}.setup-link{margin:0;background:#1769ff;color:#fff}.sidebar-tour{background:rgba(255,255,255,.08);color:#d7e5ef}.portal-link{margin-top:8px;padding:11px 12px}.setup-primary{border:1px solid #cbdcff;background:#edf4ff;color:#145bcf;border-radius:10px;padding:11px 15px;font-weight:800;cursor:pointer}.start-panel{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr);gap:24px;align-items:center;margin-bottom:22px;padding:25px;border:1px solid #dfe8f1;border-radius:19px;background:#fff}.start-copy h2{margin:7px 0 6px;font-size:27px}.start-copy p{margin:0;color:var(--muted)}.start-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.start-option{display:flex;align-items:center;gap:11px;min-height:82px;padding:14px;border:1px solid #dce6ef;border-radius:13px;background:#f9fbfd;text-align:left;color:#18314f;cursor:pointer}.start-option:hover{border-color:#9bc0ff;background:#f1f6ff}.start-option.primary{background:#1769ff;border-color:#1769ff;color:#fff}.start-option>b{display:grid;place-items:center;flex:0 0 29px;width:29px;height:29px;border-radius:9px;background:rgba(23,105,255,.12);color:#1769ff}.start-option.primary>b{background:rgba(255,255,255,.2);color:#fff}.start-option span,.start-option strong,.start-option small{display:block}.start-option small{margin-top:4px;line-height:1.3;opacity:.72}.tour-overlay{pointer-events:none}.tour-backdrop{background:rgba(241,247,253,.48);backdrop-filter:blur(1px)}.tour-card{position:fixed;right:auto;bottom:auto;width:min(360px,calc(100% - 28px));padding:21px;border:2px solid #1769ff;box-shadow:0 18px 55px rgba(16,49,83,.24);pointer-events:auto;transition:top .22s ease,left .22s ease}.tour-card:before{content:'';position:absolute;width:13px;height:13px;background:#fff;border-left:2px solid #1769ff;border-top:2px solid #1769ff;transform:rotate(45deg);left:-8px;top:28px}.tour-target{z-index:10001!important;box-shadow:0 0 0 4px rgba(255,255,255,.95),0 0 0 8px #1769ff!important}.tour-target[hidden]{display:block!important}.tour-actions button{pointer-events:auto}.tour-progress-dots{display:flex;gap:5px;margin:9px 0}.tour-progress-dots i{width:7px;height:7px;border-radius:999px;background:#d8e2ec}.tour-progress-dots i.active{width:20px;background:#1769ff}.app main>header{align-items:flex-start;gap:18px}.app main>header h1{margin-bottom:8px}
@media(max-width:1050px){.start-panel{grid-template-columns:1fr}.start-options{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:760px){.start-options{grid-template-columns:1fr}.app-header-actions{display:grid;grid-template-columns:1fr 1fr}.app-header-actions .btn{grid-column:1/-1}.tour-card:before{display:none}.tour-card{left:14px!important;right:14px!important;bottom:14px!important;top:auto!important;width:auto}.sidebar-help{margin-top:10px}.app > aside nav{margin:16px 0}}

/* V15 - duidelijke rollen en rust */
.saas-top{min-height:88px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px;padding-top:0!important;padding-bottom:0!important}.saas-top nav{display:flex;align-items:center;justify-content:center;gap:30px;flex-wrap:nowrap}.saas-top nav a,.saas-top .top-actions a{display:flex;align-items:center;min-height:48px;line-height:1.2;white-space:nowrap}.saas-top .top-actions{display:flex;align-items:center;gap:18px}.workspace-card{margin:10px 0 4px;padding:13px 14px;border:1px solid rgba(255,255,255,.13);border-radius:12px;background:rgba(255,255,255,.06)}.workspace-card small,.workspace-card strong,.workspace-card span{display:block}.workspace-card small{color:#8ba4b9;font-size:10px;text-transform:uppercase;letter-spacing:.12em}.workspace-card strong{margin-top:5px;color:#fff}.workspace-card span{margin-top:3px;color:#9eb3c5;font-size:12px}.admin-return{align-self:center;border:1px solid #dbe5ef;border-radius:10px;padding:10px 13px;background:#fff;color:#314860;font-weight:800;font-size:13px}.role-choice{display:grid;gap:10px;margin:18px 0}.role-option{display:flex;align-items:flex-start;gap:11px;padding:14px;border:1px solid #dbe5ef;border-radius:12px;cursor:pointer;background:#fff}.role-option.selected{border-color:#1769ff;background:#f3f7ff;box-shadow:0 0 0 2px rgba(23,105,255,.1)}.role-option input{margin-top:4px}.role-option span,.role-option strong,.role-option small{display:block}.role-option small{margin-top:3px;color:#6a7a8c}.admin-app{margin:0;background:#f4f7fb;color:#10233d;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}.admin-sidebar{position:fixed;inset:0 auto 0 0;width:270px;box-sizing:border-box;padding:24px 18px;display:flex;flex-direction:column;background:#0b223c;color:#fff}.admin-sidebar nav{display:grid;gap:5px;margin-top:22px}.admin-sidebar nav button{border:0;border-radius:10px;padding:13px 14px;background:transparent;color:#bfd0df;text-align:left;font:inherit;font-weight:700;cursor:pointer}.admin-sidebar nav button.active,.admin-sidebar nav button:hover{background:#1769ff;color:#fff}.admin-role{margin-top:22px;padding:14px;border:1px solid rgba(255,255,255,.13);border-radius:12px;background:rgba(255,255,255,.06)}.admin-role small,.admin-role strong,.admin-role span{display:block}.admin-role small{color:#8fa8bc}.admin-role span{margin-top:4px;font-size:12px;color:#7ec0ff}.admin-company-link,.admin-logout{padding:12px 13px;border-radius:10px;font-weight:800}.admin-company-link{margin-top:auto;background:#1769ff;color:#fff}.admin-logout{margin-top:7px;color:#bcd0df}.admin-main{margin-left:270px;padding:34px 40px;min-height:100vh}.admin-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:28px}.admin-top h1{font-size:38px;margin:7px 0}.admin-top p{margin:0;color:#65758a;max-width:720px}.role-pill{padding:9px 13px;border-radius:999px;background:#e9f1ff;color:#1760d5;font-weight:800}.admin-view{display:none}.admin-view.active{display:block}.admin-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}.admin-kpis article{padding:21px;border:1px solid #dfe6ee;border-radius:16px;background:#fff}.admin-kpis small,.admin-kpis b,.admin-kpis span{display:block}.admin-kpis b{font-size:30px;margin:8px 0}.admin-kpis span{font-size:13px;color:#6c7b8d}.admin-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:20px}.admin-panel{padding:24px;border:1px solid #dfe6ee;border-radius:17px;background:#fff}.panel-title{display:flex;justify-content:space-between;align-items:flex-start}.panel-title h2,.admin-panel h2{margin:7px 0 18px}.panel-title button{border:0;background:transparent;color:#1769ff;font-weight:800;cursor:pointer}.company-list{display:grid;gap:8px}.company-list article{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:12px;padding:13px;border:1px solid #e6ebf1;border-radius:12px}.company-avatar{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:#eaf1ff;color:#1769ff;font-weight:900}.company-list small{display:block;margin-top:3px;color:#718196}.company-list>article>span{padding:5px 8px;border-radius:999px;background:#edf1f5;font-size:12px}.company-list .status-live{background:#ddf7e9;color:#087448}.company-list a,.company-table a{color:#1769ff;font-weight:800}.role-explain{display:grid;gap:11px}.role-explain article{padding:14px;border-radius:12px;background:#f5f8fc}.role-explain p{margin:5px 0 0;color:#65758a;line-height:1.45}.company-table{display:grid}.company-table>div{display:grid;grid-template-columns:1.4fr 1fr 1fr .7fr 1fr;gap:15px;padding:14px;border-bottom:1px solid #e4eaf0}.company-table>div:first-child{background:#f4f7fb;border-radius:10px;font-size:13px}.usage-list p{display:flex;justify-content:space-between;gap:20px;padding:14px;border-bottom:1px solid #e6ebf1}.usage-list span{color:#66778b}.empty-admin{color:#6a7a8c}.admin-sidebar .portal-link{margin-top:7px}
@media(max-width:1100px){.saas-top{grid-template-columns:auto auto}.saas-top nav{order:3;grid-column:1/-1;justify-content:flex-start;overflow:auto;padding-bottom:12px}.admin-kpis{grid-template-columns:1fr 1fr}.admin-grid{grid-template-columns:1fr}}
@media(max-width:760px){.admin-sidebar{position:static;width:auto}.admin-main{margin-left:0;padding:22px 16px}.admin-kpis{grid-template-columns:1fr}.company-table>div{grid-template-columns:1fr 1fr}.company-table>div>*:nth-child(3),.company-table>div>*:nth-child(4){display:none}.admin-top{flex-direction:column}.admin-return{display:none}}
/* V16 - duidelijke eigenaarservaring en compacte login */
.login-v16{height:100vh;min-height:680px;overflow:hidden;grid-template-columns:minmax(420px,1fr) minmax(430px,.9fr)}
.login-v16 .loginvisual{min-height:0;padding:34px clamp(34px,5vw,72px);justify-content:space-between}
.login-v16 .loginvisual .brand-logo .brand-image{width:54px;height:54px;flex-basis:54px}
.login-v16 .login-message h1{font-size:clamp(42px,5vw,68px);margin:14px 0;max-width:620px}
.login-v16 .login-message p{font-size:18px;line-height:1.55;max-width:610px}
.login-role-map{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 16px;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:rgba(255,255,255,.06);font-size:13px}.login-role-map strong{width:100%}.login-role-map span{padding:7px 10px;border-radius:8px;background:rgba(255,255,255,.09)}.login-role-map i{font-style:normal;color:#73a8ff}
.login-v16 .loginpanel{padding:28px}.login-v16 .loginpanel form{padding:30px 34px}.login-v16 .loginpanel h2{font-size:32px;margin:10px 0 14px}.login-v16 .loginpanel label{margin:13px 0 6px}.login-v16 .loginpanel input{padding:12px 13px}.owner-explanation{padding:14px;border-radius:12px;background:#eef5ff;border:1px solid #cfe0ff}.owner-explanation b{color:#1458c7}.owner-explanation p{margin:6px 0 0;font-size:14px;line-height:1.45}.login-secondary-actions{display:flex;justify-content:space-between;gap:14px;font-size:13px}.login-secondary-actions a{color:#1769ff;font-weight:750}
.admin-context-banner{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;padding:17px 20px;border:1px solid #bfd4ff;border-radius:15px;background:#edf4ff}.admin-context-banner b,.admin-context-banner span{display:block}.admin-context-banner span{margin-top:4px;color:#526b8a}.admin-context-banner a{white-space:nowrap;padding:10px 14px;border-radius:10px;background:#1769ff;color:#fff;font-weight:800}
.guide-page{margin:0;background:#f4f7fb;color:#10233d;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}.guide-top{height:78px;box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;padding:0 5vw;background:#fff;border-bottom:1px solid #dfe6ee}.guide-top .brand{color:#10233d}.guide-main{width:min(1180px,90vw);margin:0 auto;padding:48px 0 70px}.guide-hero{max-width:740px}.guide-hero h1{font-size:48px;letter-spacing:-.035em;margin:10px 0}.guide-hero p{font-size:18px;color:#64758a}.role-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:16px;margin:34px 0}.role-flow article{height:100%;box-sizing:border-box;padding:24px;border:1px solid #dce4ee;border-radius:17px;background:#fff}.role-flow article.owner{border-color:#1769ff;box-shadow:0 0 0 3px rgba(23,105,255,.08)}.role-flow small{color:#1769ff;font-weight:900}.role-flow h2{margin:10px 0}.role-flow p{color:#64758a;line-height:1.55}.role-flow a{color:#1769ff;font-weight:850}.role-flow>div{font-size:24px;color:#8ca0b7}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.guide-grid article,.monday-demo{padding:24px;border:1px solid #dce4ee;border-radius:17px;background:#fff}.guide-grid h3{margin-top:0}.guide-grid li,.monday-demo li{margin:9px 0;color:#52667d;line-height:1.45}.monday-demo{margin-top:20px}.monday-demo h2{margin:8px 0 14px}
@media(max-width:900px){.login-v16{height:auto;min-height:100vh;overflow:auto;grid-template-columns:1fr}.login-v16 .loginvisual{min-height:360px}.role-flow{grid-template-columns:1fr}.role-flow>div{transform:rotate(90deg);text-align:center}.guide-grid{grid-template-columns:1fr}}

/* V17 — rustige platformassistent */
.dw-assistant{position:fixed;right:24px;bottom:24px;z-index:1200;font-family:inherit}.assistant-launcher{display:flex;align-items:center;gap:10px;border:1px solid rgba(30,104,242,.2);background:#1767ee;color:#fff;border-radius:999px;padding:12px 17px;font:700 14px/1 inherit;box-shadow:0 12px 32px rgba(23,103,238,.22);cursor:pointer}.assistant-launcher span:first-child{font-size:18px}.assistant-panel{position:absolute;right:0;bottom:58px;width:min(380px,calc(100vw - 32px));max-height:min(620px,calc(100vh - 110px));background:#fff;border:1px solid #dfe7f3;border-radius:20px;box-shadow:0 24px 70px rgba(15,38,71,.22);overflow:hidden}.assistant-head{display:flex;justify-content:space-between;gap:16px;padding:17px 18px;border-bottom:1px solid #e7edf5;background:#f8fbff}.assistant-head strong{display:block;color:#102b50}.assistant-head small{display:block;margin-top:3px;color:#6f8098}.assistant-head button{width:34px;height:34px;border:0;border-radius:10px;background:#fff;color:#4c607e;font-size:22px;cursor:pointer}.assistant-messages{display:flex;flex-direction:column;gap:11px;max-height:285px;overflow:auto;padding:16px;background:#fff}.assistant-message{display:flex;flex-direction:column;align-items:flex-start;gap:7px}.assistant-message>div{max-width:88%;padding:11px 13px;border-radius:14px;background:#f2f6fb;color:#233b5d;font-size:14px;line-height:1.5}.assistant-message.user{align-items:flex-end}.assistant-message.user>div{background:#1767ee;color:#fff}.assistant-message button{border:1px solid #bdd2fb;background:#fff;color:#1767ee;border-radius:10px;padding:8px 10px;font-weight:700;cursor:pointer}.assistant-quick{display:flex;gap:7px;overflow-x:auto;padding:0 16px 13px}.assistant-quick button{white-space:nowrap;border:1px solid #dce6f3;background:#fff;color:#38516f;border-radius:999px;padding:8px 10px;font-size:12px;cursor:pointer}.assistant-input-row{display:grid;grid-template-columns:1fr auto;gap:8px;padding:13px 16px 16px;border-top:1px solid #e7edf5;background:#fff}.assistant-input-row input{min-width:0;border:1px solid #cfdbea;border-radius:12px;padding:11px 12px;font:inherit}.assistant-input-row button{border:0;border-radius:12px;background:#1767ee;color:#fff;padding:0 15px;font-weight:800;cursor:pointer}.assistant-note{padding:0 16px 14px;color:#8290a4;font-size:11px;line-height:1.4}.assistant-panel[hidden]{display:none!important}@media(max-width:700px){.dw-assistant{right:14px;bottom:14px}.assistant-launcher{padding:12px 14px}.assistant-launcher .assistant-label{display:none}.assistant-panel{right:0;bottom:54px}}

/* V18 — rustige campagnes en financiën */
.campaign-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:18px}.campaign-card{display:flex;gap:16px;padding:22px;border:1px solid #e1e8f0;border-radius:16px;background:#fff}.campaign-icon{font-size:30px}.campaign-card h3{margin:1px 0 8px}.campaign-card p{margin:0 0 10px;color:#65768a;line-height:1.55}.campaign-card small{display:inline-block;padding:6px 9px;border-radius:999px;background:#eef5ff;color:#1767ee;font-weight:750}.campaign-flow p{color:#65768a}.flowline{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:16px 0}.flowline span{padding:9px 11px;border-radius:10px;background:#f3f7fb}.flowline b{color:#1767ee}.finance-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.calm-list{display:grid;gap:0}.calm-list span,.status-line{padding:13px 0;border-bottom:1px solid #e8edf3}.status-line{display:flex;justify-content:space-between;gap:18px}.status-line span{color:#687a90}.wide-field{grid-column:span 2}@media(max-width:850px){.campaign-grid,.finance-grid{grid-template-columns:1fr}.wide-field{grid-column:span 1}.flowline b{display:none}}

/* V53 - centrale leadmachine / automatische instroom */
.automation-panel{border:1px solid #dbe7f5;background:linear-gradient(180deg,#fff,#f8fbff)}
.automation-actions{display:flex;align-items:center;gap:8px}
.automation-flow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 0 8px}
.automation-flow span{background:#eef5ff;border:1px solid #d6e7ff;border-radius:999px;padding:8px 12px;font-weight:700;color:#17315c}
.automation-flow b{color:#7b8da6}
.automation-status{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:8px;margin-top:8px;padding:12px;border-radius:12px;background:#f5f9ff}
.automation-status small{color:#66758a}
.status-dot{width:10px;height:10px;border-radius:50%;display:inline-block;background:#9aa8b9}.status-dot.ready{background:#1e9b62}
@media(max-width:760px){.automation-status{grid-template-columns:auto 1fr}.automation-status small{grid-column:1/-1}.automation-actions{margin-top:10px}}


/* ===== VERDUURZAMENTHUIS BUITENDIENST APP V1 ===== */
.field-body{margin:0;background:#eef4f0;color:#102d25;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;padding-bottom:78px}
.field-header{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:11px 14px;background:rgba(255,255,255,.96);border-bottom:1px solid #dbe7df;backdrop-filter:blur(12px)}
.field-brand{display:flex;align-items:center;gap:9px}.field-brand img{width:48px;height:38px}.field-brand div{display:flex;flex-direction:column}.field-brand strong{font-size:16px}.field-brand span{font-size:11px;color:#597269}
.field-online{font-size:12px;font-weight:800;color:#168447;background:#e8f6ed;padding:7px 10px;border-radius:999px}
.field-shell{width:min(760px,100%);margin:auto;padding:14px}
.field-hero{background:linear-gradient(145deg,#0a5733,#11814a);color:#fff;border-radius:24px;padding:22px;margin-bottom:14px;box-shadow:0 14px 32px rgba(9,79,46,.18)}
.field-hero h1{margin:4px 0 8px;font-size:clamp(25px,7vw,38px);line-height:1.05}.field-hero p{margin:0;line-height:1.45}.field-hero .eyebrow{color:#aee8c0}
.field-form{display:grid;gap:14px}.field-card{background:#fff;border:1px solid #dce7e0;border-radius:22px;padding:18px;box-shadow:0 8px 24px rgba(12,57,38,.06)}
.field-card-title{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px}.field-card-title>span{display:grid;place-items:center;min-width:38px;height:38px;border-radius:50%;background:#11804a;color:#fff;font-weight:900}.field-card-title small{color:#18814b;font-weight:900;letter-spacing:.12em}.field-card-title h2{margin:3px 0 0;font-size:21px;line-height:1.15}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field-card label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:800}.field-card input,.field-card select,.field-card textarea{width:100%;box-sizing:border-box;border:1px solid #cfded5;border-radius:13px;padding:13px;background:#fbfdfc;font:inherit;font-size:16px;color:#102d25}
.field-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.field-choice{border:1px solid #cddcd3;background:#fff;border-radius:14px;padding:13px;text-align:left;font-weight:800;font-size:14px;color:#17372d}.field-choice.selected{border-color:#15854c;background:#e9f7ee;color:#0c6b3b;box-shadow:inset 0 0 0 1px #15854c}
.field-actions-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.field-secondary{border:1px solid #b9d1c2;background:#fff;color:#0d6d3d;border-radius:13px;padding:12px 14px;font-weight:850}
.field-consent{margin-top:14px!important;display:flex!important;flex-direction:row!important;align-items:flex-start;gap:9px!important;background:#eff7f2;padding:13px;border-radius:14px}.field-consent input{width:20px!important;height:20px!important;flex:0 0 auto}
.field-submit-card{background:#0c673b;border-radius:22px;padding:18px;text-align:center}.field-submit-card button[type=submit]{width:100%;border:0;border-radius:15px;padding:16px;background:#45c638;color:#fff;font-size:18px;font-weight:900}.field-submit-card p{min-height:20px;color:#fff;font-weight:750}.field-submit-card p.error{background:#a52828;padding:10px;border-radius:10px}.field-submit-card p.success{font-size:18px}
.field-bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:1fr 1fr 1fr;background:#fff;border-top:1px solid #d5e3da;padding:7px max(7px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left));box-shadow:0 -8px 24px rgba(11,54,36,.1)}
.field-bottom-nav a{text-decoration:none;text-align:center;padding:10px 4px;border-radius:11px;color:#5b7168;font-size:12px;font-weight:850}.field-bottom-nav a.active{background:#e8f6ed;color:#0b713f}
.field-conditional[hidden],#checkSection[hidden],#homeSection[hidden]{display:none!important}
@media(max-width:620px){.field-shell{padding:10px}.field-card{padding:15px;border-radius:19px}.field-grid,.field-choice-grid{grid-template-columns:1fr}.field-card-title h2{font-size:19px}.field-choice{font-size:13px}.field-header{padding:9px 11px}}


/* ===== V57 INTEGRATIE BUITENDIENST ===== */
.field-module-nav{
  background:linear-gradient(135deg,#0e7444,#149454)!important;
  color:#fff!important;
  margin-top:5px!important;
}
.field-module-nav:hover{background:linear-gradient(135deg,#0a5f37,#117d48)!important}

.field-success-panel{
  min-height:calc(100vh - 150px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:linear-gradient(145deg,#ffffff,#eaf7ef);
  border:1px solid #cfe4d6;
  border-radius:26px;
  padding:30px 22px;
  box-shadow:0 18px 44px rgba(9,78,45,.13);
}
.field-success-panel[hidden]{display:none!important}
.field-success-check{
  display:grid;
  place-items:center;
  width:78px;
  height:78px;
  border-radius:50%;
  background:#22a454;
  color:#fff;
  font-size:42px;
  font-weight:950;
  box-shadow:0 14px 34px rgba(26,143,75,.26);
}
.field-success-panel h1{
  margin:8px 0 10px;
  font-size:clamp(28px,7vw,46px);
  line-height:1.05;
  color:#11342a;
}
.field-success-panel>p:not(.eyebrow){
  max-width:600px;
  margin:0 0 22px;
  line-height:1.55;
  color:#526b62;
}
.field-success-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  width:100%;
}
.field-success-actions button,
.field-success-actions a{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-height:48px;
  border-radius:14px;
  padding:12px 18px;
  font-weight:900;
  text-decoration:none;
  border:0;
}
.field-success-actions button{background:#23a654;color:#fff}
.field-success-leads{background:#163f62;color:#fff}
.field-success-dashboard{background:#fff;color:#174b37;border:1px solid #bfd4c7!important}
@media(max-width:620px){
  .field-success-actions{display:grid;grid-template-columns:1fr}
  .field-success-actions button,.field-success-actions a{width:100%;box-sizing:border-box}
}


/* ===== V59 LEADS & DOSSIER FIX ===== */
.table-wrap{
  overflow-x:auto;
  overflow-y:visible;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-bottom:10px;
}
.table-wrap table{
  min-width:1120px;
}
.table-wrap tbody tr[data-lead-row-id]{
  cursor:pointer;
  transition:background .18s ease, box-shadow .18s ease;
}
.table-wrap tbody tr[data-lead-row-id]:hover{
  background:#f4f8ff;
}
.table-wrap tbody tr.lead-row-new{
  background:#f1fbf5;
  box-shadow:inset 4px 0 0 #1aa554;
}
.new-lead-label{
  display:inline-flex;
  align-items:center;
  margin-left:7px;
  padding:3px 7px;
  border-radius:999px;
  background:#dff7e8;
  color:#087641;
  font-size:10px;
  letter-spacing:.08em;
  vertical-align:middle;
}
.lead-source-line{
  margin-top:5px;
  color:#11804a!important;
  font-weight:800;
}
.table-actions{
  position:sticky;
  right:0;
  background:inherit;
}
.table-actions button{
  white-space:nowrap;
}
.dossier-panel{
  overflow:visible!important;
}
.dossier-header{
  position:sticky;
  top:0;
  z-index:8;
  background:#fff;
}
#leads.view.active{
  overflow:visible;
}
@media(max-width:900px){
  .table-wrap table{min-width:980px}
  .dossier-header{
    position:static;
    flex-direction:column;
  }
}


/* ===== V60 COMPLETE BUITENDIENST-APP ===== */
.field-product-groups{
  display:grid;
  gap:18px;
}
.field-product-group{
  border:1px solid #d8e7de;
  border-radius:18px;
  padding:14px;
  background:#f9fcfa;
}
.field-product-group h3,
.field-card>h3{
  margin:0 0 12px;
  font-size:16px;
  color:#17372d;
}
.field-grid-top{
  margin-top:18px;
}
@media(min-width:760px){
  .field-product-groups{
    grid-template-columns:1fr 1fr;
  }
}


/* ===== V61 DOSSIER DIRECT NAAR GEGEVENS ===== */
#dossierInformation,
#dossierBody{
  scroll-margin-top:18px;
}
.dossier-panel{
  padding-top:18px;
}
.dossier-header{
  margin-bottom:10px;
}
.dossier-tabs{
  margin-bottom:12px;
}


/* ===== V62 DW FIELD APP ===== */
.field-day-stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-bottom:14px;
}
.field-day-stats article{
  background:#fff;
  border:1px solid #dce7e0;
  border-radius:18px;
  padding:14px 10px;
  text-align:center;
  box-shadow:0 8px 22px rgba(12,57,38,.05);
}
.field-day-stats strong{
  display:block;
  font-size:24px;
  color:#0d7542;
}
.field-day-stats span{
  font-size:11px;
  color:#667a72;
  font-weight:800;
}
.field-map-card,.field-address-card{
  background:#fff;
  border:1px solid #dce7e0;
  border-radius:22px;
  padding:16px;
  margin-bottom:14px;
  box-shadow:0 8px 24px rgba(12,57,38,.06);
}
.field-section-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-bottom:12px;
}
.field-section-head h2{
  margin:3px 0 0;
  font-size:22px;
}
.field-map{
  height:340px;
  border-radius:17px;
  overflow:hidden;
  border:1px solid #d5e4db;
}
.field-map-note{
  margin:10px 0 0;
  color:#65796f;
  font-size:12px;
}
.field-address-filters{
  display:flex;
  gap:7px;
  overflow-x:auto;
  padding-bottom:8px;
}
.field-address-filters button{
  flex:0 0 auto;
  border:1px solid #cddfd4;
  background:#fff;
  border-radius:999px;
  padding:8px 11px;
  font-size:12px;
  font-weight:850;
  color:#476157;
}
.field-address-filters button.active{
  background:#0d7542;
  color:#fff;
  border-color:#0d7542;
}
.field-address-list{
  display:grid;
  gap:9px;
}
.field-address-item{
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  border:1px solid #dbe7df;
  border-radius:16px;
  padding:12px;
  background:#fbfdfc;
}
.field-address-status{font-size:22px}
.field-address-main{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.field-address-main strong{font-size:15px}
.field-address-main span{font-size:12px;color:#5f736a}
.field-address-main small{font-size:11px;color:#0b7b43;font-weight:850;margin-top:3px}
.field-address-actions{
  display:flex;
  gap:6px;
}
.field-address-actions button{
  border:1px solid #bfd3c6;
  background:#fff;
  color:#0a6f3d;
  border-radius:10px;
  padding:8px 10px;
  font-size:12px;
  font-weight:850;
}
.field-form-divider{
  display:flex;
  align-items:center;
  gap:12px;
  margin:20px 0 12px;
  font-weight:950;
  color:#0b673b;
}
.field-form-divider:before,.field-form-divider:after{
  content:"";
  height:1px;
  background:#cddfd4;
  flex:1;
}
.leaflet-popup-content button{
  border:0;
  border-radius:8px;
  background:#0d7542;
  color:#fff;
  padding:7px 10px;
  font-weight:800;
}
@media(max-width:680px){
  .field-day-stats{grid-template-columns:repeat(2,1fr)}
  .field-map{height:280px}
  .field-address-item{
    grid-template-columns:32px minmax(0,1fr);
  }
  .field-address-actions{
    grid-column:1 / 3;
  }
  .field-address-actions button{flex:1}
}


/* ===== V63 PRIVACYVRIENDELIJK BEDANKSCHERM ===== */
.field-success-public{
  min-height:calc(100vh - 120px);
}
.field-success-actions-single{
  display:block;
  width:min(100%,420px);
}
.field-success-actions-single button{
  width:100%;
}


/* ===== V64 CENTRALE ADRESSEN, WIJKEN EN ROUTES ===== */
.field-sync-banner{display:flex;flex-direction:column;gap:3px;border-radius:16px;padding:13px 15px;margin-bottom:12px;border:1px solid #d7e4dc;background:#fff}
.field-sync-banner strong{font-size:14px}.field-sync-banner span{font-size:12px;color:#61746b}
.field-sync-banner.online{background:#eaf8ef;border-color:#bfe0cb}.field-sync-banner.local{background:#fff7e6;border-color:#efd7a0}
.field-day-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:12px}
.field-day-stats article{background:#fff;border:1px solid #dae6df;border-radius:16px;padding:13px;text-align:center}
.field-day-stats strong{display:block;font-size:23px;color:#0d7642}.field-day-stats span{font-size:11px;font-weight:800;color:#65786f}
.field-control-tabs{display:flex;gap:7px;overflow-x:auto;margin-bottom:12px}
.field-control-tabs button{flex:1;min-width:95px;border:1px solid #cfe0d6;background:#fff;border-radius:13px;padding:11px;font-weight:900;color:#526b61}
.field-control-tabs button.active{background:#0d7542;color:#fff;border-color:#0d7542}
.field-module-panel{display:none}.field-module-panel.active{display:block}
.field-map-card,.field-address-card{background:#fff;border:1px solid #dce7e0;border-radius:22px;padding:16px;margin-bottom:14px;box-shadow:0 8px 24px rgba(12,57,38,.06)}
.field-section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.field-section-head h2{margin:3px 0 0;font-size:22px}
.field-head-actions{display:flex;gap:7px;flex-wrap:wrap}
.field-map{height:390px;border-radius:17px;overflow:hidden;border:1px solid #d5e4db}.field-map-note{font-size:12px;color:#61746b}
.field-list-tools,.field-route-controls{display:grid;grid-template-columns:2fr 1fr 1fr;gap:8px;margin-bottom:10px}
.field-list-tools input,.field-list-tools select,.field-route-controls select{border:1px solid #ccddd3;border-radius:12px;padding:11px;font:inherit}
.field-primary-small{border:0;border-radius:12px;background:#168447;color:#fff;padding:11px 14px;font-weight:900}
.field-address-filters{display:flex;gap:7px;overflow-x:auto;padding-bottom:8px}.field-address-filters button{flex:0 0 auto;border:1px solid #cddfd4;background:#fff;border-radius:999px;padding:8px 11px;font-size:12px;font-weight:850}.field-address-filters button.active{background:#0d7542;color:#fff}
.field-address-list,.field-area-list{display:grid;gap:9px}
.field-address-item{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;border:1px solid #dae6df;border-radius:15px;padding:12px;background:#fbfdfc}.field-address-item.hot{box-shadow:inset 4px 0 #f2a100}
.field-address-main{display:flex;flex-direction:column}.field-address-main span,.field-address-main small{font-size:12px;color:#61746b}.field-address-main small{color:#137543;font-weight:800}
.field-address-actions{display:flex;gap:5px;flex-wrap:wrap}.field-address-actions button{border:1px solid #bfd3c6;background:#fff;color:#0a6f3d;border-radius:9px;padding:8px;font-size:11px;font-weight:850}
.field-area-item{display:grid;grid-template-columns:18px 1fr;gap:11px;align-items:center;border:1px solid #dae6df;border-radius:15px;padding:13px}.field-area-color{width:16px;height:44px;border-radius:8px}.field-area-item div{display:flex;flex-direction:column}.field-area-item span,.field-area-item small{font-size:12px;color:#61746b}
.field-route-list{display:grid;gap:8px;padding-left:0;list-style:none}.field-route-list li{display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center;border:1px solid #dae6df;border-radius:14px;padding:10px}.field-route-list li>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#0d7542;color:#fff;font-weight:900}.field-route-list li div{display:flex;flex-direction:column}.field-route-list small{color:#61746b}.field-route-list button{border:0;border-radius:9px;background:#e7f5ec;color:#0c7040;padding:8px;font-weight:850}
.field-dialog{width:min(680px,94vw);border:0;border-radius:22px;padding:0;box-shadow:0 24px 80px rgba(0,0,0,.25)}.field-dialog::backdrop{background:rgba(5,28,19,.58)}.field-dialog form{padding:22px}.field-dialog h2{margin-top:0}.field-dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.field-form-divider{display:flex;align-items:center;gap:12px;margin:20px 0 12px;font-weight:950;color:#0b673b}.field-form-divider:before,.field-form-divider:after{content:"";height:1px;background:#cddfd4;flex:1}
@media(max-width:700px){.field-day-stats{grid-template-columns:repeat(2,1fr)}.field-map{height:300px}.field-list-tools,.field-route-controls{grid-template-columns:1fr}.field-address-item{grid-template-columns:32px 1fr}.field-address-actions{grid-column:1/3}.field-section-head{align-items:flex-start;flex-direction:column}}


/* ===== V65 MOBIELE BETA + PERSOONLIJKE INLOG ===== */
.field-user-controls{display:flex;align-items:center;gap:7px;min-width:0}
.field-user-name{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:850;color:#31574a}
.field-logout{border:1px solid #c9ddd1;background:#fff;color:#0b7040;border-radius:10px;padding:8px 10px;font-weight:850;font-size:12px}

.field-login-body{margin:0;min-height:100vh;background:linear-gradient(145deg,#e9f3ed,#f8fbf9);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:#11352a}
.field-login-shell{min-height:100vh;display:grid;place-items:center;padding:20px}
.field-login-card{width:min(100%,420px);box-sizing:border-box;background:#fff;border:1px solid #d8e6de;border-radius:28px;padding:28px;box-shadow:0 24px 70px rgba(8,72,42,.14)}
.field-login-mark{display:grid;place-items:center;width:68px;height:68px;border-radius:20px;background:linear-gradient(145deg,#0b653b,#1aa457);color:#fff;font-size:25px;font-weight:950;margin-bottom:20px}
.field-login-card h1{font-size:34px;line-height:1.05;margin:5px 0 10px}
.field-login-intro{color:#5d756b;line-height:1.5;margin-bottom:22px}
.field-login-card form{display:grid;gap:14px}
.field-login-card label{display:grid;gap:7px;font-size:13px;font-weight:850}
.field-login-card input{border:1px solid #cbded2;border-radius:14px;padding:14px;font:inherit;font-size:16px}
.field-login-card button{border:0;border-radius:14px;padding:15px;background:#128047;color:#fff;font:inherit;font-weight:950;font-size:17px}
#fieldLoginMessage{min-height:20px;color:#a32424;font-weight:750}
.field-login-card small{display:block;text-align:center;color:#71867d;margin-top:18px}

@media(max-width:700px){
  .field-header{align-items:flex-start}
  .field-user-controls{flex-wrap:wrap;justify-content:flex-end}
  .field-online{display:none}
  .field-user-name{max-width:105px}
  .field-map{height:54vh;min-height:310px}
  .field-shell{padding-bottom:96px}
  .field-control-tabs{position:sticky;top:63px;z-index:12;background:#eef4f0;padding:7px 0}
  .field-address-card,.field-map-card{border-radius:18px;padding:13px}
  .field-login-card{padding:22px;border-radius:23px}
}


/* ===== V66 MOBIELE PRODUCTIEVERSIE ===== */
[hidden]{display:none!important}

.field-map{
  position:relative;
  background:
    radial-gradient(circle at 20% 20%, rgba(22,132,71,.08), transparent 34%),
    #eef5f0;
  min-height:340px;
}

.field-map-error{
  min-height:340px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:8px;
  padding:24px;
  color:#385b4e;
}
.field-map-error strong{font-size:18px;color:#0b6d3d}
.field-map-error span{max-width:340px;line-height:1.5}

.field-map-has-error::after{
  content:"Een deel van de kaart kon niet worden geladen. Controleer de internetverbinding.";
  position:absolute;
  left:12px;right:12px;bottom:12px;
  z-index:1000;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(255,247,229,.96);
  border:1px solid #e6cb8a;
  color:#6b521a;
  font-size:12px;
  font-weight:750;
}

.field-customer-thanks{
  background:linear-gradient(145deg,#edf7f1,#ffffff);
}
.field-customer-thanks .field-shell{
  width:100%;
  max-width:none;
  padding:0;
}
.field-customer-thanks .field-success-public{
  min-height:100svh;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:max(30px, env(safe-area-inset-top)) 22px max(30px, env(safe-area-inset-bottom));
}
.field-customer-thanks .field-success-actions-single{
  width:min(100%,390px);
}

@media(max-width:700px){
  body{-webkit-text-size-adjust:100%}
  .field-shell{
    width:100%;
    padding-left:10px;
    padding-right:10px;
    box-sizing:border-box;
  }
  .field-header{
    position:sticky;
    top:0;
    z-index:1100;
    background:rgba(248,252,249,.96);
    backdrop-filter:blur(12px);
  }
  .field-day-stats article{
    min-height:86px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  .field-control-tabs button{
    min-height:48px;
    font-size:15px;
  }
  .field-address-actions button,
  .field-primary-small,
  .field-secondary{
    min-height:44px;
  }
  .field-map{
    height:52svh;
    min-height:330px;
    max-height:560px;
  }
  .field-bottom-nav{
    padding-bottom:max(8px, env(safe-area-inset-bottom));
  }
}


/* ===== V67 AUTOMATISCHE LOCATIE EN WIJK ===== */
.field-auto-location{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:14px 0;
  padding:14px;
  border-radius:16px;
  background:#eef8f2;
  border:1px solid #c8e1d2;
}
.field-auto-location>div{display:flex;flex-direction:column;gap:4px}
.field-auto-location strong{color:#0b6f3e}
.field-auto-location span{color:#60766c;font-size:12px;line-height:1.45}
.field-inline-location{
  display:block;
  width:100%;
  margin-top:8px;
  color:#0d7542;
  font-size:12px;
  font-weight:800;
}
@media(max-width:700px){
  .field-auto-location{align-items:stretch;flex-direction:column}
  .field-auto-location button{width:100%}
}


/* ===== V68 VOLAUTOMATISCHE ADRESVERWERKING ===== */
.field-auto-location-passive{
  justify-content:flex-start;
}
.field-auto-location-passive::before{
  content:"✓";
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:36px;
  height:36px;
  border-radius:50%;
  background:#168447;
  color:#fff;
  font-weight:950;
}
.field-dialog button[disabled]{
  opacity:.65;
  cursor:wait;
}


/* ===== V69 PRODUCTIERIJPE WORKFLOW ===== */
.private-customer-label{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:4px 9px;
  background:#e8f7ee;
  color:#087542;
  font-size:12px;
  font-weight:900;
}


/* ===== V70 DEFINITIEVE TELEFOONVERSIE ===== */
.field-auth-checking .field-login-shell{
  visibility:hidden;
}
.field-auth-splash{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:24px;
  background:linear-gradient(145deg,#edf7f1,#ffffff);
  color:#103d2d;
  text-align:center;
}
.field-auth-splash[hidden]{
  display:none!important;
}
.field-auth-splash img{
  width:92px;
  height:92px;
  border-radius:24px;
  box-shadow:0 18px 38px rgba(11,106,59,.18);
}
.field-auth-splash strong{
  font-size:24px;
}
.field-auth-splash span{
  color:#61786d;
  font-weight:750;
}

.field-install-button{
  min-height:42px;
  border-radius:13px;
  border:1px solid #b9d8c6;
  background:#edf8f2;
  color:#0a7140;
  font-weight:900;
  padding:0 14px;
}

@media(display-mode:standalone){
  .field-install-button{
    display:none!important;
  }
}

@media(max-width:700px){
  .field-login-card{
    width:min(100%,430px);
  }
  .field-header-actions{
    gap:7px;
  }
  .field-install-button{
    font-size:12px;
    padding:0 10px;
  }
}

/* ===== V76 MEDEWERKERSBEHEER ===== */
.field-employee-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}
.field-employee-summary article{background:#edf8f0;border:1px solid #cfe6d7;border-radius:16px;padding:16px;text-align:center}
.field-employee-summary strong{display:block;font-size:26px;color:#0d6f3f}.field-employee-summary span{font-size:13px;color:#61786d;font-weight:800}
.field-employee-list{display:grid;gap:12px}.field-employee-card{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;background:#fff;border:1px solid #dce9df;border-radius:18px;padding:16px}
.field-employee-card h3{margin:0 0 4px;font-size:17px}.field-employee-card p{margin:0;color:#61786d}.field-employee-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}.field-employee-chip{display:inline-flex;padding:6px 9px;border-radius:999px;background:#eef3ef;color:#244638;font-size:12px;font-weight:900}.field-employee-chip.active{background:#e7f7ec;color:#08713d}.field-employee-chip.blocked{background:#fff0ee;color:#a32a20}
.field-employee-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.field-employee-actions button{border:1px solid #cfe0d5;background:#fff;color:#164a34;border-radius:11px;padding:9px 11px;font-weight:900;cursor:pointer}.field-employee-actions button.danger{color:#a32a20;border-color:#efc5c0}
@media(max-width:650px){.field-employee-summary{grid-template-columns:1fr 1fr 1fr}.field-employee-card{grid-template-columns:1fr}.field-employee-actions{justify-content:flex-start}}


/* ===== V77 DUIDELIJKE BRANDING EN LIVEGANG MELDING ===== */
.field-brand strong{font-size:18px;line-height:1.1}
.field-brand span{font-size:11px;color:#63766b;font-weight:800}
.field-live-note{display:flex;gap:10px;align-items:flex-start;background:#fff8e7;border:1px solid #efd99b;border-radius:16px;padding:14px 16px;margin:14px 0 18px;color:#624c13}
.field-live-note strong{min-width:180px}.field-live-note span{line-height:1.45}
@media(max-width:650px){.field-live-note{display:block}.field-live-note strong{display:block;margin-bottom:5px}.field-brand strong{font-size:16px}}


/* V78 · persoonlijk dashboard en zelfstandige VerduurzamenThuis.nl Werkapp */
.field-personal-dashboard{display:grid;gap:12px;margin-bottom:14px}
.field-welcome-card,.field-next-card{background:#fff;border:1px solid #d7e6dd;border-radius:22px;box-shadow:0 10px 28px rgba(23,86,57,.08)}
.field-welcome-card{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:19px 20px}
.field-welcome-card h2{margin:2px 0 6px;font-size:clamp(21px,5vw,30px);color:#123d2e}
.field-welcome-card p{margin:0;color:#657a70}
.field-date-badge{flex:0 0 auto;background:#e8f6ee;color:#0c6e3d;border-radius:999px;padding:9px 12px;font-size:12px;font-weight:850;text-transform:capitalize}
.field-next-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:13px;align-items:center;padding:15px 16px}
.field-next-icon{width:45px;height:45px;border-radius:15px;display:grid;place-items:center;background:#0d7642;color:#fff;font-size:24px;box-shadow:0 8px 18px rgba(13,118,66,.2)}
.field-next-copy{display:grid;gap:2px;min-width:0}.field-next-copy span{font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#6d8177}.field-next-copy strong{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#143d2f}.field-next-copy small{color:#6b7c74}
.field-quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.field-quick-actions button{appearance:none;border:1px solid #d7e6dd;background:#fff;border-radius:18px;padding:14px 12px;text-align:left;display:grid;gap:4px;color:#183e31;cursor:pointer;box-shadow:0 7px 20px rgba(23,86,57,.06)}
.field-quick-actions button:hover{transform:translateY(-1px);border-color:#99cbb0}.field-quick-actions button span{font-size:22px;color:#0d7642}.field-quick-actions button strong{font-size:14px}.field-quick-actions button small{font-size:11px;line-height:1.3;color:#718279}
.field-bottom-nav button{appearance:none;border:0;background:transparent;color:inherit;font:inherit;font-weight:800;cursor:pointer;padding:10px 7px}
.field-bottom-nav button.active{color:#0d7642}
@media(max-width:760px){.field-quick-actions{grid-template-columns:repeat(2,1fr)}.field-welcome-card{align-items:flex-start}.field-date-badge{font-size:10px;padding:7px 9px}.field-next-card{grid-template-columns:auto minmax(0,1fr)}.field-next-card .field-primary-small{grid-column:1/-1;width:100%}}


/* V79 - slimme adaptieve Woningcheck */
.field-progress{position:sticky;top:8px;z-index:20;margin:0 0 14px;padding:12px 14px;border:1px solid #d8e9df;border-radius:16px;background:rgba(255,255,255,.96);box-shadow:0 8px 24px rgba(16,84,52,.08);backdrop-filter:blur(10px)}
.field-progress-copy{display:flex;justify-content:space-between;gap:12px;color:#17613d;font-size:13px}.field-progress-track{height:7px;margin-top:8px;border-radius:999px;background:#e7f2eb;overflow:hidden}.field-progress-track i{display:block;width:12%;height:100%;border-radius:999px;background:linear-gradient(90deg,#16824b,#49bb6b);transition:width .25s ease}
.field-route-grid{grid-template-columns:repeat(3,1fr)}.field-route-help{margin:12px 0 0;color:#6c7d72;font-size:13px}
.field-card-title>span{position:relative;overflow:visible;background:#10251b;border:2px solid #2fb765;box-shadow:0 4px 12px rgba(17,90,51,.17)}
.field-card-title>span:before,.field-card-title>span:after{content:'';position:absolute;background:#43c56e;border-radius:100% 0 100% 0;transform:rotate(-35deg)}
.field-card-title>span:before{width:13px;height:8px;right:-7px;top:4px}.field-card-title>span:after{width:10px;height:6px;right:-8px;top:15px;transform:rotate(20deg)}
.field-product-group[hidden],label[hidden]{display:none!important}
@media(max-width:700px){.field-route-grid{grid-template-columns:1fr}.field-progress{top:4px}.field-route-grid .field-choice{min-height:56px}}


/* V80: na verzenden alleen het bedankscherm tonen */
.field-customer-thanks [hidden]{display:none!important}
.field-customer-thanks .field-shell > *:not(#fieldSuccessPanel){display:none!important}
.field-customer-thanks #fieldSuccessPanel{display:flex!important;min-height:100svh;box-sizing:border-box;flex-direction:column;align-items:center;justify-content:center}


/* ===== V81 COMPACTE MOBIELE NAVIGATIE ===== */
@media (min-width: 761px) {
  .field-bottom-nav { display: none !important; }
  .field-body { padding-bottom: 0 !important; }
  .field-shell { padding-bottom: 28px !important; }
}

@media (max-width: 760px) {
  .field-body { padding-bottom: 56px !important; }
  .field-shell { padding-bottom: 62px !important; }
  .field-bottom-nav {
    grid-template-columns: repeat(4, 1fr) !important;
    min-height: 48px;
    padding: 3px max(4px, env(safe-area-inset-right)) calc(3px + env(safe-area-inset-bottom)) max(4px, env(safe-area-inset-left)) !important;
    box-shadow: 0 -3px 12px rgba(11,54,36,.08) !important;
  }
  .field-bottom-nav button {
    min-height: 42px;
    padding: 5px 2px !important;
    border-radius: 8px;
    font-size: 10.5px !important;
    line-height: 1.08;
    font-weight: 800 !important;
  }
  .field-bottom-nav button.active {
    background: #e8f6ed !important;
    color: #0d7642 !important;
  }
}


/* V82 – uniforme witte nummerbadge met groen blaadje */
.field-card-title>span{
  background:#fff !important;
  color:#10251b !important;
  border:2px solid #2fb765 !important;
  box-shadow:0 4px 12px rgba(17,90,51,.14) !important;
}

/* De afspraaksoort verdwijnt bij telefonisch terugbellen: geen dubbel telefoonblok. */
#appointmentTypeSection[hidden]{display:none !important;}


/* V83 – afspraakgedeelte begint altijd schoon en toont geen dubbele telefoonkeuze. */
#appointmentTypeSection[hidden]{display:none !important;}


/* ===== V84 TECHNISCHE EINDCONTROLE ===== */
.field-system-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}
.field-system-summary article{background:#f5faf7;border:1px solid #d7e7dd;border-radius:16px;padding:16px;text-align:center}
.field-system-summary strong{display:block;font-size:28px;color:#0d6f3f}.field-system-summary span{font-size:12px;color:#61786d;font-weight:850}
.field-system-list{display:grid;gap:10px;margin:12px 0 18px}
.field-system-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;background:#fff;border:1px solid #dce9df;border-radius:16px;padding:14px 15px}
.field-system-item p{margin:3px 0 0;color:#657a70;line-height:1.4}.field-system-item b{font-size:12px;border-radius:999px;padding:6px 9px;white-space:nowrap}
.field-system-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:20px;font-weight:950}
.field-system-item.pass .field-system-icon,.field-system-item.pass b{background:#e5f7eb;color:#08713d}.field-system-item.warn .field-system-icon,.field-system-item.warn b{background:#fff3d8;color:#8a5a00}.field-system-item.fail .field-system-icon,.field-system-item.fail b{background:#ffebe8;color:#aa2b20}
@media(max-width:650px){.field-system-item{grid-template-columns:auto minmax(0,1fr)}.field-system-item b{grid-column:2;justify-self:start}.field-system-summary article{padding:12px 7px}.field-system-summary strong{font-size:23px}}


/* V85 - Vrij huisbezoek en slimme adreszoeker */
.field-visit-start{border-top:4px solid #168447;background:linear-gradient(180deg,#ffffff 0%,#f7fbf8 100%)}
.field-address-lookup,.field-assigned-visit{margin-top:16px;padding:16px;border:1px solid #dfe9e2;border-radius:18px;background:#fff}
.field-address-search-grid{align-items:end}
.field-address-search-actions{flex-wrap:wrap;margin-top:10px}
.field-address-status{min-height:22px;margin:12px 0 0;color:#365646;font-weight:700}
.field-address-status.error{color:#b42318}
.field-address-results{display:grid;gap:10px;margin-top:12px}
.field-address-result{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:left;padding:14px 16px;border:1px solid #d8e6dc;border-radius:16px;background:#fff;color:#17352a;box-shadow:0 5px 16px rgba(21,80,48,.06);cursor:pointer}
.field-address-result:hover,.field-address-result:focus{border-color:#168447;background:#f1f9f4;transform:translateY(-1px)}
.field-address-result strong{display:block;font-size:15px}
.field-address-result span{display:block;margin-top:3px;font-size:13px;color:#5f7469}
.field-address-result b{white-space:nowrap;color:#168447}
.field-address-confirmed{margin-top:12px;padding:12px 14px;border-radius:14px;background:#eaf8ef;color:#145c34;font-weight:800}
@media(max-width:700px){
  .field-address-result{align-items:flex-start;flex-direction:column}
  .field-address-result b{font-size:13px}
  .field-address-search-actions button{width:100%}
}


/* V86 - Premium locatie-ervaring en nette uitlijning */
.field-address-status{font-size:15px}
.field-address-status:empty{display:none}
.field-location-help,.field-location-loading{display:flex;align-items:flex-start;gap:12px;margin-top:14px;padding:14px 16px;border:1px solid #cfe2d5;border-radius:16px;background:#f5fbf7;color:#173e2d;box-shadow:0 5px 16px rgba(21,80,48,.05)}
.field-location-help-icon{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#e3f5e9;font-size:18px}
.field-location-help strong,.field-location-loading strong{display:block;font-size:16px;color:#114d2c}
.field-location-help p{margin:4px 0 0;color:#526b60;font-weight:600;line-height:1.45}
.field-location-help-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.field-location-help-actions .field-secondary{padding:9px 12px;border-radius:11px}
.field-link-button{border:0;background:transparent;color:#0d7542;font-weight:900;padding:9px 8px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.field-location-spinner{width:20px;height:20px;border:3px solid #cbe5d4;border-top-color:#168447;border-radius:50%;animation:fieldSpin .8s linear infinite;flex:0 0 auto}
@keyframes fieldSpin{to{transform:rotate(360deg)}}
.field-control-tabs{padding-inline:4px;scroll-padding-inline:10px}
.field-control-tabs button:first-child{margin-left:2px}
.field-control-tabs button:last-child{margin-right:2px}
@media(max-width:700px){
  .field-location-help-actions{flex-direction:column;align-items:stretch}
  .field-location-help-actions button{width:100%}
  .field-control-tabs{padding-inline:10px;margin-inline:-4px}
}


/* V87 - slimme adresverificatie en strakke tabuitlijning */
.field-control-tabs{align-items:stretch;padding-inline:8px;scroll-padding-inline:12px}
.field-control-tabs button{display:flex;align-items:center;justify-content:center;min-height:48px;padding:11px 18px;white-space:nowrap;text-align:center;line-height:1.1;box-sizing:border-box}
.field-control-tabs button:first-child,.field-control-tabs button:last-child{margin-inline:0}
.field-gps-proposal{margin-top:14px;padding:17px;border:1px solid #b9dac5;border-radius:18px;background:#fff;box-shadow:0 8px 22px rgba(18,83,48,.08)}
.field-gps-proposal-head{display:flex;align-items:center;gap:12px}
.field-gps-proposal-head>span{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#e4f6ea;font-size:21px}
.field-gps-proposal-head small{display:block;color:#168447;font-weight:900;letter-spacing:.11em;font-size:12px}
.field-gps-proposal-head strong{display:block;margin-top:3px;color:#103b2b;font-size:18px}
.field-gps-proposal p{margin:10px 0 0;color:#526b60;font-weight:600;line-height:1.45}
.field-gps-proposal-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}
.field-gps-proposal-actions button{min-height:43px}
@media(max-width:720px){
  .field-control-tabs button{flex:0 0 auto;min-width:132px;min-height:44px;padding:10px 16px}
  .field-gps-proposal-actions{flex-direction:column}
  .field-gps-proposal-actions button{width:100%}
}


/* V88 rapport- en tijdlijnworkflow */
.field-report-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px}.field-report-head h3{margin:0 0 6px}.field-report-head p{margin:0;max-width:720px;color:#5d6d64}.field-status-pill{display:inline-flex;align-items:center;white-space:nowrap;border-radius:999px;padding:7px 12px;font-size:.82rem;font-weight:800}.status-not-requested{background:#eef1ef;color:#526159}.status-requested{background:#e9f6ee;color:#126a39}.status-concept{background:#fff4d7;color:#785600}.field-report-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.field-report-preview{margin-top:16px;padding:18px;border:1px solid #cfe2d5;border-radius:18px;background:#f8fcf9}.field-report-preview h3{margin-top:0}.field-report-preview dl{display:grid;gap:8px}.field-report-preview dl div{display:grid;grid-template-columns:160px 1fr;gap:12px;padding-bottom:8px;border-bottom:1px solid #e5eee8}.field-report-preview dt{font-weight:800;color:#153d28}.field-report-preview dd{margin:0}.field-success-timeline{margin:24px auto;text-align:left;max-width:650px}.field-success-timeline h2{text-align:center}.field-success-timeline ol{list-style:none;padding:0;margin:0;display:grid;gap:10px}.field-success-timeline li{position:relative;padding:14px 16px 14px 45px;border:1px solid #dce8df;border-radius:16px;background:#fff}.field-success-timeline li:before{content:'○';position:absolute;left:16px;top:13px;color:#6b7b70;font-size:1.25rem}.field-success-timeline li.done:before,.field-success-timeline li.active:before{content:'✓';color:#168447;font-weight:900}.field-success-timeline li strong,.field-success-timeline li span{display:block}.field-success-timeline li span{color:#637269;margin-top:3px;font-size:.92rem}@media(max-width:700px){.field-report-head{display:block}.field-status-pill{margin-top:12px}.field-report-preview dl div{grid-template-columns:1fr;gap:2px}}


/* V90 – slimme tweefasenworkflow en leadkwaliteit */
.field-workflow-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:18px 0}
.field-workflow-card{border:1px solid #d9e8dd;background:#fbfefc;border-radius:18px;padding:17px;box-shadow:0 8px 24px rgba(28,78,46,.05)}
.field-workflow-card h3{margin:5px 0 7px}.field-workflow-card p{margin:0 0 12px;color:#627168}
.field-workflow-kicker{font-size:.72rem;letter-spacing:.09em;font-weight:900;color:#168447}
.field-workflow-state{display:inline-flex;border-radius:999px;background:#eef2ef;color:#5d6a61;padding:6px 10px;font-size:.78rem;font-weight:800}
.field-workflow-state.done,.field-workflow-state.ready{background:#e5f6eb;color:#126a39}
.field-lead-score{margin-top:18px;border-radius:18px;padding:17px;background:#f4f8f5;border:1px solid #dbe8de}
.field-lead-score>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:14px}.field-lead-score strong{font-size:1.35rem;color:#153d28}
.field-score-track{height:10px;background:#dfe8e1;border-radius:999px;overflow:hidden;margin:10px 0}.field-score-track span{display:block;height:100%;width:0;border-radius:inherit;transition:width .25s ease}.score-low{background:#d47d3c}.score-medium{background:#d5a62b}.score-high{background:#168447}
.field-lead-score p{margin:0;color:#617068;font-size:.9rem}
@media(max-width:700px){.field-workflow-grid{grid-template-columns:1fr}}

/* ===== V91 MOBIEL & TABLET PRODUCTIE-AFWERKING ===== */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.field-body{overflow-x:hidden}
.field-shell,.field-card,.field-address-card,.field-map-card{box-sizing:border-box}
.field-header-actions{display:flex;align-items:center;gap:8px;min-width:0}
.field-header-actions>*{flex:0 0 auto}
.field-control-tabs{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;padding:4px 2px 8px;margin-bottom:10px}
.field-control-tabs::-webkit-scrollbar{display:none}
.field-control-tabs button{flex:0 0 auto;min-height:44px;white-space:nowrap}
.field-quick-actions button,.field-choice,.field-secondary,.field-primary-small,.field-bottom-nav a{touch-action:manipulation}
.field-map{min-height:360px}

/* Tablet landscape / compact desktop */
@media (min-width:760px) and (max-width:1100px){
  .field-shell{width:min(940px,100%);padding:18px}
  .field-header{padding:12px 18px}
  .field-personal-dashboard{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .field-welcome-card{grid-column:1/-1}
  .field-quick-actions{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr))}
  .field-day-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
  .field-map{min-height:440px}
  .field-section-head{align-items:flex-start}
  .field-list-tools{grid-template-columns:minmax(220px,2fr) repeat(2,minmax(150px,1fr))}
}

/* Tablet portrait */
@media (min-width:621px) and (max-width:820px){
  .field-shell{padding:14px}
  .field-header{gap:12px}
  .field-brand strong{font-size:15px}
  .field-personal-dashboard{display:block}
  .field-next-card{grid-template-columns:auto 1fr;gap:12px}
  .field-next-card .field-primary-small{grid-column:1/-1;width:100%}
  .field-quick-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .field-day-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .field-section-head{flex-direction:column;align-items:stretch}
  .field-head-actions,.field-route-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
  .field-route-controls select:first-child{grid-column:1/-1}
  .field-list-tools{grid-template-columns:1fr 1fr}
  .field-list-tools input{grid-column:1/-1}
  .field-map{min-height:400px}
  .field-product-groups{grid-template-columns:1fr}
}

/* Phone */
@media (max-width:620px){
  .field-body{padding-bottom:66px}
  .field-header{align-items:flex-start;gap:8px;flex-wrap:wrap}
  .field-brand{min-width:0;flex:1 1 220px}
  .field-brand img{width:42px;height:34px;flex:0 0 auto}
  .field-brand div{min-width:0}
  .field-brand strong{font-size:14px;line-height:1.15;white-space:normal}
  .field-brand span{font-size:10px}
  .field-header-actions{margin-left:auto}
  .field-online{padding:6px 8px;font-size:11px}
  .field-logout{min-height:38px;padding:8px 10px}
  .field-hero{padding:18px;border-radius:19px}
  .field-hero h1{font-size:29px}
  .field-welcome-card,.field-next-card{padding:16px;border-radius:18px}
  .field-next-card{display:grid;grid-template-columns:auto 1fr;gap:11px}
  .field-next-card .field-primary-small{grid-column:1/-1;width:100%;min-height:46px}
  .field-quick-actions{grid-template-columns:1fr 1fr;gap:9px}
  .field-quick-actions button{min-height:106px;padding:14px 10px}
  .field-day-stats{grid-template-columns:1fr 1fr;gap:9px}
  .field-day-stats article{padding:12px 8px}
  .field-control-tabs{margin-left:-2px;margin-right:-2px;padding-bottom:9px}
  .field-control-tabs button{min-height:42px;padding:10px 13px}
  .field-section-head{flex-direction:column;align-items:stretch;gap:12px}
  .field-section-head h2{font-size:23px}
  .field-head-actions{display:grid;grid-template-columns:1fr;gap:8px;width:100%}
  .field-head-actions button,.field-section-head>button{width:100%;min-height:46px}
  .field-list-tools,.field-route-controls{display:grid;grid-template-columns:1fr;gap:9px}
  .field-list-tools>* ,.field-route-controls>*{width:100%;box-sizing:border-box;min-height:46px}
  .field-address-filters{display:flex;overflow-x:auto;gap:7px;padding-bottom:6px;scrollbar-width:none}
  .field-address-filters::-webkit-scrollbar{display:none}
  .field-address-filters button{flex:0 0 auto;white-space:nowrap;min-height:40px}
  .field-map{min-height:330px;border-radius:15px}
  .field-card input,.field-card select,.field-card textarea{min-height:48px}
  .field-choice{min-height:50px;padding:13px 12px}
  .field-actions-row{display:grid;grid-template-columns:1fr}
  .field-actions-row button,.field-actions-row a{width:100%;box-sizing:border-box;min-height:46px}
  .field-bottom-nav{padding-top:4px;padding-bottom:calc(4px + env(safe-area-inset-bottom));box-shadow:0 -5px 18px rgba(11,54,36,.08)}
  .field-bottom-nav a{padding:7px 2px;font-size:10px;min-height:44px;display:grid;place-items:center}
  dialog.field-dialog{width:calc(100vw - 20px);max-width:none;max-height:calc(100vh - 20px);margin:10px;padding:18px;box-sizing:border-box;overflow:auto}
}

/* Very small phones */
@media (max-width:390px){
  .field-shell{padding:8px}
  .field-quick-actions{grid-template-columns:1fr}
  .field-day-stats{grid-template-columns:1fr 1fr}
  .field-card-title{gap:9px}
  .field-card-title>span{min-width:34px;height:34px}
  .field-card-title h2{font-size:18px}
}

/* Landscape phone: preserve usable height */
@media (max-height:520px) and (orientation:landscape){
  .field-header{position:static}
  .field-hero{padding:14px}
  .field-hero h1{font-size:25px}
  .field-map{min-height:260px}
  .field-bottom-nav{position:static}
  .field-body{padding-bottom:0}
}

/* V92 professionele rapportgenerator */
.field-report-control{margin-top:12px;padding:14px 16px;border-radius:14px;background:#fff7df;border:1px solid #ead59d;color:#604b16;display:grid;gap:3px}
.status-approved{background:#dff5e7;color:#0d6936}
.generated-report{color:#173526}.generated-report-header{display:flex;justify-content:space-between;gap:18px;border-bottom:3px solid #18884a;padding-bottom:16px;margin-bottom:18px}.report-brand{font-weight:900;color:#18884a}.generated-report-header h2{margin:4px 0 0}.report-meta{font-size:.86rem;color:#68776f}.report-intro{background:#f0f8f3;border-left:4px solid #18884a;padding:12px 15px;border-radius:0 12px 12px 0}.generated-report section{margin-top:20px}.generated-report section h3{margin:0 0 10px}.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.report-grid>div{padding:11px;border:1px solid #dbe8de;border-radius:12px;background:#fff}.report-grid dt{font-weight:800}.report-grid dd{margin:4px 0 0}.report-missing{color:#8b5c00}.report-score{margin-top:22px;padding:15px;background:#edf8f1;border-radius:14px;display:grid;grid-template-columns:1fr auto;gap:4px}.report-score strong{font-size:1.35rem}.report-score small{grid-column:1/-1;color:#64736b}.generated-report footer{margin-top:26px;padding-top:12px;border-top:1px solid #dbe5de;color:#68776f;font-size:.78rem}@media(max-width:700px){.generated-report-header{display:block}.report-meta{margin-top:7px}.report-grid{grid-template-columns:1fr}.field-report-actions button{width:100%}}

/* V93 – installateurdossier */
.field-installer-dossier{margin-top:18px;padding:18px;border:1px solid #d8e7dc;border-radius:18px;background:#fbfdfb}
.field-installer-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:14px}
.field-installer-head h3{margin:4px 0 6px;color:#153d28}.field-installer-head p{margin:0;color:#617068;max-width:720px}
.field-inline-message{min-height:22px;margin:10px 0 0;color:#53655b;font-weight:700}.field-inline-message.error{color:#9a2f2f}.field-inline-message.success{color:#167343}
.status-ready{background:#e3f6e9;color:#116637}.status-shared{background:#dff1ff;color:#145b83}
.installer-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.installer-summary-grid div{padding:10px;border:1px solid #dfe9e2;border-radius:10px;background:#fff}.installer-summary-grid strong,.installer-summary-grid span{display:block}.installer-summary-grid span{margin-top:4px;color:#526159}
@media(max-width:700px){.field-installer-head{display:block}.field-installer-head .field-status-pill{margin-top:12px}.installer-summary-grid{grid-template-columns:1fr}}

/* V96 Release Candidate */
.field-release-card{margin-top:22px;padding:18px;border:1px solid #cfe1d6;border-radius:18px;background:linear-gradient(180deg,#fbfefc,#f3faf6)}
.field-release-card h3{margin:2px 0 4px;font-size:21px;color:#173f2d}.field-release-card p{margin:0;color:#61786d}
.field-release-meta{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0}.field-release-meta span{background:#fff;border:1px solid #d8e7dd;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:850;color:#49675a}
.field-release-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.field-release-checklist label{display:flex;align-items:flex-start;gap:10px;background:#fff;border:1px solid #dae8df;border-radius:13px;padding:12px;line-height:1.35;font-weight:760;color:#314d40;cursor:pointer}
.field-release-checklist input{width:19px;height:19px;margin:0;accent-color:#0d7542;flex:0 0 auto}
.field-release-progress{display:grid;gap:7px;margin-top:15px}.field-release-progress>div{height:10px;border-radius:999px;background:#dfece4;overflow:hidden}.field-release-progress span{display:block;width:0;height:100%;background:#0d7542;transition:width .2s ease}.field-release-progress strong{font-size:13px;color:#456456}
@media(max-width:760px){.field-release-checklist{grid-template-columns:1fr}.field-release-card{padding:14px}.field-release-card .field-section-head{align-items:flex-start}.field-release-card #exportReleaseReportButton{width:100%}}


/* RC2 — release candidate 2: duidelijke rol, mobiele menupanelen en snelle adresacties */
.field-header-rc2{gap:12px}
.field-header-icon{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #cfe0d6;border-radius:13px;background:#fff;color:#0d6f3f;font-weight:900;font-size:22px;cursor:pointer;flex:0 0 auto}
.field-day-button{position:relative;font-size:16px;gap:3px;width:auto;min-width:52px;padding:0 9px}
.field-day-button b{font-size:13px;line-height:1;background:#0d7542;color:#fff;border-radius:999px;padding:4px 6px}
.field-role-badge{display:inline-flex;align-items:center;white-space:nowrap;border-radius:999px;padding:7px 10px;background:#e8f4ff;color:#195a86;font-weight:900;font-size:12px}
.field-role-badge.is-admin{background:#eaf7ef;color:#0d7542}
.field-panel-backdrop{position:fixed;inset:0;background:rgba(6,26,17,.34);z-index:59;backdrop-filter:blur(2px)}
.field-slide-panel{position:fixed;top:0;bottom:0;width:min(360px,88vw);background:#fff;z-index:60;box-shadow:0 16px 50px rgba(0,0,0,.22);padding:18px;overflow:auto;transition:transform .22s ease;visibility:hidden}
.field-slide-left{left:0;transform:translateX(-105%)}
.field-slide-right{right:0;transform:translateX(105%)}
.field-slide-panel.open{transform:translateX(0);visibility:visible}
.field-slide-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:14px;border-bottom:1px solid #dbe7df}
.field-slide-head small{display:block;color:#0d7542;font-weight:900;letter-spacing:.12em}.field-slide-head strong{font-size:24px}.field-slide-head button{width:40px;height:40px;border:0;border-radius:12px;background:#eef5f0;font-size:26px;cursor:pointer}
.field-panel-user{display:grid;gap:3px;padding:16px 0}.field-panel-user strong{font-size:18px}.field-panel-user span{color:#607268;font-size:13px}
.field-panel-nav{display:grid;gap:8px}.field-panel-nav button{border:1px solid #d6e5dc;background:#fff;border-radius:14px;padding:13px 14px;text-align:left;font:inherit;font-weight:800;color:#173526;cursor:pointer}.field-panel-nav button:hover{background:#eef8f1;border-color:#9fcab0}
.field-today-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.field-today-grid article{display:grid;gap:4px;padding:16px;border-radius:16px;background:#f1f7f3;border:1px solid #dbe7df}.field-today-grid strong{font-size:28px;color:#0d7542}.field-today-grid span{font-size:12px;color:#566b60}
.field-panel-note{color:#607268;font-size:13px;margin-top:16px}
.field-address-quick-actions{margin-top:12px;padding:13px;border-radius:15px;background:#eff8f2;border:1px solid #cce3d4}.field-address-quick-actions>strong{display:block;margin-bottom:9px;color:#145f38}.field-address-quick-actions>div{display:flex;gap:7px;flex-wrap:wrap}.field-address-quick-actions button{border:1px solid #bfddca;background:#fff;color:#174d32;border-radius:11px;padding:9px 11px;font-weight:800;cursor:pointer}
@media(max-width:900px){.field-header-rc2 .field-brand span{display:none}.field-header-rc2 .field-user-name{display:none}.field-role-badge{max-width:170px;overflow:hidden;text-overflow:ellipsis}.field-logout{display:none}}
@media(max-width:620px){.field-header-rc2{position:sticky;top:0;align-items:center;flex-wrap:nowrap;padding:8px 9px}.field-header-rc2 .field-brand{flex:1;min-width:0;justify-content:center}.field-header-rc2 .field-brand img{width:34px;height:34px}.field-header-rc2 .field-brand strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.field-header-rc2 .field-user-controls{flex:0 0 auto;gap:5px}.field-header-rc2 .field-online,.field-header-rc2 .field-role-badge{display:none}.field-header-icon{width:42px;height:42px}.field-day-button{min-width:48px}.field-address-quick-actions>div{display:grid;grid-template-columns:1fr 1fr}.field-address-quick-actions button{min-height:44px}}

/* RC3 — echt medewerkersbeheer */
.rc3-team-summary{grid-template-columns:repeat(4,minmax(0,1fr))}
.rc3-employee-tools{display:grid;grid-template-columns:minmax(220px,1fr) 180px 180px;gap:10px;margin:14px 0 18px}
.rc3-employee-tools input,.rc3-employee-tools select{width:100%;min-height:44px;border:1px solid #cfe0d5;border-radius:12px;padding:10px 12px;background:#fff;color:#17372a}
.rc3-employee-card{border-left:4px solid #52bd39}
.rc3-employee-card.is-blocked{border-left-color:#c9d3cd;opacity:.82}
.rc3-employee-card .employee-name-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rc3-role-label{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;border-radius:999px;padding:5px 8px;background:#eaf7ee;color:#0a7040}
.rc3-role-label.admin{background:#eef3ff;color:#284f9e}
.rc3-employee-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 16px;margin-top:10px;color:#587065;font-size:13px}
.rc3-employee-details span strong{color:#203f32}
.rc3-activity-section{margin-top:24px;border-top:1px solid #dce9df;padding-top:20px}
.rc3-activity-log{display:grid;gap:8px}
.rc3-activity-item{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:11px 12px;background:#f7faf8;border:1px solid #e0ece3;border-radius:12px}
.rc3-activity-item .dot{width:9px;height:9px;border-radius:50%;background:#55bf3b}
.rc3-activity-item small{color:#6b7f75}
.rc3-account-help{background:#edf8f0;border:1px solid #cfe6d7;border-radius:13px;padding:12px 14px;margin:12px 0;color:#315b47;font-size:13px}
.rc3-invite-pending{background:#fff8e8;color:#8a6414}
@media(max-width:800px){.rc3-team-summary{grid-template-columns:1fr 1fr}.rc3-employee-tools{grid-template-columns:1fr}.rc3-employee-details{grid-template-columns:1fr}.rc3-activity-item{grid-template-columns:auto 1fr}.rc3-activity-item small{grid-column:2}}
@media(max-width:480px){.rc3-team-summary{grid-template-columns:1fr 1fr}.rc3-employee-dialog .field-grid{grid-template-columns:1fr}}

/* RC4.2 */
.field-area-progress-copy{min-width:0;flex:1}.field-area-done{display:inline-block;margin-left:.45rem;padding:.18rem .45rem;border-radius:999px;background:#e7f7ed;font-size:.72rem}.field-progress-track{height:9px;border-radius:999px;background:#e8ecea;overflow:hidden;margin:.5rem 0 .35rem}.field-progress-track>span{display:block;height:100%;background:currentColor;border-radius:999px}.field-lead-track-item{align-items:flex-start}.field-lead-track-edit{display:grid;grid-template-columns:minmax(150px,1fr) minmax(180px,1.4fr) minmax(120px,.7fr) auto;gap:.5rem;width:100%;margin-top:.65rem}.field-lead-track-edit select,.field-lead-track-edit input{min-height:42px}@media(max-width:820px){.field-lead-track-edit{grid-template-columns:1fr}.field-area-done{display:block;width:max-content;margin:.3rem 0 0}}


/* ===== RC4.3/RC4.4 LEADOPVOLGING WEERGAVEFIX ===== */
.field-lead-track-item{
  grid-template-columns:36px minmax(0,1fr);
  align-items:start;
}
.field-lead-track-item > .field-address-status{
  grid-column:1;
  grid-row:1 / span 2;
}
.field-lead-track-item > .field-address-main{
  grid-column:2;
  min-width:0;
}
.field-lead-track-edit{
  grid-column:2;
  display:grid;
  grid-template-columns:minmax(150px,1fr) minmax(180px,1.4fr) minmax(120px,.7fr) auto;
  gap:.5rem;
  width:100%;
  min-width:0;
  margin-top:.65rem;
}
.field-lead-track-edit select,
.field-lead-track-edit input,
.field-lead-track-edit button{
  width:100%;
  min-width:0;
}
@media(max-width:820px){
  .field-lead-track-item{
    grid-template-columns:32px minmax(0,1fr);
  }
  .field-lead-track-edit{
    grid-column:1 / -1;
    grid-template-columns:1fr;
    margin-top:.4rem;
  }
}


/* ===== V85.1 DW FLOW — AI MASTER STYLE ===== */\n:root{--dw-yellow:#ffd84d;--dw-yellow-2:#ffca28;--dw-navy:#071d2e;--dw-blue:#1769ff}\n.brand-image,.brand-mark{border-radius:14px}\n.eyebrow{color:#d29a00!important}\n.btn:not(.secondary):not(.danger),a.btn:not(.secondary):not(.secondary-light){background:linear-gradient(135deg,var(--dw-yellow),var(--dw-yellow-2))!important;color:#10243b!important;border-color:#e8b900!important;box-shadow:0 10px 25px rgba(255,202,40,.22)}\n.btn:not(.secondary):not(.danger):hover,a.btn:not(.secondary):not(.secondary-light):hover{transform:translateY(-1px);filter:brightness(1.02)}\n.saas-top{border-bottom:1px solid rgba(7,29,46,.09)}\n.demo-hero h1 em{color:var(--dw-blue)!important}\n.demo-hero-note,.demo-sidebar,.demo-ai-banner,.demo-ai-intro{background:linear-gradient(155deg,#061b2b,#0b3152)!important}\n.demo-sidebar nav button.active,.demo-sidebar nav button:hover{background:linear-gradient(135deg,#1769ff,#0e55d7)!important}\n.demo-live{background:#fff5c7!important;color:#6f5200!important;border:1px solid #f2d56c}\n.demo-app-shell{position:relative;box-shadow:0 30px 80px rgba(7,29,46,.19),0 0 0 1px rgba(23,105,255,.05)!important}\n.demo-workspace-head small,.demo-product-cards small,.demo-timeline time,.demo-agenda-row>b{color:#b98300!important}\n.demo-product-row u{background:linear-gradient(90deg,#1769ff,#ffd84d)!important}\n.demo-ai-grid article>span{background:#fff4bd!important;color:#725600!important}\n.demo-switch input:checked+i{background:#1769ff!important}\n.demo-conversion{background:linear-gradient(135deg,#071d2e,#0b3152 65%,#123f68)!important;position:relative;overflow:hidden}\n.demo-conversion:after{content:'';position:absolute;right:-80px;top:-100px;width:300px;height:300px;border-radius:50%;background:rgba(255,216,77,.14)}\n.dw-demo-cursor{position:absolute;z-index:30;width:20px;height:20px;border-radius:50%;background:#ffd84d;border:3px solid #fff;box-shadow:0 5px 18px rgba(7,29,46,.35);left:18%;top:18%;transition:left .72s cubic-bezier(.2,.8,.2,1),top .72s cubic-bezier(.2,.8,.2,1);pointer-events:none}\n.dw-demo-cursor:after{content:'';position:absolute;inset:-8px;border:2px solid rgba(255,216,77,.38);border-radius:50%;animation:dwPulse 1.4s infinite}\n@keyframes dwPulse{0%{transform:scale(.7);opacity:.9}100%{transform:scale(1.5);opacity:0}}\n@media(max-width:760px){.dw-demo-cursor{display:none}}\n

/* ===== V85.2 DW FLOW — PREMIUM DEMO / RESPONSIVE FIX ===== */
:root{--dw-yellow:#ffd84d;--dw-yellow-2:#ffc928;--dw-navy:#061b2b;--dw-navy-2:#0b3152;--dw-blue:#1769ff;--dw-soft:#f4f7fb}
.brand-mark.brand-image,.brand-logo-public .brand-image,.brand-logo-footer .brand-image,.loginvisual .brand-logo .brand-image{border-radius:15px!important;overflow:hidden!important;clip-path:inset(0 round 15px);background:#fff!important}
.demo-center-page{overflow-x:hidden;background:linear-gradient(180deg,#f8fbff 0,#f3f7fb 46%,#fff 100%)}
.demo-center-page .saas-top{max-width:100%;padding-left:clamp(20px,5vw,64px);padding-right:clamp(20px,5vw,64px);background:rgba(255,255,255,.94);backdrop-filter:blur(14px)}
.demo-center-page .brand-logo-public .brand-image{width:58px!important;height:58px!important;flex-basis:58px!important;border-radius:16px!important;clip-path:inset(0 round 16px)}
.demo-center-page .brand-copy strong{font-size:14px!important;letter-spacing:.08em}.demo-center-page .brand-copy small{color:#1769ff!important;font-weight:900;letter-spacing:.18em}
.demo-hero{max-width:1240px;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:42px;padding-top:68px;padding-bottom:58px}
.demo-hero>div{min-width:0}.demo-hero h1{max-width:820px;font-size:clamp(42px,5.3vw,72px)}
.demo-hero-note{min-width:0;border:1px solid rgba(255,255,255,.08);box-shadow:0 24px 55px rgba(6,27,43,.16)}
.demo-stage{max-width:1320px;padding:0 clamp(18px,3vw,38px)}
.demo-app-shell{width:100%;grid-template-columns:230px minmax(0,1fr);min-height:680px;border-radius:28px!important;border:1px solid #dce6f1;background:#fff;overflow:hidden!important;box-sizing:border-box}
.demo-sidebar{min-width:0}.demo-workspace{min-width:0!important;overflow:hidden;padding:clamp(20px,2.4vw,32px)}
#demoContent{min-width:0;width:100%}.demo-panel,.demo-metrics article,.demo-product-cards article{min-width:0;box-sizing:border-box}
.demo-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.demo-two-col{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
.demo-report-row{grid-template-columns:42px minmax(0,1fr) auto auto}.demo-report-row b,.demo-report-row small{overflow-wrap:anywhere}
.demo-table-head,.demo-table-row{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(120px,.8fr)}
.demo-workspace-head .btn{flex:0 0 auto}.demo-live{box-shadow:0 6px 18px rgba(255,201,40,.18)}
.demo-branch-grid button.active{border-color:#f0c22b!important;box-shadow:0 12px 32px rgba(255,201,40,.16)!important;background:linear-gradient(180deg,#fffdf4,#fff)!important}
.demo-sidebar nav button.active{box-shadow:inset 3px 0 0 #ffd84d,0 8px 20px rgba(0,0,0,.08)}
.demo-user>span{background:#fff4bd!important;color:#6d5200!important}
@media(max-width:1100px){.demo-hero{grid-template-columns:1fr}.demo-hero-note{max-width:720px}.demo-app-shell{grid-template-columns:190px minmax(0,1fr)}.demo-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-two-col{grid-template-columns:1fr}.demo-product-cards,.demo-ai-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){.demo-app-shell{grid-template-columns:1fr}.demo-sidebar{display:block;padding:16px}.demo-sidebar .demo-logo{padding-bottom:14px}.demo-sidebar nav{display:flex;overflow-x:auto;gap:7px;margin-top:14px}.demo-sidebar nav button{white-space:nowrap}.demo-user{display:none}.demo-workspace-head{flex-direction:column;align-items:stretch}.demo-workspace-head .btn{width:100%}.demo-product-cards,.demo-ai-grid{grid-template-columns:1fr}.demo-report-row{grid-template-columns:36px minmax(0,1fr)}.demo-report-row em,.demo-report-row button{grid-column:2}.demo-report-row button{justify-self:start}.demo-stage-top{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.demo-hero{padding:46px 18px}.demo-hero h1{font-size:42px}.demo-branch-grid{grid-template-columns:1fr}.demo-metrics{grid-template-columns:1fr}.demo-workspace{padding:16px}.demo-stage{padding:0 12px}.demo-app-shell{border-radius:20px!important}.demo-center-page .brand-copy{display:flex!important}.demo-center-page .saas-top nav{display:none}}

/* ===== DW FLOW V85.3 — PREMIUM AI HERO + DEMO RESPONSIVE FIX ===== */
.demo-center-page{background:linear-gradient(180deg,#f8fbff 0,#eef5fb 48%,#fff 100%)}
.demo-center-page .site-header{background:rgba(255,255,255,.90);backdrop-filter:blur(18px);box-shadow:0 1px 0 rgba(10,42,70,.08);position:sticky;top:0;z-index:50}
.demo-center-page .site-header .btn,.demo-center-page .site-header a.btn{background:#ffd33d!important;color:#10243b!important;box-shadow:0 12px 30px rgba(255,211,61,.22)!important}
.demo-hero{position:relative;isolation:isolate;max-width:none!important;min-height:650px;margin:0!important;padding:88px max(5vw,calc((100vw - 1540px)/2)) 82px!important;grid-template-columns:minmax(0,1.12fr) minmax(380px,.72fr)!important;overflow:hidden;background:radial-gradient(circle at 82% 20%,rgba(23,105,255,.18),transparent 25%),radial-gradient(circle at 70% 70%,rgba(255,211,61,.14),transparent 22%),linear-gradient(135deg,#f9fcff 0%,#edf5ff 55%,#f9fbfd 100%)}
.demo-hero:before,.demo-hero:after{content:"";position:absolute;border-radius:50%;filter:blur(2px);z-index:-1;animation:dwFloat 8s ease-in-out infinite alternate}.demo-hero:before{width:340px;height:340px;right:4%;top:8%;background:linear-gradient(135deg,rgba(23,105,255,.16),rgba(42,196,255,.05))}.demo-hero:after{width:180px;height:180px;right:31%;bottom:4%;background:rgba(255,211,61,.15);animation-delay:-3s}
@keyframes dwFloat{to{transform:translate3d(18px,-20px,0) scale(1.06)}}
.demo-hero .eyebrow{display:inline-flex;align-items:center;gap:9px;padding:9px 13px;border-radius:999px;background:#fff;border:1px solid #dbe8f4;box-shadow:0 8px 24px rgba(14,43,74,.07)}
.demo-hero .eyebrow:before{content:"";width:9px;height:9px;border-radius:50%;background:#ffd33d;box-shadow:0 0 0 6px rgba(255,211,61,.18)}
.demo-hero h1{font-size:clamp(58px,5.8vw,94px)!important;max-width:930px;line-height:.98!important}.demo-hero h1 em{background:linear-gradient(100deg,#1769ff,#08a7e8);-webkit-background-clip:text;background-clip:text;color:transparent!important}.demo-hero p{font-size:clamp(19px,1.35vw,23px)!important;max-width:820px!important}
.demo-hero-note{position:relative!important;padding:34px!important;border-radius:28px!important;background:linear-gradient(155deg,#082945,#0b365c)!important;box-shadow:0 30px 70px rgba(7,42,72,.23);border:1px solid rgba(255,255,255,.1);overflow:hidden}.demo-hero-note:before{content:"LIVE DEMO";position:absolute;right:22px;top:20px;padding:7px 10px;border-radius:999px;background:#ffd33d;color:#10243b;font-size:10px;font-weight:1000;letter-spacing:.12em}.demo-hero-note b{font-size:27px!important;padding-right:90px}.demo-hero-note span{position:relative;padding:15px 16px 15px 46px!important;background:rgba(255,255,255,.075)!important;border:1px solid rgba(255,255,255,.06);transition:.3s}.demo-hero-note span:before{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:21px;height:21px;border-radius:50%;display:grid;place-items:center;background:#1769ff;color:#fff;font-size:11px;font-weight:900}.demo-hero-note span:nth-of-type(1):before{content:"1"}.demo-hero-note span:nth-of-type(2):before{content:"2"}.demo-hero-note span:nth-of-type(3):before{content:"3"}.demo-hero-note span:nth-of-type(4):before{content:"4"}.demo-hero-note span:nth-of-type(2){border-color:rgba(255,211,61,.5);box-shadow:inset 3px 0 #ffd33d}
.demo-stage{max-width:1540px!important;padding:0 32px!important;margin:70px auto!important}.demo-app-shell{grid-template-columns:250px minmax(0,1fr)!important;width:100%!important;max-width:100%!important;min-height:720px!important}.demo-workspace{min-width:0!important;overflow:hidden!important;padding:30px!important}.demo-view{min-width:0!important;max-width:100%!important}.demo-product-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}.demo-product-cards article{min-width:0!important;overflow:hidden}.demo-product-cards h4,.demo-product-cards p{overflow-wrap:anywhere}.demo-report-row{grid-template-columns:42px minmax(0,1fr) auto auto!important}.demo-table{max-width:100%;overflow:auto}.demo-two-col{grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr)!important}.demo-metrics{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media(max-width:1100px){.demo-hero{grid-template-columns:1fr!important;min-height:auto!important;padding:70px 34px!important}.demo-hero-note{max-width:760px}.demo-app-shell{grid-template-columns:210px minmax(0,1fr)!important}.demo-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}.demo-two-col{grid-template-columns:1fr!important}}
@media(max-width:760px){.demo-hero{padding:54px 18px!important}.demo-hero h1{font-size:clamp(48px,14vw,66px)!important}.demo-stage{padding:0 14px!important}.demo-app-shell{display:block!important}.demo-sidebar{display:block!important}.demo-workspace{padding:18px!important}.demo-product-cards,.demo-ai-grid{grid-template-columns:1fr!important}.demo-report-row{grid-template-columns:36px minmax(0,1fr) auto!important}.demo-report-row button{grid-column:2/-1;justify-self:start}.demo-hero-note{padding:25px!important}}

/* =========================================================
   DW FLOW V85.4 — PREMIUM HERO + ROBUUSTE INTERACTIEVE DEMO
   27-09-2026 — visuele laag; geen backend/logica gewijzigd
   ========================================================= */
.demo-center-page{overflow-x:hidden;background:#f3f7fb}
.demo-center-page .saas-top{max-width:none;padding-left:max(34px,calc((100vw - 1540px)/2));padding-right:max(34px,calc((100vw - 1540px)/2));box-shadow:0 8px 30px rgba(7,27,44,.06)}
.demo-center-page .brand-logo-public .brand-image{border-radius:18px!important;clip-path:inset(0 round 18px);box-shadow:0 8px 24px rgba(8,35,63,.15)}
.demo-center-page .brand-copy small{color:#1769ff;letter-spacing:.17em}
.demo-center-page .top-actions .btn{background:#ffd43b!important;color:#10243b!important;border-color:#ffd43b!important;box-shadow:0 12px 30px rgba(255,212,59,.28)}

.demo-center-page .demo-hero{position:relative;isolation:isolate;max-width:none;min-height:610px;margin:0;padding:105px max(6vw,calc((100vw - 1540px)/2)) 92px;grid-template-columns:minmax(0,1.1fr) minmax(390px,.72fr);gap:76px;color:#fff;background:linear-gradient(122deg,#071b2d 0%,#0a2d4a 50%,#0c4473 100%);overflow:hidden}
.demo-center-page .demo-hero:before,.demo-center-page .demo-hero:after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(2px);pointer-events:none;animation:dwFlowFloat 8s ease-in-out infinite alternate}
.demo-center-page .demo-hero:before{width:520px;height:520px;right:24%;top:-260px;background:radial-gradient(circle,rgba(23,105,255,.5),rgba(23,105,255,0) 70%)}
.demo-center-page .demo-hero:after{width:390px;height:390px;left:-120px;bottom:-230px;background:radial-gradient(circle,rgba(255,212,59,.22),rgba(255,212,59,0) 70%);animation-delay:-3s}
@keyframes dwFlowFloat{to{transform:translate3d(35px,24px,0) scale(1.08)}}
.demo-center-page .demo-hero>div:first-child{position:relative;z-index:2}
.demo-center-page .demo-hero .eyebrow{display:inline-flex;align-items:center;gap:9px;color:#ffd43b;font-size:13px;letter-spacing:.2em}
.demo-center-page .demo-hero .eyebrow:before{content:"";width:34px;height:3px;border-radius:99px;background:#ffd43b;box-shadow:0 0 18px rgba(255,212,59,.55)}
.demo-center-page .demo-hero h1{max-width:860px;margin:18px 0 24px;font-size:clamp(56px,6vw,96px);line-height:.96;color:#fff;letter-spacing:-.055em}
.demo-center-page .demo-hero h1 em{color:#58a7ff;text-shadow:0 0 40px rgba(65,151,255,.22)}
.demo-center-page .demo-hero p{max-width:790px;margin:0;color:#c8d8e7;font-size:clamp(18px,1.5vw,22px);line-height:1.7}
.demo-center-page .demo-hero-note{position:relative;z-index:2;padding:30px;border:1px solid rgba(255,255,255,.15);border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.055));backdrop-filter:blur(18px);box-shadow:0 30px 70px rgba(0,0,0,.2)}
.demo-center-page .demo-hero-note:before{content:"LIVE PRODUCTDEMO";display:inline-block;margin-bottom:9px;padding:7px 10px;border-radius:999px;background:#ffd43b;color:#10243b;font-size:10px;font-weight:950;letter-spacing:.14em}
.demo-center-page .demo-hero-note b{font-size:25px}
.demo-center-page .demo-hero-note span{position:relative;padding:14px 15px 14px 46px;border:1px solid rgba(255,255,255,.08);background:rgba(7,27,45,.38);color:#e0ebf5;transition:.25s}
.demo-center-page .demo-hero-note span:before{content:"✓";position:absolute;left:15px;top:50%;translate:0 -50%;display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:#1769ff;color:#fff;font-size:12px;font-weight:900}
.demo-center-page .demo-hero-note span:nth-of-type(3):before{background:#ffd43b;color:#10243b}

.demo-center-page .demo-branch-picker{padding-top:90px;padding-bottom:90px;background:linear-gradient(180deg,#fff,#f7faff)}
.demo-center-page .demo-branch-grid{grid-template-columns:repeat(4,minmax(0,1fr));max-width:1192px;margin:auto}
.demo-center-page .demo-branch-grid button{min-width:0;border-radius:20px;padding:24px;box-shadow:0 12px 35px rgba(14,43,74,.055)}
.demo-center-page .demo-branch-grid button.active{border-color:#1769ff;box-shadow:0 18px 42px rgba(23,105,255,.16)}

.demo-center-page .demo-stage{max-width:1540px;margin:90px auto;padding:0 34px}
.demo-center-page .demo-stage-top{padding:0 6px}
.demo-center-page .demo-live{background:#fff2ad;color:#735800;border:1px solid #f1d55c}
.demo-center-page .demo-app-shell{position:relative;grid-template-columns:240px minmax(0,1fr)!important;width:100%;min-width:0;min-height:760px;border:1px solid #cfdce8;border-radius:28px;box-shadow:0 35px 90px rgba(7,36,65,.18)}
.demo-center-page .demo-sidebar{min-width:0;background:linear-gradient(180deg,#071d31,#0b3557)}
.demo-center-page .demo-sidebar nav button.active{background:linear-gradient(90deg,#1769ff,#247dfc);box-shadow:0 8px 20px rgba(23,105,255,.25)}
.demo-center-page .demo-workspace{width:auto!important;min-width:0!important;max-width:none!important;padding:34px;background:linear-gradient(180deg,#f7faff,#f2f6fa)}
.demo-center-page #demoContent{width:100%!important;min-width:0!important;max-width:none!important;display:block!important}
.demo-center-page .demo-metrics{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.demo-center-page .demo-two-col{grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr)!important}
.demo-center-page .demo-product-cards{width:100%!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:18px!important}
.demo-center-page .demo-product-cards article{min-width:0!important;overflow:hidden;padding:24px 22px 68px;border-radius:18px;box-shadow:0 10px 28px rgba(14,43,74,.05)}
.demo-center-page .demo-product-cards h4,.demo-center-page .demo-product-cards p,.demo-center-page .demo-product-cards b{overflow-wrap:anywhere}
.demo-center-page .demo-product-cards button{left:22px;right:auto;bottom:20px}
.demo-center-page .demo-report-row{grid-template-columns:42px minmax(0,1fr) auto auto!important;width:100%;gap:18px;padding:18px 4px}
.demo-center-page .demo-panel{min-width:0;border-radius:18px;box-shadow:0 10px 28px rgba(14,43,74,.045)}
.demo-center-page .demo-ai-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.demo-center-page .demo-table-head,.demo-center-page .demo-table-row{grid-template-columns:minmax(180px,1.2fr) minmax(160px,1fr) minmax(120px,.8fr)}
.demo-center-page .demo-workspace-head .btn{background:#ffd43b!important;color:#10243b!important;border-color:#ffd43b!important;box-shadow:0 10px 24px rgba(255,212,59,.24)}
.demo-center-page .demo-company-brand>span{background:#0b2a45;color:#fff;box-shadow:inset 0 0 0 3px #ffd43b}

@media(max-width:1180px){
 .demo-center-page .demo-hero{grid-template-columns:1fr;min-height:auto;padding-top:82px}.demo-center-page .demo-hero-note{max-width:760px}
 .demo-center-page .demo-product-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .demo-center-page .demo-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .demo-center-page .demo-two-col{grid-template-columns:1fr!important}
}
@media(max-width:820px){
 .demo-center-page .demo-app-shell{grid-template-columns:1fr!important}.demo-center-page .demo-sidebar{padding:16px}.demo-center-page .demo-sidebar nav{grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.demo-center-page .demo-user{display:none}
 .demo-center-page .demo-workspace{padding:22px}.demo-center-page .demo-branch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-center-page .demo-report-row{grid-template-columns:36px minmax(0,1fr) auto!important}.demo-center-page .demo-report-row button{grid-column:2/-1;justify-self:start}
}
@media(max-width:560px){
 .demo-center-page .demo-hero{padding:65px 20px}.demo-center-page .demo-hero h1{font-size:48px}.demo-center-page .demo-branch-grid{grid-template-columns:1fr}.demo-center-page .demo-stage{padding:0 14px}.demo-center-page .demo-stage-top{align-items:flex-start;flex-direction:column}.demo-center-page .demo-sidebar nav{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-center-page .demo-product-cards,.demo-center-page .demo-metrics,.demo-center-page .demo-ai-grid{grid-template-columns:1fr!important}.demo-center-page .demo-workspace-head{align-items:flex-start;flex-direction:column}.demo-center-page .demo-table-head{display:none}.demo-center-page .demo-table-row{grid-template-columns:1fr!important;gap:7px}.demo-center-page .demo-report-row{grid-template-columns:32px minmax(0,1fr)!important}.demo-center-page .demo-report-row em,.demo-center-page .demo-report-row button{grid-column:2}
}

/* =========================================================
   DW FLOW V85.5 — LIVING AI HERO
   Premium hero inspired by the approved DW AI visual language.
   ========================================================= */
.demo-center-page .demo-hero{min-height:720px!important;padding-top:92px!important;padding-bottom:92px!important;background:linear-gradient(122deg,#061827 0%,#082c4b 52%,#0b4776 100%)!important}
.demo-center-page .demo-hero-copy{display:flex;flex-direction:column;justify-content:center;min-width:0}
.demo-center-page .demo-hero h1{font-size:clamp(58px,6vw,98px)!important;line-height:.94!important;margin:20px 0 24px!important}
.demo-center-page .demo-hero h1 em{font-style:normal!important;color:#61b4ff!important;background:none!important;-webkit-text-fill-color:initial!important}
.demo-center-page .demo-hero p{color:#c9d9e8!important}
.demo-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.demo-hero-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 20px;border-radius:14px;font-weight:900;text-decoration:none}.demo-hero-actions .hero-primary{background:#ffd43b;color:#10243b;box-shadow:0 15px 36px rgba(255,212,59,.18)}.demo-hero-actions .hero-secondary{border:1px solid rgba(255,255,255,.25);color:#fff;background:rgba(255,255,255,.07)}
.demo-live-window{position:relative;z-index:2;align-self:center;min-width:0;border:1px solid rgba(255,255,255,.16);border-radius:30px;background:rgba(5,24,40,.74);box-shadow:0 35px 90px rgba(0,0,0,.3);overflow:hidden;backdrop-filter:blur(18px);animation:dwWindowFloat 5.5s ease-in-out infinite alternate}
@keyframes dwWindowFloat{to{transform:translateY(-10px)}}
.demo-live-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;border-bottom:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.055)}.demo-live-dots{display:flex;gap:6px}.demo-live-dots i{width:9px;height:9px;border-radius:50%;background:#5d7891}.demo-live-dots i:nth-child(2){background:#ffd43b}.demo-live-dots i:nth-child(3){background:#2f87ff}.demo-live-top b{color:#fff;font-size:13px}.demo-live-badge{padding:6px 9px;border-radius:999px;background:rgba(42,212,145,.13);color:#75edb8;font-size:10px;font-weight:950;letter-spacing:.1em}
.demo-live-body{display:grid;grid-template-columns:82px minmax(0,1fr);min-height:385px}.demo-mini-side{padding:18px 12px;background:#071e33;border-right:1px solid rgba(255,255,255,.08)}.demo-mini-brand{display:grid;place-items:center;width:43px;height:43px;margin:0 auto 20px;border-radius:12px;background:#1769ff;color:#fff;font-weight:1000;box-shadow:0 10px 24px rgba(23,105,255,.25)}.demo-mini-nav{display:grid;gap:11px}.demo-mini-nav i{display:block;height:9px;border-radius:99px;background:rgba(255,255,255,.13)}.demo-mini-nav i.active{background:#ffd43b;box-shadow:0 0 18px rgba(255,212,59,.25)}
.demo-mini-main{position:relative;padding:20px;overflow:hidden}.demo-mini-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.demo-mini-heading div b{display:block;color:#fff;font-size:19px}.demo-mini-heading div span{color:#8faac0;font-size:11px}.demo-mini-plus{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#1769ff;color:#fff;font-weight:1000}.demo-mini-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.demo-mini-metric{padding:13px 12px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.055)}.demo-mini-metric small{display:block;color:#8faac0;font-size:9px}.demo-mini-metric strong{display:block;margin-top:4px;color:#fff;font-size:18px}.demo-mini-feed{display:grid;gap:9px;margin-top:14px}.demo-mini-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:9px;align-items:center;padding:10px;border-radius:12px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.065);opacity:.55;transform:translateX(0);transition:.4s}.demo-mini-row.active{opacity:1;border-color:rgba(255,212,59,.45);box-shadow:inset 3px 0 #ffd43b;background:rgba(255,212,59,.07)}.demo-mini-avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#174f83;color:#fff;font-size:11px;font-weight:900}.demo-mini-row b{display:block;color:#fff;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-mini-row small{display:block;color:#8faac0;font-size:9px}.demo-mini-status{padding:5px 7px;border-radius:999px;background:rgba(23,105,255,.17);color:#7fb9ff;font-size:8px;font-weight:900;white-space:nowrap}.demo-mini-row.active .demo-mini-status{background:#ffd43b;color:#10243b}.demo-live-toast{position:absolute;right:18px;bottom:17px;display:flex;align-items:center;gap:9px;max-width:235px;padding:11px 13px;border-radius:12px;background:#fff;color:#10243b;box-shadow:0 18px 50px rgba(0,0,0,.28);font-size:10px;font-weight:800;opacity:0;transform:translateY(12px);transition:.35s}.demo-live-toast.show{opacity:1;transform:none}.demo-live-toast i{display:grid;place-items:center;flex:0 0 24px;height:24px;border-radius:50%;background:#ffd43b;font-style:normal}.demo-mini-pulse{position:absolute;width:14px;height:14px;border-radius:50%;background:#ffd43b;box-shadow:0 0 0 0 rgba(255,212,59,.5);animation:dwPulse 1.8s infinite;right:24px;top:74px}@keyframes dwPulse{70%{box-shadow:0 0 0 15px rgba(255,212,59,0)}100%{box-shadow:0 0 0 0 rgba(255,212,59,0)}}
.demo-center-page .demo-branch-picker{background:linear-gradient(180deg,#f4f8fc,#fff)!important}
@media(max-width:1100px){.demo-center-page .demo-hero{grid-template-columns:1fr!important}.demo-live-window{width:min(760px,100%)}}
@media(max-width:640px){.demo-live-body{grid-template-columns:60px minmax(0,1fr)}.demo-mini-side{padding:14px 8px}.demo-mini-main{padding:14px}.demo-mini-metrics{grid-template-columns:1fr}.demo-mini-metric:nth-child(n+2){display:none}.demo-hero-actions a{width:100%}}

/* ===== V85.6 HERO BADGE FINAL ===== */
.demo-center-page .demo-hero .eyebrow{
  background:#ffd43b !important;
  color:#071d2e !important;
  border:1px solid #ffd43b !important;
  box-shadow:0 12px 32px rgba(255,212,59,.20) !important;
  padding:10px 16px !important;
  font-weight:900 !important;
}
.demo-center-page .demo-hero .eyebrow:before{
  background:#071d2e !important;
  box-shadow:none !important;
}

/* ===== V85.7 HERO COMPACT — approved visual, content moved up ===== */
@media (min-width:1101px){
  .demo-center-page .demo-hero{
    min-height:600px!important;
    padding-top:44px!important;
    padding-bottom:48px!important;
    align-items:center!important;
    gap:64px!important;
  }
  .demo-center-page .demo-hero-copy{justify-content:flex-start!important;padding-top:4px!important}
  .demo-center-page .demo-hero h1{margin:16px 0 20px!important;font-size:clamp(54px,5.45vw,88px)!important}
  .demo-center-page .demo-hero p{line-height:1.55!important}
  .demo-hero-actions{margin-top:22px!important}
  .demo-live-window{align-self:center!important;transform:translateY(-2px)}
  @keyframes dwWindowFloat{to{transform:translateY(-9px)}}
}

/* =========================================================
   DW FLOW V85.8 — PREMIUM WORKSPACE FIX
   Hard layout guard: prevents reports/products from collapsing.
   ========================================================= */
.demo-center-page .demo-app-shell{
  display:flex!important;
  flex-direction:row!important;
  align-items:stretch!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}
.demo-center-page .demo-sidebar{
  flex:0 0 240px!important;
  width:240px!important;
  min-width:240px!important;
  box-sizing:border-box!important;
}
.demo-center-page .demo-workspace{
  flex:1 1 auto!important;
  width:calc(100% - 240px)!important;
  min-width:0!important;
  max-width:none!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}
.demo-center-page #demoContent,
.demo-center-page #demoContent>.demo-panel,
.demo-center-page #demoContent>.demo-tip{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
.demo-center-page .demo-panel{
  padding:26px!important;
  border:1px solid #dce6f0!important;
  background:linear-gradient(180deg,#fff,#fbfdff)!important;
  box-shadow:0 16px 42px rgba(7,36,65,.07)!important;
}
.demo-center-page .demo-panel-head{
  padding-bottom:18px!important;
  border-bottom:1px solid #e9eff5!important;
}
.demo-center-page .demo-panel-head h4{font-size:22px!important;color:#10243b!important}
.demo-center-page .demo-report-row{
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr) auto auto!important;
  align-items:center!important;
  gap:18px!important;
  padding:18px 10px!important;
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
.demo-center-page .demo-report-row>span{
  width:44px;height:44px;display:grid;place-items:center;border-radius:13px;
  background:#eef5ff;font-size:22px!important
}
.demo-center-page .demo-report-row b{font-size:16px;color:#10243b}
.demo-center-page .demo-report-row em{white-space:nowrap;background:#fff3b5!important;color:#6f5200!important}
.demo-center-page .demo-report-row button{white-space:nowrap;padding:9px 14px!important;border-radius:10px!important}
.demo-center-page .demo-tip{
  margin-top:20px!important;padding:20px 22px!important;border:1px solid #d6e4f4!important;
  background:linear-gradient(100deg,#eef6ff,#fff9dc)!important
}
.demo-center-page .demo-product-cards article,
.demo-center-page .demo-ai-grid article,
.demo-center-page .demo-metrics article{
  border-color:#dce6f0!important;
  box-shadow:0 12px 32px rgba(7,36,65,.06)!important;
}
.demo-center-page .demo-product-cards article:hover,
.demo-center-page .demo-ai-grid article:hover{
  transform:translateY(-3px);box-shadow:0 18px 42px rgba(23,105,255,.11)!important;transition:.22s ease
}
.demo-center-page .demo-table-row{background:#fff}
.demo-center-page .demo-table-row:hover{background:#f7faff}
.demo-center-page .demo-workspace-head{padding-bottom:8px;border-bottom:1px solid #e5edf5}
.demo-center-page .demo-workspace-head h3{font-size:34px!important;letter-spacing:-.025em}
@media(max-width:900px){
 .demo-center-page .demo-app-shell{display:block!important}
 .demo-center-page .demo-sidebar{width:100%!important;min-width:0!important}
 .demo-center-page .demo-workspace{width:100%!important}
 .demo-center-page .demo-report-row{grid-template-columns:44px minmax(0,1fr) auto!important}
 .demo-center-page .demo-report-row button{grid-column:2/-1;justify-self:start}
}
@media(max-width:560px){
 .demo-center-page .demo-report-row{grid-template-columns:40px minmax(0,1fr)!important}
 .demo-center-page .demo-report-row em,.demo-center-page .demo-report-row button{grid-column:2!important;justify-self:start}
}

/* ===== V85.9 PRODUCT BRAND — DW FLOW PROMINENT ===== */
.demo-center-page .saas-top .brand-logo-public{gap:14px!important;align-items:center!important}
.demo-center-page .saas-top .brand-logo-public .brand-image{width:66px!important;height:66px!important;flex-basis:66px!important;border-radius:16px!important}
.demo-center-page .saas-top .brand-logo-public .brand-copy{display:flex!important;flex-direction:row!important;align-items:baseline!important;gap:7px!important;line-height:1!important;white-space:nowrap!important}
.demo-center-page .saas-top .brand-logo-public .brand-copy strong{font-size:22px!important;font-weight:950!important;letter-spacing:.02em!important;color:#071d2e!important}
.demo-center-page .saas-top .brand-logo-public .brand-copy small{font-size:22px!important;font-weight:950!important;letter-spacing:.08em!important;color:#1769ff!important}
.demo-center-page .saas-top .container{min-height:88px!important}
.demo-center-page .brand-logo-footer .brand-copy{display:flex!important;flex-direction:row!important;align-items:baseline!important;gap:6px!important}
.demo-center-page .brand-logo-footer .brand-copy strong,.demo-center-page .brand-logo-footer .brand-copy small{font-size:18px!important;font-weight:900!important}
.demo-center-page .brand-logo-footer .brand-copy small{color:#ffd43b!important;letter-spacing:.08em!important}
@media(max-width:760px){
 .demo-center-page .saas-top .brand-logo-public .brand-image{width:50px!important;height:50px!important;flex-basis:50px!important}
 .demo-center-page .saas-top .brand-logo-public .brand-copy strong,.demo-center-page .saas-top .brand-logo-public .brand-copy small{font-size:16px!important}
 .demo-center-page .saas-top .container{min-height:70px!important}
}

/* V85.11 — premium homepage + CTA contrast */
.demo-conversion .actions .btn:first-child{background:#1769ff!important;color:#ffd33d!important;border-color:#1769ff!important;text-shadow:none!important}
.dw-home-premium-hero{max-width:none!important;margin:0!important;padding:74px max(4vw,68px) 54px!important;background:radial-gradient(circle at 65% 10%,rgba(33,111,255,.48),transparent 32%),linear-gradient(135deg,#061d31 0%,#0b365b 58%,#0c4a75 100%)!important;color:#fff;min-height:650px}
.dw-home-premium-hero .eyebrow{display:inline-flex;align-items:center;background:#ffd33d!important;color:#08223a!important;padding:14px 22px;border-radius:999px;font-weight:950;letter-spacing:.16em}
.dw-home-premium-hero h1{color:#fff!important}.dw-home-premium-hero h1 em{color:#58a8ff!important}.dw-home-premium-hero p{color:#d2e2ef!important}.dw-home-premium-hero .hero-primary{background:#ffd33d!important;color:#08223a!important}.dw-home-premium-hero .hero-secondary{color:#fff!important;border-color:rgba(255,255,255,.32)!important;background:rgba(255,255,255,.06)!important}
.dw-home-trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:24px;color:#c9dceb;font-weight:800;font-size:14px}
.saas-home .feature-grid article,.saas-home .pricing-grid article{transition:transform .2s ease,box-shadow .2s ease}.saas-home .feature-grid article:hover,.saas-home .pricing-grid article:hover{transform:translateY(-5px);box-shadow:0 22px 45px rgba(7,31,58,.12)}
.saas-home .pricing-section{background:linear-gradient(145deg,#f5f9ff,#fffaf0)!important}
@media(max-width:1050px){.dw-home-premium-hero{padding:58px 28px 48px!important;min-height:auto}.dw-home-premium-hero .demo-live-window{max-width:760px;width:100%}}
@media(max-width:700px){.dw-home-premium-hero{padding:42px 18px 38px!important}.dw-home-premium-hero .eyebrow{font-size:10px;padding:11px 14px}.dw-home-trust{gap:10px}}