/* Phone and tablet menu (2026-10-26, common/menu_sheet.twig + /js/burger.js): black sheet right of the left rail (left set by the script),
   ink on paper in body.light; square, no fills, no colour; lines rise in one after another. Above 1200px nothing changes. */
@media screen and (max-width:1199px){
  html.dzb-ready #nav,html.dzb-ready #header .close-bg{display:none!important}
}
@media screen and (min-width:1200px){
  .dzb{display:none!important}
}
html.dzb-lock,html.dzb-lock body{overflow:hidden;overscroll-behavior:none}
/* text in the site's muted white (owner: nothing glaring), the page you are on told by its short rule */
.dzb{--dzb-bg:#0d0d0d;--dzb-ink:rgba(255,255,255,.8);--dzb-mid:rgba(255,255,255,.8);--dzb-dim:#939393;--dzb-low:#646464;--dzb-line:#2a2a2a;
  position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;background:var(--dzb-bg);color:var(--dzb-ink);
  opacity:0;visibility:hidden;transition:opacity .35s cubic-bezier(.2,.7,.2,1),visibility 0s .35s;-webkit-tap-highlight-color:transparent}
.dzb[hidden]{display:none}
.dzb.is-open{opacity:1;visibility:visible;transition:opacity .45s cubic-bezier(.2,.7,.2,1)}
.light .dzb{--dzb-bg:#f0f0f0;--dzb-ink:#151515;--dzb-mid:#151515;--dzb-dim:#646464;--dzb-low:#939393;--dzb-line:#d6d6d6}
.dzb :where(a:not(.btn-primary),button){color:inherit;text-decoration:none;font:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;-webkit-appearance:none;appearance:none}
/* keyboard focus as a thin underline, never a box */
.dzb :focus{outline:none}
.dzb :focus-visible{outline:none;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
.dzb .dzb-search:focus-within{border-color:var(--dzb-ink)}
/* while the menu is open the left rail takes its paper, so a hero photo under the rail never shows through */
html.dzb-lock #color{background:#0d0d0d;transition:background-color .35s}
html.dzb-lock body.light #color,html.dzb-lock .light #color{background:#f0f0f0}

/* top bar: the cross on the burger's own place (set by burger.js) */
.dzb-bar{position:relative;flex:none;height:66px;display:flex;align-items:center;padding:0 6vw}
.dzb-close{position:absolute;right:calc(6vw - 11px);top:12px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:var(--dzb-ink)}
.dzb-close svg{transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.dzb-close:hover svg{transform:rotate(90deg)}

.dzb-body{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;display:flex;flex-direction:column;padding:6px 6vw calc(28px + env(safe-area-inset-bottom))}

/* search: one hairline field */
.dzb-search{display:flex;align-items:center;gap:14px;padding:0 0 12px;border-bottom:1px solid var(--dzb-line);color:var(--dzb-dim);transition:border-color .3s}
.dzb-search:focus-within{border-color:var(--dzb-ink)}
.dzb-search svg{flex:none}
.dzb-search input{flex:1;min-width:0;height:32px;background:none;border:0;outline:0;padding:0;font:inherit;font-size:16px;color:var(--dzb-ink);border-radius:0;-webkit-appearance:none;appearance:none}
.dzb-search input::-webkit-search-cancel-button{display:none}
.dzb-search input::placeholder{color:var(--dzb-low);opacity:1}
.dzb-go{flex:none;font-size:11px!important;letter-spacing:.08em;text-transform:uppercase;color:var(--dzb-dim)!important;opacity:0;pointer-events:none;transition:opacity .3s}
.dzb-search:focus-within .dzb-go{opacity:1;pointer-events:auto}

/* sections: large light names, the page you are on marked by a short rule */
.dzb-nav{margin:30px 0 0}
.dzb-list{list-style:none;margin:0;padding:0}
.dzb-link{position:relative;display:flex;align-items:center;width:100%;min-height:52px;padding:4px 0;font-size:34px!important;line-height:1.1;font-weight:400;letter-spacing:-.02em;color:var(--dzb-mid)!important;text-align:left;transition:color .3s,padding .45s cubic-bezier(.2,.7,.2,1)}
.dzb-link:hover,.dzb-link:active{color:var(--dzb-ink)!important}
.dzb-link.is-on{color:var(--dzb-ink)!important;padding-left:30px}
.dzb-link.is-on:before{content:"";position:absolute;left:0;top:50%;width:18px;border-top:1px solid currentColor}
.dzb-n{position:relative;top:-.95em;margin-left:.3em;font-size:12px;line-height:0;font-weight:500;letter-spacing:0;color:var(--dzb-ink)}

/* Services opens in place: all services, then the three groups */
.dzb-plus{position:relative;flex:none;width:14px;height:14px;margin-left:auto}
.dzb-plus:before,.dzb-plus:after{content:"";position:absolute;left:0;top:50%;width:100%;border-top:1px solid currentColor;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.dzb-plus:after{transform:rotate(90deg)}
.dzb-tog[aria-expanded="true"] .dzb-plus:after{transform:rotate(0)}
.dzb-tog[aria-expanded="true"]{color:var(--dzb-ink)!important}
.dzb-svc{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.2,.7,.2,1)}
.dzb-svc>.dzb-svc-in{min-height:0;overflow:hidden}
.dzb-has.is-open .dzb-svc{grid-template-rows:1fr}
.dzb-svc-in{display:grid;gap:30px;padding:0}
.dzb-has.is-open .dzb-svc-in{padding:18px 0 30px}
.dzb-all{display:inline-flex;align-items:center;gap:14px;min-height:40px;font-size:13px!important;letter-spacing:.08em;text-transform:uppercase;color:var(--dzb-ink)!important}
.dzb-all svg{transition:transform .3s}
.dzb-all:hover svg{transform:translateX(4px)}
.dzb-grp-t{margin:0 0 6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--dzb-low)}
.dzb-grp ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:0 24px}
.dzb-grp a{display:block;padding:9px 0;font-size:21px!important;line-height:1.3;letter-spacing:-.01em;color:var(--dzb-dim)!important;transition:color .3s}
.dzb-grp a:hover,.dzb-grp a:active{color:var(--dzb-ink)!important}

/* the foot: contacts, the request button, languages; it sits at the bottom on tall screens */
.dzb-foot{margin-top:auto;padding-top:56px}
.dzb-cap{margin:0 0 14px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--dzb-low)}
.dzb-con{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.dzb-con a{display:inline-flex;align-items:baseline;gap:14px;min-height:40px;padding:4px 0;font-size:20px!important;line-height:1.3;letter-spacing:-.005em;color:var(--dzb-mid)!important;transition:color .3s}
/* the request button is the site's own .btn-primary (thin frame drawn like a hard pencil), only placed here */
.dzb-cta{margin:34px 0 0}
.dzb-cta .btn-primary .text{margin:0}
.dzb-con a:hover,.dzb-con a:active,.dzb-con .dzb-mail{color:var(--dzb-ink)!important}
.dzb-tel{font-variant-numeric:tabular-nums}
.dzb-lbl{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--dzb-low)}
.dzb-row{display:flex;align-items:center;margin:36px 0 0}
.dzb-langs{display:flex;gap:4px;margin-left:-10px}
.dzb-lang{min-width:44px;height:40px;padding:0 10px!important;font-size:14px!important;font-weight:500;letter-spacing:.04em;color:var(--dzb-low)!important;transition:color .3s}
.dzb-lang:hover{color:var(--dzb-ink)!important}
.dzb-lang.is-on{color:var(--dzb-ink)!important;text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}

/* entrance: each line rises in turn (index set by burger.js) */
.dzb-r{opacity:0;transform:translateY(16px);transition:opacity .2s,transform .2s}
.dzb.is-open .dzb-r{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.2,.7,.2,1) calc(var(--i,0) * 45ms + 80ms),transform .8s cubic-bezier(.2,.7,.2,1) calc(var(--i,0) * 45ms + 80ms)}

/* tablets: wider rhythm, services in two columns */
@media screen and (min-width:600px){
  .dzb-body{padding-left:calc(6vw + 4px);padding-right:6vw;max-width:none}
  .dzb-nav,.dzb-foot,.dzb-search{max-width:620px}
  .dzb-link{font-size:44px!important;min-height:64px}
  .dzb-grp ul{grid-template-columns:1fr 1fr}
  .dzb-grp a{font-size:22px!important}
}
/* short phones: tighter list */
@media screen and (max-height:700px) and (max-width:599px){
  .dzb-nav{margin-top:22px}
  .dzb-link{font-size:30px!important;min-height:46px}
  .dzb-foot{padding-top:44px}
}
/* the narrowest phones (320): the e-mail stays on one line */
@media screen and (max-width:359px){
  .dzb-con a{font-size:17px!important}
}
@media (prefers-reduced-motion:reduce){
  .dzb,.dzb.is-open,.dzb-r,.dzb.is-open .dzb-r,.dzb-svc,.dzb-link{transition:none!important}
  .dzb-r{transform:none}
}

/* header below 1200px (2026-10-26): the old scripts gave it a white bar only after a reload in the light theme and never in the
   dark one, so the burger sat on the text when scrolled. Now: clear at the top, the site's header tint (.8 black or white, the search panel's too) once the page moves or search opens. */
@media screen and (max-width:1199px){
  html.dzb-ready #header,html.dzb-ready #header.white,html.dzb-ready #header.dark{background:transparent}
  html.dzb-ready.dzb-scrolled #header{background:rgba(0,0,0,.8)}
  html.dzb-ready.dzb-scrolled .light #header,html.dzb-ready.dzb-scrolled body.light #header{background:rgba(255,255,255,.8)}
}

/* the left rail while the menu is open (2026-10-26): its icons follow the menu paper, not the photo under the rail. The site paints them
   white unless the rail is .sidebar.white (a light area under it), so over a dark hero in the light theme, or after switching the theme
   from the rail with the menu open, they stayed white on the light paper (or black on the dark one). */
html.dzb-lock body.light #color .logo path,html.dzb-lock body.light #color .change-holder path{fill:#151515}
html.dzb-lock body.light #color .change-holder,html.dzb-lock body.light #color .socials li{color:#151515}
html.dzb-lock body.light #color .change-theme{border-color:rgba(0,0,0,.7)}
html.dzb-lock body.light #color .change-theme:after,html.dzb-lock body.light #color .socials li:before{background:#151515}
html.dzb-lock body:not(.light) #color .logo path,html.dzb-lock body:not(.light) #color .change-holder path{fill:#fff}
html.dzb-lock body:not(.light) #color .change-holder,html.dzb-lock body:not(.light) #color .socials li{color:#fff}
html.dzb-lock body:not(.light) #color .change-theme{border-color:rgba(255,255,255,.7)}
html.dzb-lock body:not(.light) #color .change-theme:after,html.dzb-lock body:not(.light) #color .socials li:before{background:#fff}