:root{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#343a3e;background:#f5f4f1;
  --brand-orange:#f4a641;--brand-orange-dark:#df8f27;--brand-charcoal:#373d41;--brand-grey:#73787c;
  --paper:#fff;--warm:#f5f4f1;--warm-2:#ece9e3;--line:#dedbd5;--muted:#747a7e;--ink:#343a3e;
  --shadow:0 12px 32px rgba(52,58,62,.08)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#f7f6f3 0,#f2f0ec 100%);color:var(--ink);min-height:100vh}
a{color:#b76f18;text-decoration:none}a:hover{text-decoration:none;color:#8f5310}.test-banner{background:#fff0bd;color:#664700;border-bottom:1px solid #e4c55d;padding:9px 18px;text-align:center;font-size:14px;font-weight:650}
.site-header{min-height:92px;background:#fff;border-top:4px solid var(--brand-orange);border-bottom:1px solid #e6e3dd;display:flex;align-items:center;gap:42px;padding:0 max(28px,calc((100vw - 1240px)/2));position:sticky;top:0;z-index:5;box-shadow:0 4px 18px rgba(52,58,62,.04)}
.brand{display:flex;align-items:center;gap:16px;min-width:286px;color:var(--ink)}.brand:hover{color:var(--ink)}.brand img{display:block;width:214px;height:auto}.portal-label{border-left:1px solid #ddd8d0;padding-left:16px;color:#777b7e;font-size:12px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap}.site-header nav{display:flex;align-items:center;gap:6px}.site-header nav a{font-weight:750;color:#4d5357;padding:12px 14px;border-radius:10px;transition:.16s ease}.site-header nav a:hover{background:#fff4e5;color:#a86212}.user-nav{margin-left:auto;display:flex;align-items:center;gap:18px;font-size:14px;color:#676d71}.user-nav a{display:inline-flex;align-items:center;min-height:40px;border:1px solid #ddd8d0;border-radius:10px;padding:0 13px;color:#4d5357;font-weight:700;background:#fff}.user-nav a:hover{border-color:#efbe7d;background:#fff8ef;color:#99580f}
.page-shell{max-width:1240px;margin:0 auto;padding:38px 24px 64px}.site-footer{max-width:1240px;margin:0 auto;border-top:1px solid #ddd8d0;color:#767b7f;padding:26px 24px 34px;font-size:13px;display:flex;justify-content:space-between;gap:24px}.site-footer strong{color:#4d5357}.footer-links{display:flex;gap:16px}.footer-links a{font-weight:750}.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#363c40 0%,#444a4e 100%);color:#fff;border-radius:20px;padding:34px 36px;box-shadow:var(--shadow);border:1px solid #32383b}.hero:after{content:"";position:absolute;right:-70px;top:-90px;width:270px;height:270px;border:52px solid rgba(244,166,65,.18);border-radius:50%}.hero:before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--brand-orange)}.hero h1{position:relative;z-index:1;margin:4px 0 8px;font-size:34px;line-height:1.12;letter-spacing:-.025em}.hero p{position:relative;z-index:1;margin:0;color:#e9e6e1;max-width:760px}.eyebrow{position:relative;z-index:1;font-size:11px;font-weight:850;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-orange)}.eyebrow.dark{color:#8c5a1d;opacity:1}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-top:20px}.card,.panel{background:rgba(255,255,255,.96);border:1px solid #e0ddd7;border-radius:16px;box-shadow:0 6px 22px rgba(52,58,62,.05)}.card{padding:22px;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.card:hover{transform:translateY(-1px);border-color:#edc491;box-shadow:0 10px 28px rgba(52,58,62,.07)}.card h3{margin:4px 0 8px;color:#3d4347}.metric{font-size:30px;font-weight:850;color:#3f4549}.muted{color:#777d81}.panel{padding:24px;margin-top:22px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.panel-head h2{margin:0;color:#3d4347;font-size:22px}.table-wrap{overflow:auto;border:1px solid #e6e2dc;border-radius:12px}.table{width:100%;border-collapse:collapse;background:#fff}.table th,.table td{padding:13px 12px;border-bottom:1px solid #ebe8e2;text-align:left;white-space:nowrap}.table tbody tr:hover{background:#fffaf4}.table th{font-size:11px;text-transform:uppercase;letter-spacing:.075em;color:#777d81;background:#f7f5f1}.table tr:last-child td{border-bottom:0}.table td a{font-weight:750;color:#a86212}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border:1px solid #d7d2ca;border-radius:10px;background:#fff;color:#4c5256;padding:10px 15px;font-weight:780;cursor:pointer;transition:.16s ease}.btn.primary{background:var(--brand-orange);color:#fff;border-color:var(--brand-orange);box-shadow:0 5px 14px rgba(244,166,65,.2)}.btn:hover{filter:none;background:#fff8ef;border-color:#e7b875;color:#93540d}.btn.primary:hover{background:var(--brand-orange-dark);border-color:var(--brand-orange-dark);color:#fff}.filters{display:flex;flex-wrap:wrap;gap:12px;align-items:end}.filters label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:780;color:#666c70}.filters input,.filters select,.auth-form input{min-height:44px;border:1px solid #cfc9c0;border-radius:9px;padding:9px 11px;background:#fff;color:#343a3e;outline:none;transition:.15s ease}.filters input:focus,.filters select:focus,.auth-form input:focus{border-color:var(--brand-orange);box-shadow:0 0 0 3px rgba(244,166,65,.16)}.pagination{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px}.status{display:inline-flex;border-radius:999px;background:#fff2df;color:#9b5b11;border:1px solid #f0c98f;padding:5px 9px;font-size:12px;font-weight:780}.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.detail-field{border:1px solid #e4e0d9;border-radius:11px;padding:14px;background:#fbfaf8}.detail-field span{display:block;color:#7d8285;font-size:12px;margin-bottom:5px}.detail-field strong{font-size:15px;color:#3b4145}.auth-shell{max-width:500px;margin:58px auto}.auth-card{position:relative;background:#fff;border:1px solid #e0ddd7;border-radius:20px;padding:34px;box-shadow:0 16px 44px rgba(52,58,62,.09);overflow:hidden}.auth-card:before{content:"";position:absolute;left:0;top:0;right:0;height:5px;background:var(--brand-orange)}.auth-card h1{margin:5px 0 8px;color:#3d4347;font-size:30px}.auth-form{display:flex;flex-direction:column;gap:16px;margin-top:24px}.auth-form label{display:flex;flex-direction:column;gap:7px;font-weight:750;color:#555b5f}.notice{padding:12px 14px;border-radius:10px;margin:14px 0;background:#eff7ef;color:#35603a;border:1px solid #cfe2cf}.notice.error{background:#fff0ef;color:#8c3933;border-color:#efcdca}.empty{padding:28px;text-align:center;color:#777d81}.back{margin-bottom:15px}.back a{font-weight:750;color:#9d5d14}.role{font-size:13px;font-weight:750;color:#686e72}.panel-intro{margin:-4px 0 20px;color:#70767a;max-width:850px}.detail-subtitle{margin:25px 0 10px;font-size:13px;color:#8f5819;text-transform:uppercase;letter-spacing:.065em}.detail-subtitle:first-of-type{margin-top:6px}.mdr-panel{border-color:#e0d7c8}.mdr-panel .detail-field{background:#fcfbf8}.detail-field.wide{grid-column:span 2}.code-field strong{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;font-size:14px;overflow-wrap:anywhere}.auth-shell:before{content:"Decupré klantportaal";display:block;text-align:center;color:#777d81;text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:850;margin-bottom:14px}
@media(max-width:900px){.site-header{padding:0 20px;gap:22px}.brand{min-width:0}.brand img{width:190px}.portal-label{display:none}.user-nav span{display:none}}
@media(max-width:700px){.site-header{padding:12px 14px 10px;gap:10px;flex-wrap:wrap;min-height:auto}.brand img{width:180px}.site-header nav{order:3;width:100%;padding-top:4px;border-top:1px solid #eeeae4}.site-header nav a{padding:9px 10px}.user-nav{margin-left:auto}.page-shell{padding:24px 12px 46px}.hero{padding:26px 24px}.hero h1{font-size:29px}.panel{padding:18px}.table th,.table td{padding:10px 9px}.detail-field.wide{grid-column:span 1}.site-footer{padding:22px 14px 30px;flex-direction:column;gap:8px}.auth-shell{margin:30px auto}.auth-card{padding:26px 22px}}

/* BEGIN Decupre accountfuncties V1 - managed */
.auth-links{margin-top:16px;text-align:center;font-size:14px}
.auth-links a{font-weight:750;color:#9d5d14}
.auth-links .btn{color:#fff}
.user-nav{gap:10px}
@media(max-width:900px){.user-nav .account-link{display:none}}
/* END Decupre accountfuncties V1 - managed */

/* BEGIN ADMatras overzicht + Excel V1 - managed */
.panel-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.compact-table th,.compact-table td{padding:11px 12px}
.compact-table .clickable-row{cursor:pointer;transition:background .12s ease}
.compact-table .clickable-row:hover{background:#fff6e9}
.compact-table .clickable-row:focus{outline:2px solid var(--brand-orange);outline-offset:-2px;background:#fff8ef}
.compact-table .date-primary{font-weight:800;color:#4a5054}
.compact-table .info-cell{width:46px;text-align:center}
.compact-table .info-link{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:1px solid #e0c18e;background:#fff8ed;color:#9b5b11;font-size:18px;line-height:1;text-decoration:none}
.compact-table .info-link:hover{background:#fff0d6;border-color:#dea450}
@media(max-width:700px){.panel-head{align-items:flex-start;flex-direction:column}.panel-actions{width:100%}.panel-actions .btn{flex:1}.compact-table th,.compact-table td{padding:9px 8px}}
/* END ADMatras overzicht + Excel V1 - managed */

/* BEGIN DECUPRE_KLANTPORTAAL_UI_POLISH_V1_MANAGED */
/* Decupre Klantportaal UI Polish V1 - styling only; existing forms and permissions unchanged. */
:root {
  --portal-focus: #c27821;
  --portal-orange-soft: #fff4e4;
  --portal-ink-strong: #343a3e;
  --portal-field-line: #bdb7ae;
  --portal-card-line: #e1ddd5;
}

/* Navigation and page rhythm */
.site-header { box-shadow: 0 5px 22px rgba(44,48,51,.06); }
.site-header nav a, .user-nav a { transition: background-color .16s ease, border-color .16s ease, color .16s ease; }
.site-header nav a:focus-visible, .user-nav a:focus-visible,
.page-shell a:focus-visible, .page-shell button:focus-visible,
.page-shell input:focus-visible, .page-shell select:focus-visible,
.page-shell textarea:focus-visible, .page-shell summary:focus-visible {
  outline: 3px solid rgba(194,120,33,.38);
  outline-offset: 2px;
}
.page-shell { padding-top: 30px; }
.page-shell .hero {
  padding: 29px 34px;
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(37,42,43,.09);
}
.page-shell .hero h1 { font-size: clamp(26px,3vw,34px); line-height: 1.18; }
.page-shell .hero p { line-height: 1.55; }
.page-shell .back { margin-bottom: 14px; }
.page-shell .back a { display: inline-flex; align-items: center; min-height: 36px; color: #955612; }
.page-shell .back a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Cards, headings and detail facts */
.page-shell .panel {
  margin-top: 18px;
  padding: 23px 25px;
  border: 1px solid var(--portal-card-line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 5px 20px rgba(44,48,51,.045);
}
.page-shell .panel-head { gap: 16px; flex-wrap: wrap; margin-bottom: 17px; }
.page-shell .panel-head h2 { font-size: clamp(19px,2vw,22px); line-height: 1.25; letter-spacing: -.018em; }
.page-shell .panel-head .eyebrow { margin-bottom: 6px; }
.page-shell .panel-intro { margin: -2px 0 19px; line-height: 1.55; }
.page-shell .panel-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.page-shell .card { border: 1px solid var(--portal-card-line); }
.page-shell .grid .card { padding: 20px 22px; }
.page-shell .card h3 { line-height: 1.3; }
.page-shell .detail-grid { gap: 11px; }
.page-shell .detail-field {
  min-width: 0;
  padding: 13px 15px;
  border: 1px solid #e5e1da;
  border-radius: 11px;
  background: #fbfaf8;
}
.page-shell .detail-field span { color: #696f71; font-size: 12px; }
.page-shell .detail-field strong { color: #343a3e; line-height: 1.45; overflow-wrap: anywhere; }
.page-shell .detail-subtitle { padding-bottom: 8px; border-bottom: 1px solid #eee7de; }
.page-shell .status { padding: 6px 10px; font-size: 12px; line-height: 1.1; }

/* Buttons and accessible text contrast in the orange Decupre theme */
.page-shell .btn {
  min-height: 43px;
  padding: 10px 16px;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 760;
  text-align: center;
  border-radius: 9px;
  transition: background-color .15s, border-color .15s, box-shadow .15s;
}
.page-shell .btn.primary {
  background: #f4a641;
  border-color: #e5a03f;
  color: #30271d;
  box-shadow: 0 3px 10px rgba(180,112,35,.12);
}
.page-shell .btn.primary:hover { background: #ec9c32; color: #30271d; border-color: #d18a2c; }
.page-shell .btn:disabled, .page-shell button:disabled { cursor: not-allowed; opacity: .58; box-shadow: none; }
.page-shell .btn.danger {
  background: #963e38;
  border-color: #963e38;
  color: #fff;
  box-shadow: none;
}
.page-shell .btn.danger:hover { background: #7e322d; border-color: #7e322d; color: #fff; }

/* Search controls: consistent widths and clearly visible fields */
.page-shell .filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  align-items: end;
  gap: 13px;
}
.page-shell .filters label { min-width: 0; gap: 7px; color: #51585b; font-size: 13px; }
.page-shell .filters > .btn { align-self: end; white-space: nowrap; }
.page-shell :is(.filters,.manage-form,.user-admin-form) :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),select,textarea) {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid var(--portal-field-line);
  border-radius: 9px;
  background: #fff;
  color: #343a3e;
  font: inherit;
  font-size: 14px;
  box-shadow: 0 1px 2px rgba(25,25,25,.025);
}
.page-shell :is(.filters,.manage-form,.user-admin-form) textarea { line-height: 1.55; resize: vertical; }
.page-shell :is(.filters,.manage-form,.user-admin-form) :is(input,select,textarea):hover { border-color: #a9a197; }
.page-shell :is(.filters,.manage-form,.user-admin-form) :is(input,select,textarea):focus {
  border-color: #c27821;
  box-shadow: 0 0 0 3px rgba(244,166,65,.18);
}

/* Tables: compact but readable; horizontal scrolling remains available */
.page-shell .table-wrap { border: 1px solid #e5e0d8; border-radius: 12px; overflow-x: auto; }
.page-shell .table { font-size: 13px; }
.page-shell .table th { padding: 12px 13px; background: #f5f3ef; color: #535a5d; letter-spacing: .06em; }
.page-shell .table td { padding: 12px 13px; line-height: 1.5; vertical-align: middle; }
.page-shell .table tbody tr:nth-child(even) { background: #fdfcfb; }
.page-shell .table tbody tr:hover { background: #fff4e7; }
.page-shell .table td strong { font-weight: 760; }
.page-shell .table td a { text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px; }
.page-shell .table td a:hover { text-decoration-color: currentColor; }
.page-shell .clickable-row { cursor: pointer; }
.page-shell .clickable-row:focus-visible { outline: 2px solid #c27821; outline-offset: -2px; background: #fff5e8; }
.page-shell .info-link { border-radius: 8px; }
.page-shell .pagination { margin-top: 18px; flex-wrap: wrap; font-size: 13px; color: #62696d; }

/* Matrasbeheer: all original input names/handlers remain in place */
.page-shell .manage-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px 18px;
  max-width: none;
  align-items: end;
}
.page-shell .manage-form > label { display: grid; min-width: 0; gap: 7px; color: #4b5356; font-size: 13px; }
.page-shell .manage-form > label:has(textarea) { grid-column: 1 / -1; }
.page-shell .manage-form textarea { min-height: 106px; }
.page-shell .manage-form > .btn { grid-column: 1 / -1; width: max-content; min-width: 200px; max-width: 100%; }
.page-shell .manage-checks { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 12px; }
.page-shell .manage-checks label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 11px 14px;
  border: 1px solid #dfd9d1;
  border-radius: 10px;
  background: #fbfaf8;
  color: #4b5356;
  cursor: pointer;
}
.page-shell .manage-checks input[type="checkbox"] { width: 19px; height: 19px; min-height: 19px; margin: 0; accent-color: #af6a20; flex: none; }
.page-shell .panel:has(.manage-checks) { border-left: 4px solid #aa5650; }
.page-shell .panel:has(.manage-checks) .panel-head .eyebrow { color: #953f37; }
.page-shell .nonmatching-covers {
  margin-top: 17px;
  border-top: 1px solid #ece5d8;
  padding-top: 13px;
}
.page-shell .nonmatching-covers summary { color: #925714; font-weight: 750; cursor: pointer; }
.page-shell .nonmatching-row { border: 1px solid #e8e1d7; border-radius: 9px; background: #fcfaf6; padding: 10px 13px; }
.page-shell .empty { border: 1px dashed #e3d8c9; border-radius: 10px; background: #fdfbf7; line-height: 1.6; }

/* Hoofdgebruiker: calm disclosure cards and better location selection */
.page-shell .user-admin-card { transform: none; box-shadow: none; }
.page-shell .user-admin-card:hover { transform: none; box-shadow: 0 4px 15px rgba(44,48,51,.045); }
.page-shell .user-admin-card > summary {
  min-height: 49px;
  padding: 3px 0;
  color: #42484b;
  gap: 12px;
  line-height: 1.45;
}
.page-shell .user-admin-card > summary::after {
  content: "+";
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  margin-left: 4px;
  background: #fff1de;
  color: #925714;
  font-weight: 850;
  font-size: 19px;
}
.page-shell .user-admin-card[open] > summary::after { content: "-"; }
.page-shell .user-admin-card > summary small { overflow-wrap: anywhere; }
.page-shell .user-admin-form { margin-top: 18px; }
.page-shell .user-admin-grid { gap: 13px 16px; }
.page-shell .user-admin-grid label { min-width: 0; gap: 7px; font-size: 13px; }
.page-shell .location-box { padding: 15px; margin: 18px 0; background: #fcfbf8; }
.page-shell .location-grid { gap: 8px; }
.page-shell .check-line { align-items: center; background: #fff; border-color: #e3ddd3; cursor: pointer; }
.page-shell .check-line:hover { background: #fff7ec; border-color: #e6b777; }
.page-shell .check-line input[type="checkbox"] { width: 18px; height: 18px; margin: 0; accent-color: #c27821; flex: none; }
.page-shell .user-actions { align-items: center; gap: 9px; }
.page-shell .user-badges { gap: 6px; }

/* Feedback and smaller screens */
.page-shell .notice { line-height: 1.55; border-radius: 10px; }
.page-shell .notice.ok { background: #f0f8f0; border: 1px solid #bfd9be; color: #305d35; }
.page-shell .notice.error { background: #fff3f1; border: 1px solid #e3b9b3; color: #8d312d; }
@media (max-width: 1050px) {
  .page-shell .filters { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .page-shell .filters > .btn { width: 100%; }
}
@media (max-width: 720px) {
  .site-header { gap: 8px; }
  .site-header nav { gap: 3px; }
  .site-header nav a { padding: 10px 11px; }
  .page-shell { padding: 23px 13px 44px; }
  .page-shell .hero { padding: 25px 22px; }
  .page-shell .panel { padding: 18px 16px; }
  .page-shell .panel-head { align-items: flex-start; }
  .page-shell .panel-actions { width: 100%; }
  .page-shell .filters { grid-template-columns: 1fr; }
  .page-shell .filters > .btn { width: 100%; }
  .page-shell .manage-form { grid-template-columns: 1fr; }
  .page-shell .manage-form > .btn { width: 100%; }
  .page-shell .manage-checks { flex-direction: column; gap: 9px; }
  .page-shell .manage-checks label { width: 100%; }
  .page-shell .detail-grid { grid-template-columns: 1fr; }
  .page-shell .detail-field.wide { grid-column: auto; }
  .page-shell .pagination { justify-content: center; }
  .page-shell .pagination > * { max-width: 100%; }
  .page-shell .user-admin-card > summary { flex-wrap: wrap; }
  .page-shell .user-badges { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .site-header nav a, .user-nav a, .page-shell .btn { transition: none; }
}
/* END DECUPRE_KLANTPORTAAL_UI_POLISH_V1_MANAGED */

/* CUSTOMER HERO LOGO V1: zacht geïntegreerd klantlogo, nooit over de oranje accentlijn. */
.hero.hero-branded {isolation:isolate}
.hero.hero-branded > :not(.customer-hero-watermark) {position:relative;z-index:1}
.hero .customer-hero-watermark {position:absolute;display:block;right:20px;top:50%;transform:translateY(-50%);width:min(34%,320px);height:83%;object-fit:contain;object-position:center;opacity:.32;filter:grayscale(1) brightness(1.85);mix-blend-mode:screen;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 28%,#000 75%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 28%,#000 75%,transparent 100%);pointer-events:none;z-index:0}
.hero.hero-branded::before{z-index:2}
.hero.hero-branded::after{opacity:.6;z-index:0}
@media(max-width:700px){.hero .customer-hero-watermark{right:-32px;width:54%;opacity:.14}.hero.hero-branded h1,.hero.hero-branded p{max-width:100%}}

/* MDR CLIENT BRAND BAR V4 - original uploaded logo remains stored, only view changes. */
.page-shell .hero {
  background: linear-gradient(115deg,#30383d 0%,#3d4549 57%,#262f33 100%);
  border-color:#283137;
  box-shadow:0 12px 32px rgba(37,45,49,.13);
}
.page-shell .hero:after { border-color:rgba(244,166,65,.12); }
.hero.hero-branded { isolation:isolate; }
.hero.hero-branded > :not(.customer-hero-watermark) {position:relative;z-index:2}
.hero.hero-branded > img.customer-hero-watermark {
  position:absolute !important;display:block !important;
  right:var(--logo-v4-right,20px) !important;top:50% !important;
  width:min(38%,var(--logo-v4-width,330px)) !important;height:88% !important;
  transform:translateY(-50%) !important;object-fit:contain !important;object-position:center !important;
  opacity:var(--logo-v4-opacity,.55) !important;
  mix-blend-mode:normal !important;filter:none !important;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 19%,#000 87%,transparent) !important;
  mask-image:linear-gradient(90deg,transparent,#000 19%,#000 87%,transparent) !important;
  pointer-events:none !important;z-index:1 !important;
}
.hero.hero-branded[data-logo-v4-mode="mono"] > img.customer-hero-watermark{filter:grayscale(1) brightness(1.15) !important}
.hero.hero-branded[data-logo-v4-mode="mist"] > img.customer-hero-watermark{filter:blur(.8px) !important;opacity:calc(var(--logo-v4-opacity,.55)*.45) !important}
.hero.hero-branded[data-logo-v4-mode="clear"] > img.customer-hero-watermark:not(.logo-v4-poster){opacity:min(1,calc(var(--logo-v4-opacity,.55)*1.30)) !important}
.hero.hero-branded > img.customer-hero-watermark.logo-v4-poster{opacity:calc(var(--logo-v4-opacity,.55)*.24) !important}
.hero.hero-branded::before{z-index:4}
.hero.hero-branded::after{z-index:0}
@media(max-width:700px){
 .hero.hero-branded > img.customer-hero-watermark{right:-12px !important;width:48% !important;height:88% !important;opacity:calc(var(--logo-v4-opacity,.55)*.42) !important}
 .hero.hero-branded > img.customer-hero-watermark.logo-v4-poster{opacity:.09 !important}
}

/* DECUPRE HERO ORIGINAL + LOGO PANEEL V5 - ALLEEN WEERGAVE */
/* Herstel het oorspronkelijke Decupre-charcoalverloop (ook zonder klantlogo). */
.page-shell .hero {
  background:linear-gradient(120deg,#363c40 0%,#444a4e 100%) !important;
  border-color:#32383b !important;
  box-shadow:var(--shadow) !important;
}
/* Alleen een logo levert een rechterpaneel op; zonder logo blijft de originele balk. */
.page-shell .hero.hero-branded { isolation:isolate; min-height:156px; }
.page-shell .hero.hero-branded > :not(.customer-logo-v5-stage) { position:relative; z-index:4; }
.page-shell .hero.hero-branded .customer-logo-v5-stage {
  position:absolute; inset:0 0 0 auto; display:block; width:40%;
  overflow:hidden; background:#fff; pointer-events:none; z-index:1;
  clip-path:ellipse(96% 144% at 110% 50%);
}
/* Het origineel blijft intact, wordt niet gedesatureerd en krijgt geen canvas-transformatie. */
.page-shell .hero.hero-branded .customer-logo-v5-stage img.customer-hero-watermark {
  display:block !important; position:absolute !important;
  left:auto !important; right:6% !important; top:50% !important;
  transform:translateY(-50%) !important;
  width:79% !important; height:85% !important;
  max-width:none !important; max-height:none !important;
  object-fit:contain !important; object-position:center !important;
  opacity:1 !important; filter:none !important; mix-blend-mode:normal !important;
  mask-image:none !important; -webkit-mask-image:none !important;
  pointer-events:none !important; z-index:1 !important;
}
/* De bestaande oranje boog ligt optisch VOOR de logoachtergrond, achter de tekst. */
.page-shell .hero.hero-branded::after {
  content:""; position:absolute; right:16% !important; top:-118px !important;
  width:225px !important; height:225px !important;
  border:44px solid rgba(244,166,65,.22) !important;
  border-radius:50%; opacity:1 !important;
  z-index:2 !important; pointer-events:none;
}
.page-shell .hero.hero-branded::before { z-index:5 !important; }
.page-shell .hero.hero-branded h1,
.page-shell .hero.hero-branded p,
.page-shell .hero.hero-branded .eyebrow { max-width:61%; }
/* Korte tekst en apart logopaneel op mobiele schermen. */
@media (max-width:760px) {
  .page-shell .hero.hero-branded {padding-bottom:153px; min-height:270px;}
  .page-shell .hero.hero-branded h1,
  .page-shell .hero.hero-branded p,
  .page-shell .hero.hero-branded .eyebrow {max-width:100%;}
  .page-shell .hero.hero-branded .customer-logo-v5-stage {
    left:0;right:0;top:auto;bottom:0;width:100%;height:132px;
    clip-path:none;border-top:3px solid rgba(244,166,65,.45);
  }
  .page-shell .hero.hero-branded .customer-logo-v5-stage img.customer-hero-watermark {
    right:10% !important; width:80% !important;height:88% !important;
  }
  .page-shell .hero.hero-branded::after {display:none !important;}
}

/* V5.1: behoud maat, positie en gekozen weergavestijl van logo-editor V4. */
.page-shell .hero.hero-branded .customer-logo-v5-stage img.customer-hero-watermark {
  width:min(84%, var(--logo-v4-width,330px)) !important;
  right:min(18%, var(--logo-v4-right,20px)) !important;
}
.page-shell .hero.hero-branded[data-logo-v4-mode="soft"] .customer-logo-v5-stage img.customer-hero-watermark {
  opacity:min(.94,calc(var(--logo-v4-opacity,.55) + .20)) !important;
}
.page-shell .hero.hero-branded[data-logo-v4-mode="mono"] .customer-logo-v5-stage img.customer-hero-watermark {
  opacity:min(.94,calc(var(--logo-v4-opacity,.55) + .20)) !important;
  filter:grayscale(1) !important;
}
.page-shell .hero.hero-branded[data-logo-v4-mode="mist"] .customer-logo-v5-stage img.customer-hero-watermark {
  opacity:calc(var(--logo-v4-opacity,.55) * .9) !important;
  filter:blur(.6px) !important;
}
.page-shell .hero.hero-branded[data-logo-v4-mode="clear"] .customer-logo-v5-stage img.customer-hero-watermark {
  opacity:1 !important;filter:none !important;
}
