/* ============================================================
   BENTHEIM IT SITE SYSTEM v30
   One public stylesheet. No stacked patch CSS.
   assets/style.css may still provide legacy form mechanics,
   but ALL theme, responsive, branding, language and scan visuals
   are owned here.
   ============================================================ */

/* ---------- 0. RESET / TOKENS ---------- */
:root{
  --theme-primary:#2563eb;
  --theme-accent:#16a085;
  --theme-background:#f7f5ef;
  --theme-surface:#ffffff;
  --theme-surface_alt:#ece8de;
  --theme-text:#171714;
  --theme-muted:#68635a;
  --site-max:1380px;
  --site-gutter:clamp(14px,3vw,34px);
}
*,:before,:after{box-sizing:border-box}
html{width:100%;max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{width:100%;max-width:100%;margin:0;overflow-x:hidden;background:var(--theme-background);color:var(--theme-text);font-family:Inter,"Segoe UI",Arial,Helvetica,sans-serif}
img,svg,video,canvas{max-width:100%;height:auto}
.theme-shell,.theme-shell *{min-width:0}
.has-server-theme-shell>.legacy-topbar,
.has-server-theme-shell #legacyHome,
.has-server-theme-shell #how,
.has-server-theme-shell #services,
.has-server-theme-shell>.proof-strip{display:none!important}

/* accessibility skip link */
.skip{
  position:fixed!important;left:12px!important;top:12px!important;z-index:999999!important;
  transform:translateY(-180%)!important;opacity:0!important;pointer-events:none!important;
  padding:10px 14px!important;border-radius:8px!important;background:#fff!important;color:#111827!important;
  font:800 14px/1.2 Inter,"Segoe UI",Arial,sans-serif!important;box-shadow:0 8px 24px rgba(0,0,0,.24)!important
}
.skip:focus,.skip:focus-visible{transform:none!important;opacity:1!important;pointer-events:auto!important}

/* ---------- 1. PUBLIC SHELL BASE ---------- */
.theme-shell{background:var(--theme-background);color:var(--theme-text);overflow:hidden}
.theme-shell h1,.theme-shell h2,.theme-shell h3,.theme-shell h4{color:var(--theme-text);opacity:1;text-shadow:none}
.theme-shell p,.theme-shell li{color:var(--theme-muted)}
.shell-nav,.shell-hero,.shell-capabilities,.shell-process,.shell-final,.shell-stats{
  width:min(var(--site-max),calc(100% - (var(--site-gutter) * 2)));margin-inline:auto
}

/* ---------- 2. BRAND + HEADER ---------- */
.shell-nav{
  position:relative;z-index:50;min-height:78px;padding:14px 18px;display:flex;align-items:center;
  justify-content:space-between;gap:24px;border:1px solid color-mix(in srgb,var(--theme-text) 12%,transparent);
  border-radius:16px;background:color-mix(in srgb,var(--theme-surface) 92%,transparent)
}
.shell-brand{display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important;text-decoration:none!important;color:var(--theme-text)!important}
.shell-brand-media{position:relative;display:grid;place-items:center;flex:0 0 auto;min-width:42px;min-height:42px}
.shell-brand-media img{display:block;width:auto;height:var(--theme-logo-height,44px);max-width:180px;max-height:64px;object-fit:contain}
.shell-brand-mark{display:grid;place-items:center;width:42px;height:42px;background:var(--theme-primary);color:var(--theme-background);font:950 11px/1 Inter,Arial,sans-serif}
.shell-brand-copy{display:block;min-width:0}
.shell-brand-copy b{display:block;color:var(--theme-text);font:850 15px/1.12 Inter,"Segoe UI",Arial,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shell-brand-copy small{display:block;margin-top:3px;color:var(--theme-muted);font:650 9px/1.1 Inter,"Segoe UI",Arial,sans-serif}
.shell-brand-pulse{position:absolute;right:-2px;bottom:-2px;width:9px;height:9px;border-radius:50%;background:var(--theme-primary);animation:brandPulse 1.8s ease-out infinite}
@keyframes brandPulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--theme-primary) 55%,transparent)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
.shell-desktop-nav{display:flex;align-items:center;justify-content:center;gap:4px;flex:1 1 auto}
.shell-desktop-nav a{padding:11px 12px;color:var(--theme-text);text-decoration:none;font-size:13px;line-height:1.15;font-weight:800;white-space:nowrap}
.shell-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.shell-nav-cta,.shell-hero-actions a,.shell-final>a{
  display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 16px;
  background:var(--theme-primary);color:var(--theme-background)!important;text-decoration:none;
  font-size:13px;line-height:1.15;font-weight:900
}
.shell-language{
  min-width:86px;min-height:44px;padding:8px 10px;border:1px solid color-mix(in srgb,var(--theme-text) 20%,transparent);
  border-radius:9px;background:var(--theme-background);color:var(--theme-text);font:700 13px/1.2 Inter,"Segoe UI",Arial,sans-serif
}
.shell-language option,.shell-language optgroup{background:#fff!important;color:#111827!important;font:600 14px/1.2 "Segoe UI",Arial,sans-serif!important}
.shell-mobile-menu{display:none;position:relative}
.shell-mobile-menu summary{list-style:none;width:42px;height:42px;display:grid;place-content:center;gap:5px;cursor:pointer;border:1px solid color-mix(in srgb,var(--theme-text) 18%,transparent);border-radius:9px;background:var(--theme-surface)}
.shell-mobile-menu summary::-webkit-details-marker{display:none}
.shell-mobile-menu summary span{display:block;width:19px;height:2px;background:var(--theme-text)}
.shell-mobile-menu>nav{position:absolute;right:0;top:50px;z-index:100;width:min(300px,calc(100vw - 28px));display:grid;gap:4px;padding:10px;border:1px solid color-mix(in srgb,var(--theme-text) 15%,transparent);border-radius:12px;background:var(--theme-surface);box-shadow:0 22px 60px rgba(0,0,0,.24)}
.shell-mobile-menu>nav a{padding:12px 13px;color:var(--theme-text);text-decoration:none;font-size:14px;font-weight:800}
.shell-mobile-menu>nav .mobile-primary{margin-top:4px;background:var(--theme-primary);color:var(--theme-background)}

/* ---------- 3. HERO / CONTENT BASE ---------- */
.shell-hero{min-height:650px;padding:72px 0;align-items:center}
.shell-hero h1{margin:14px 0 20px;max-width:100%;font-size:clamp(54px,5vw,84px);line-height:.94;letter-spacing:-.055em;overflow-wrap:normal;word-break:normal;hyphens:auto}
.shell-hero p{font-size:17px;line-height:1.62}
.shell-hero-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.shell-hero-actions a:nth-child(2){background:transparent;color:var(--theme-text)!important;border:1px solid color-mix(in srgb,var(--theme-text) 18%,transparent)}
.shell-trust{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:20px;color:var(--theme-muted);font-size:12px;font-weight:650}
.shell-section-head{max-width:900px;margin-bottom:32px}
.shell-section-head>span,.shell-final span,.shell-hero-kicker,.bento-intro>span,.tech-copy>span,.shell-dashboard-copy>span{color:var(--theme-primary)!important;font-size:10px;font-weight:950;letter-spacing:.11em;text-transform:uppercase}
.shell-section-head h2,.shell-final h2{margin:8px 0 0;font-size:clamp(36px,4.2vw,64px);line-height:.98;letter-spacing:-.05em}
.shell-section-head p,.shell-final p{max-width:760px;font-size:16px;line-height:1.65}
.shell-capabilities,.shell-process{padding:84px 0}
.shell-service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.shell-service-grid article{min-height:220px;padding:26px;border:1px solid color-mix(in srgb,var(--theme-text) 11%,transparent);background:var(--theme-surface)}
.shell-service-grid small{color:var(--theme-primary);font-weight:900}
.shell-service-grid h3{margin:42px 0 9px;font-size:22px;line-height:1.2}
.shell-service-grid p{margin:0;font-size:14px;line-height:1.55}
.shell-process-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid color-mix(in srgb,var(--theme-text) 15%,transparent)}
.shell-process-grid article{padding:24px 20px;border-right:1px solid color-mix(in srgb,var(--theme-text) 12%,transparent)}
.shell-process-grid b{color:var(--theme-primary);font-size:11px}
.shell-process-grid h3{margin:34px 0 8px;font-size:19px}
.shell-process-grid p{margin:0;font-size:14px;line-height:1.55}
.shell-final{display:flex;align-items:end;justify-content:space-between;gap:36px;margin-bottom:72px;padding:46px;border:1px solid color-mix(in srgb,var(--theme-text) 14%,transparent);background:var(--theme-surface)}
.shell-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid color-mix(in srgb,var(--theme-text) 14%,transparent);border-bottom:1px solid color-mix(in srgb,var(--theme-text) 14%,transparent)}
.shell-stats article{padding:22px}.shell-stats strong,.shell-stats span{display:block}.shell-stats strong{font-size:27px}.shell-stats span{margin-top:4px;font-size:13px}

/* ---------- 4. SHELL-SPECIFIC COMPOSITIONS ---------- */
.shell-editorial .shell-hero-editorial{padding-top:100px}
.shell-editorial .shell-editorial-grid{display:grid;grid-template-columns:minmax(0,1.28fr) minmax(340px,.72fr);gap:64px;align-items:end}
.shell-editorial .shell-editorial-grid h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(64px,6.2vw,104px);line-height:.88;font-weight:500}
.shell-editorial .shell-service-grid{grid-template-columns:repeat(2,1fr);gap:0}
.shell-editorial .shell-service-grid article{background:transparent;border-width:1px 0 0 0}

.shell-dashboard .shell-hero-dashboard{display:grid;grid-template-columns:minmax(410px,.82fr) minmax(520px,1.18fr);gap:52px}
.shell-dashboard .shell-dashboard-copy{max-width:560px}
.shell-dashboard .shell-dashboard-copy h1{font-size:clamp(54px,5vw,80px)}
.shell-dashboard .shell-dashboard-ui{width:100%;max-width:720px;justify-self:end;padding:12px;border:1px solid color-mix(in srgb,var(--theme-primary) 24%,transparent);border-radius:24px;background:var(--theme-surface);box-shadow:0 32px 80px rgba(0,0,0,.18)}
.dash-top{display:flex;align-items:center;gap:6px;padding:8px 9px 14px}.dash-top i{width:7px;height:7px;border-radius:50%;background:var(--theme-muted)}.dash-top span{margin-left:auto;font-size:9px}
.dash-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:9px}.dash-grid article{min-height:110px;padding:17px;border-radius:12px;background:var(--theme-surface_alt)}.dash-main{grid-row:span 2}.dash-wide{grid-column:1/-1}.dash-chart{display:flex;align-items:end;gap:6px;height:110px;margin-top:20px}.dash-chart i{flex:1;background:linear-gradient(var(--theme-primary),transparent)}.dash-chart i:nth-child(1){height:32%}.dash-chart i:nth-child(2){height:70%}.dash-chart i:nth-child(3){height:48%}.dash-chart i:nth-child(4){height:88%}.dash-chart i:nth-child(5){height:62%}.dash-lines i{display:block;height:7px;margin-top:8px;background:color-mix(in srgb,var(--theme-primary) 30%,transparent)}

.shell-bento .shell-hero-bento{display:grid;grid-template-columns:minmax(420px,.86fr) minmax(520px,1.14fr);gap:24px}
.bento-intro{display:flex;flex-direction:column;justify-content:flex-end;padding:38px;background:var(--theme-surface)}
.bento-intro h1{font-size:clamp(52px,4.8vw,76px)}
.bento-mosaic{display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:1.1fr .9fr;gap:10px}
.bento-mosaic article{padding:22px;background:var(--theme-surface);border:1px solid color-mix(in srgb,var(--theme-text) 10%,transparent)}
.bento-a{grid-row:span 2}.bento-mosaic strong{display:block;margin-top:55px;font-size:28px}

.shell-minimal .shell-hero-minimal{padding-top:110px}
.shell-minimal .shell-hero-minimal h1{max-width:1180px;font-size:clamp(66px,7vw,110px);font-weight:460;line-height:.86}
.minimal-bottom{display:grid;grid-template-columns:1fr auto;gap:70px;align-items:end;border-top:1px solid var(--theme-text);padding-top:22px}

.shell-tech{background-image:linear-gradient(color-mix(in srgb,var(--theme-primary) 6%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--theme-primary) 6%,transparent) 1px,transparent 1px);background-size:46px 46px}
.shell-tech .shell-hero-tech{display:grid;grid-template-columns:minmax(420px,.92fr) minmax(500px,1.08fr);gap:52px}
.shell-tech .tech-copy h1{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:clamp(50px,4.7vw,76px)}
.tech-console{border:1px solid var(--theme-primary);background:color-mix(in srgb,var(--theme-background) 92%,#000);box-shadow:12px 12px 0 color-mix(in srgb,var(--theme-primary) 18%,transparent)}
.tech-console>div,.tech-console footer{display:flex;justify-content:space-between;padding:13px 15px;font:800 9px/1 ui-monospace,monospace}.tech-console pre{margin:0;padding:34px 24px;min-height:280px;color:var(--theme-text);font:700 14px/2 ui-monospace,monospace}

.shell-bold .shell-hero-bold{position:relative;min-height:730px;padding-top:125px}
.shell-bold .shell-hero-bold h1{max-width:1180px;font-size:clamp(64px,6.3vw,104px);line-height:.84;text-transform:uppercase}
.bold-number{position:absolute;right:0;top:90px;color:color-mix(in srgb,var(--theme-primary) 20%,transparent);font:900 170px/.8 Inter,Arial,sans-serif}
.bold-lower{display:grid;grid-template-columns:1fr auto;gap:46px;align-items:end}

/* ---------- 5. LEGACY PUBLIC SECTIONS ---------- */
.has-server-theme-shell #scans,.has-server-theme-shell #scanner,.has-server-theme-shell #faq{
  width:min(var(--site-max),calc(100% - (var(--site-gutter) * 2)));margin-inline:auto
}
.has-server-theme-shell #scans,.has-server-theme-shell #faq{background:var(--theme-background)!important;color:var(--theme-text)!important}
.has-server-theme-shell .scan-card,.has-server-theme-shell .faq-item,.has-server-theme-shell details{background:var(--theme-surface)!important;border-color:color-mix(in srgb,var(--theme-text) 13%,transparent)!important;color:var(--theme-text)!important}
.has-server-theme-shell .btn,.has-server-theme-shell .scan-card .go,.has-server-theme-shell button[type=submit]{min-height:46px!important;padding:12px 16px!important;font-size:14px!important;line-height:1.2!important;font-weight:800!important}

/* ---------- 6. SCANNER: COMPLETELY ISOLATED ---------- */
#scanner{
  --scan-bg:#081a2e;--scan-deep:#061624;--scan-panel:#12324f;--scan-panel-hover:#174665;
  --scan-border:#31597a;--scan-text:#f7fbff;--scan-soft:#c8d9e5;--scan-muted:#9eb7c8;
  --scan-accent:#37c6f4;--scan-accent2:#54e1b6;
  color:var(--scan-text)!important;font-family:Inter,"Segoe UI",Arial,Helvetica,sans-serif!important
}
#scanner .scanner-shell{background:var(--scan-bg)!important;border-color:var(--scan-border)!important;color:var(--scan-text)!important;max-width:1120px!important;margin-inline:auto!important}
#scanner .scanner-top,#scanner .question-panel{background:var(--scan-bg)!important;color:var(--scan-text)!important}
#scanner .visual-panel{background:var(--scan-deep)!important;border-color:var(--scan-border)!important}
#scanner #scanTitle,#scanner #questionArea h1,#scanner #questionArea h2,#scanner #questionArea h3,#scanner .question-panel h1,#scanner .question-panel h2,#scanner .question-panel h3{
  color:var(--scan-text)!important;-webkit-text-fill-color:var(--scan-text)!important;opacity:1!important;text-shadow:none!important;filter:none!important
}
#scanner #scanCategory,#scanner #questionArea .eyebrow,#scanner .question-panel .eyebrow{
  color:var(--scan-accent)!important;-webkit-text-fill-color:var(--scan-accent)!important;opacity:1!important;font-size:12px!important;font-weight:900!important
}
#scanner #questionArea>p,#scanner #questionArea p:not(#validation),#scanner .question-panel>p,#scanner .question-help{
  color:var(--scan-soft)!important;-webkit-text-fill-color:var(--scan-soft)!important;opacity:1!important;font-size:15px!important;line-height:1.6!important
}
#scanner #stepLabel,#scanner #timeLabel,.scanner-top .progress-meta{color:#d9e8f2!important;-webkit-text-fill-color:#d9e8f2!important;opacity:1!important}
#scanner .progress{background:#15364e!important}#scanner .progress i{background:linear-gradient(90deg,var(--scan-accent),var(--scan-accent2))!important}
#scanner #questionArea .option,#scanner .option{
  min-height:60px!important;padding:16px 18px!important;border:1px solid var(--scan-border)!important;border-radius:13px!important;
  background:var(--scan-panel)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font:650 16px/1.35 Inter,"Segoe UI",Arial,sans-serif!important;opacity:1!important
}
#scanner #questionArea .option:hover,#scanner #questionArea .option.selected,#scanner .option:hover,#scanner .option.selected{
  background:var(--scan-panel-hover)!important;border-color:var(--scan-accent)!important;color:#fff!important;-webkit-text-fill-color:#fff!important
}
#scanner #nextBtn,#scanner .scanner-controls .btn.primary{
  background:var(--scan-accent)!important;border-color:var(--scan-accent)!important;color:#04131d!important;-webkit-text-fill-color:#04131d!important;font-weight:900!important;opacity:1!important
}
#scanner #prevBtn,#scanner .scanner-controls .btn.secondary{
  background:#102b44!important;border-color:#3a6b8d!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font-weight:900!important;opacity:1!important
}
#scanner .icon-btn,#scanner #closeScan{background:#102b44!important;border-color:#3a6b8d!important;color:#fff!important}
#scanner input,#scanner textarea,#scanner select{background:#0b2037!important;border-color:var(--scan-border)!important;color:#fff!important}
#scanner input::placeholder,#scanner textarea::placeholder{color:#89a4b8!important;opacity:1!important}
#scanner label{color:var(--scan-soft)!important}
#scanner svg text{fill:#f1f9ff!important}

/* ---------- 7. RESPONSIVE: ONE AUTHORITATIVE BLOCK ---------- */
@media(max-width:900px){
  .shell-desktop-nav,.shell-nav-cta{display:none!important}.shell-mobile-menu{display:block!important}
  .shell-nav{width:calc(100% - 24px);margin-top:10px;min-height:68px;padding:10px 12px}
  .shell-brand{max-width:calc(100% - 132px)}
  .shell-brand-media img{max-width:130px;max-height:48px}
  .shell-language{min-width:74px;width:74px}
  .shell-hero-dashboard,.shell-hero-bento,.shell-hero-tech,.shell-editorial-grid{grid-template-columns:1fr!important}
  .shell-service-grid{grid-template-columns:repeat(2,1fr)}
  .shell-process-grid{grid-template-columns:repeat(2,1fr)}
  .shell-dashboard-ui{justify-self:stretch;max-width:100%}
}
@media(max-width:650px){
  :root{--site-gutter:12px}
  .shell-nav{width:calc(100% - 20px);margin:8px auto 0;min-height:64px;padding:9px 10px;border-radius:14px}
  .shell-brand{max-width:calc(100% - 126px);gap:8px}
  .shell-brand-media{min-width:40px;min-height:40px}
  .shell-brand-media img{max-width:88px;max-height:40px;height:min(var(--theme-logo-height,44px),40px)}
  .shell-brand-copy b{max-width:126px;font-size:14px}.shell-brand-copy small{display:none}
  .shell-language{min-width:70px;width:70px;max-width:76px;font-size:12px}
  .shell-hero,.shell-hero-dashboard,.shell-hero-bento,.shell-hero-tech,.shell-hero-minimal,.shell-hero-bold,.shell-editorial-grid,.bento-mosaic,.dash-grid,.minimal-bottom,.bold-lower{
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto!important;width:100%!important;max-width:100%!important
  }
  .shell-hero{width:calc(100% - 24px)!important;margin:0 auto!important;min-height:0!important;height:auto!important;padding:54px 0 42px!important;gap:28px!important}
  .shell-hero>*{grid-column:1!important;grid-row:auto!important;width:100%!important;max-width:100%!important;transform:none!important}
  .shell-hero h1,.shell-editorial-grid h1,.shell-hero-minimal h1,.shell-hero-bold h1,.tech-copy h1,.bento-intro h1{
    width:100%!important;max-width:100%!important;margin:12px 0 18px!important;font-size:clamp(38px,11.5vw,52px)!important;
    line-height:.96!important;letter-spacing:-.045em!important;white-space:normal!important;overflow:visible!important;overflow-wrap:normal!important;word-break:normal!important
  }
  .shell-dashboard-ui,.bento-mosaic,.tech-console{width:100%!important;max-width:100%!important;transform:none!important;overflow:hidden!important}
  .dash-main,.dash-wide,.bento-a,.bento-b,.bento-c,.bento-d{grid-column:1!important;grid-row:auto!important}
  .shell-service-grid,.shell-process-grid,.shell-stats{grid-template-columns:1fr!important}
  .shell-capabilities,.shell-process{padding:56px 0}
  .shell-final{flex-direction:column;align-items:flex-start;padding:24px;margin-bottom:48px}
  .shell-hero-actions{display:grid;grid-template-columns:1fr;width:100%}.shell-hero-actions a{width:100%;min-height:48px}
  #scanner.scanner-section{padding:12px!important}
  #scanner .scanner-shell{width:100%!important;max-width:100%!important;border-radius:16px!important}
  #scanner .scanner-body{grid-template-columns:1fr!important}
  #scanner .visual-panel{min-height:220px!important;border-right:0!important;border-bottom:1px solid var(--scan-border)!important;padding:20px!important}
  #scanner .question-panel{padding:24px 16px 18px!important}
  #scanner #questionArea h3{font-size:26px!important}
  #scanner .options{grid-template-columns:1fr!important}
  #scanner .scanner-controls{position:sticky!important;bottom:0!important;z-index:4!important;margin:20px -16px -18px!important;padding:12px 16px!important;background:rgba(8,26,46,.97)!important;border-top:1px solid var(--scan-border)!important}
}
