/* C · Calibre (theme 1.3.0), port of home-canvas/project/Calibre.dc.html.
   .dzs      the services page in FR, DE, ES, PT (inc/dz-services.php, ax_dzs_render)
   .dzs-calc the round calculator: dial + panel. Also used on the EN and IT services sales pages as the `calc` section
             (.dzs-sx, inside the .f-root of inc/sales.php), so its rules never depend on .dzs.
   Without JavaScript everything is shown in its final state; the hidden states of the scroll reveal live under .dzs-mo,
   which assets/js/dz-services.js adds. The dial loops run only under .is-live (visible and tab active).
   prefers-reduced-motion: no animation, no transition, no loop. */

.dzs,.dzs-calc,.dzs-sx{--dzs-p:#022529;--dzs-w:#FCFCFC;--dzs-m:#B4EAC2;--dzs-v:#00C757;--dzs-vt:#007A3D;--dzs-tx:#00873B;--dzs-g:#4B6164;--dzs-ln:#DCE7E2;--dzs-ice:#F2F7F4;--dzs-e:cubic-bezier(.2,.8,.2,1);--dzs-fh:var(--ax-fh,Outfit,Manrope,system-ui,sans-serif);--dzs-fb:var(--ax-fb,Manrope,system-ui,-apple-system,"Segoe UI",sans-serif);--dzs-fa:var(--ax-fa,Fraunces,Georgia,serif)}
.dzs{font-family:var(--dzs-fb);font-size:16px;line-height:1.5;color:var(--dzs-p);background:var(--dzs-w);overflow-x:hidden;overflow-x:clip;-webkit-font-smoothing:antialiased}
.dzs *,.dzs *::before,.dzs *::after,.dzs-calc *,.dzs-calc *::before,.dzs-calc *::after{box-sizing:border-box}
.dzs .dzs-wrap{width:100%;max-width:calc(1200px + 2 * var(--ax-gut,40px));margin-inline:auto;padding-inline:var(--ax-gut,40px)}
.dzs a{color:var(--dzs-vt)}
.dzs a:hover{color:var(--dzs-p)}

/* type */
.dzs .dzs-eyebrow{margin:0;font-family:var(--dzs-fb);font-size:13px;font-weight:600;line-height:1.4;letter-spacing:.16em;text-transform:uppercase;color:var(--dzs-vt);display:flex;align-items:center;gap:12px}
.dzs .dzs-eyebrow::before{content:"";flex:none;width:28px;height:1px;background:currentColor}
.dzs .dzs-h1{margin:22px 0 0;font-family:var(--dzs-fh);font-weight:200;font-size:clamp(44px,5.6vw,80px);line-height:1.03;letter-spacing:-.025em;color:var(--dzs-p);overflow-wrap:break-word;hyphens:manual}
.dzs .dzs-h2{margin:18px 0 0;max-width:860px;font-family:var(--dzs-fh);font-weight:300;font-size:clamp(34px,4vw,54px);line-height:1.08;letter-spacing:-.018em;color:var(--dzs-p);overflow-wrap:break-word}
.dzs .dzs-h1 em,.dzs .dzs-h2 em{font-family:var(--dzs-fa);font-style:italic;font-weight:300;color:var(--dzs-tx)}
.dzs .dzs-lead{margin:26px 0 0;max-width:520px;font-size:18px;line-height:1.65;color:var(--dzs-g)}
.dzs .dzs-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.dzs .dzs-pill{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:10px 22px;border-radius:999px;font-family:var(--dzs-fb);font-size:15px;font-weight:700;line-height:1.2;text-align:center;text-decoration:none;transition:transform .35s var(--dzs-e),box-shadow .35s,background-color .25s,color .25s}
.dzs .dzs-pill--go{background:var(--dzs-v);color:var(--dzs-p)}
.dzs .dzs-pill--go:hover{color:var(--dzs-p);transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,199,87,.3)}
.dzs .dzs-pill--ghost{border:1px solid rgba(2,37,41,.25);color:var(--dzs-p)}
.dzs .dzs-pill--ghost:hover{background:var(--dzs-p);color:var(--dzs-w)}

/* hero */
.dzs .dzs-hero{position:relative;overflow:hidden;background:radial-gradient(50% 60% at 78% 42%,rgba(180,234,194,.45),rgba(252,252,252,0) 70%),var(--dzs-w)}
.dzs .dzs-hero-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:48px;padding-top:72px;padding-bottom:96px}
.dzs .dzs-instr{display:flex;justify-content:center;min-width:0}
@keyframes dzsFade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.dzs-hero .dzs-h1{animation:dzsFade 1.2s .05s both}
.dzs-hero .dzs-lead{animation:dzsFade 1.2s .2s both}
.dzs-hero .dzs-ctas{animation:dzsFade 1.2s .35s both}
.dzs-hero .dzs-instr{animation:dzsFade 1.4s .2s both}

/* the calculator */
.dzs-calc{position:relative;display:flex;flex-direction:column;align-items:center;gap:26px;width:100%;container-type:inline-size;font-family:var(--dzs-fb);color:var(--dzs-p)}
.dzs-calc .dzs-dial{position:relative;width:min(560px,100%);aspect-ratio:1/1;container-type:inline-size}
@supports not (aspect-ratio:1/1){.dzs-calc .dzs-dial::after{content:"";display:block;padding-top:100%}}
.dzs-calc .dzs-dial::before{content:"";position:absolute;inset:1.1%;border-radius:50%;box-shadow:0 40px 60px rgba(2,37,41,.14)}
.dzs-calc .dzs-l{position:absolute;left:0;top:0;width:100%;height:100%;max-width:none;display:block;overflow:visible}
.dzs-calc svg svg{max-width:none;overflow:visible}
.dzs-calc .dzs-l-spin{animation:dzsSpin 120s linear infinite;animation-play-state:paused}
.dzs-calc .dzs-l-sweep{transform:rotate(45deg);animation:dzsSweep 60s linear infinite;animation-play-state:paused}
.dzs-calc .dzs-dial.is-live .dzs-l-spin,.dzs-calc .dzs-dial.is-live .dzs-l-sweep{animation-play-state:running;will-change:transform}
@keyframes dzsSpin{to{transform:rotate(360deg)}}
@keyframes dzsSweep{from{transform:rotate(45deg)}to{transform:rotate(405deg)}}
.dzs-calc .dzs-arc{transition:stroke-dasharray 1s var(--dzs-e),stroke-dashoffset 1s var(--dzs-e)}
.dzs-calc .dzs-hand{transform-origin:300px 300px;transition:transform 1.1s cubic-bezier(.34,1.4,.5,1)}
.dzs-calc .dzs-read{position:absolute;left:50%;transform:translate(-50%,-50%);margin:0;display:flex;flex-direction:column;align-items:center;gap:4px;gap:.6cqw;line-height:1.1;text-align:center;white-space:nowrap;pointer-events:none}
.dzs-calc .dzs-read span{padding-left:.2em;font-size:clamp(10px,1.9vw,11px);font-size:clamp(10px,1.9cqw,12px);font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--dzs-g)}
.dzs-calc .dzs-read b{font-family:var(--dzs-fh);font-weight:300;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.dzs-calc .dzs-read--top{top:29.5%}
.dzs-calc .dzs-read--top b{font-size:clamp(17px,4vw,22px);font-size:max(17px,4cqw);color:var(--dzs-p)}
.dzs-calc .dzs-read--bot{top:73%}
.dzs-calc .dzs-read--bot b{font-size:clamp(24px,6.6vw,37px);font-size:max(24px,6.6cqw);color:var(--dzs-tx)}
.dzs-calc .dzs-panel{width:min(560px,100%);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px 22px;padding:24px 26px;border:1px solid var(--dzs-ln);border-radius:22px;background:#FFFFFF}
.dzs-calc .dzs-ctl{display:flex;flex-direction:column;gap:6px;min-width:0}
.dzs-calc .dzs-ctl-h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 10px}
.dzs-calc .dzs-ctl-h label{font-size:12px;font-weight:700;line-height:1.3;letter-spacing:.14em;text-transform:uppercase;color:var(--dzs-g);cursor:pointer}
.dzs-calc .dzs-ctl-h b{flex:none;font-family:var(--dzs-fh);font-size:22px;font-weight:300;line-height:1.1;letter-spacing:-.01em;color:var(--dzs-p);white-space:nowrap}
.dzs-calc .dzs-range{-webkit-appearance:none;appearance:none;display:block;width:100%;height:26px;margin:2px 0;padding:0;border:0;background:transparent;cursor:pointer;--f:0}
.dzs-calc .dzs-range::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(var(--dzs-v),var(--dzs-v)) 0 0/calc(11px + (100% - 22px) * var(--f)) 100% no-repeat,rgba(2,37,41,.14)}
.dzs-calc .dzs-range::-moz-range-track{height:4px;border-radius:4px;background:linear-gradient(var(--dzs-v),var(--dzs-v)) 0 0/calc(11px + (100% - 22px) * var(--f)) 100% no-repeat,rgba(2,37,41,.14)}
.dzs-calc .dzs-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;margin-top:-9px;border-radius:50%;background:#FFFFFF;border:2px solid var(--dzs-v);box-shadow:0 4px 12px rgba(2,37,41,.18);transition:transform .2s,box-shadow .2s}
.dzs-calc .dzs-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#FFFFFF;border:2px solid var(--dzs-v);box-shadow:0 4px 12px rgba(2,37,41,.18)}
.dzs-calc .dzs-range:hover::-webkit-slider-thumb{transform:scale(1.15)}
.dzs-calc .dzs-range:focus{outline:none}
.dzs-calc .dzs-range:focus-visible{outline:2px solid var(--dzs-v);outline-offset:3px;border-radius:8px}
.dzs-calc .dzs-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 5px rgba(0,199,87,.25),0 4px 12px rgba(2,37,41,.18)}
.dzs-calc .dzs-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 5px rgba(0,199,87,.25),0 4px 12px rgba(2,37,41,.18)}
.dzs-calc .dzs-seg{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 16px}
.dzs-calc .dzs-seg-l{font-size:12px;font-weight:700;line-height:1.3;letter-spacing:.14em;text-transform:uppercase;color:var(--dzs-g)}
.dzs-calc .dzs-seg-g{display:inline-flex;padding:4px;border-radius:999px;background:var(--dzs-ice);border:1px solid var(--dzs-ln)}
.dzs-calc .dzs-seg-b{position:relative;display:inline-flex;margin:0;cursor:pointer}
.dzs-calc .dzs-seg-b input{position:absolute;left:0;top:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.dzs-calc .dzs-seg-b span{display:inline-flex;align-items:center;min-height:38px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:600;line-height:1.2;color:var(--dzs-g);transition:background-color .3s,color .3s,box-shadow .3s}
.dzs-calc .dzs-seg-b:hover span{color:var(--dzs-p)}
.dzs-calc .dzs-seg-b input:checked+span{background:#FFFFFF;color:var(--dzs-p);box-shadow:0 2px 8px rgba(2,37,41,.12)}
.dzs-calc .dzs-seg-b input:focus-visible+span{outline:2px solid var(--dzs-v);outline-offset:2px}
.dzs-calc .dzs-note{grid-column:1/-1;margin:0;font-size:12px;line-height:1.55;color:var(--dzs-g)}
.dzs-calc .dzs-note b{font-weight:700;color:var(--dzs-p);font-variant-numeric:tabular-nums}
.dzs-calc .dzs-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
/* small dials and narrow panels (the dial and the calculator are size containers) */
@container (max-width:420px){.dzs-calc .dzs-read span{padding-left:.1em;font-size:10px;letter-spacing:.1em}}
@container (max-width:539px){.dzs-calc .dzs-panel{grid-template-columns:minmax(0,1fr);padding:20px 22px}}

/* how we work */
.dzs .dzs-sec{padding:120px 0}
.dzs .dzs-steps{list-style:none;margin:60px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.dzs .dzs-step{display:flex;flex-direction:column;gap:14px;margin:0;padding:30px 26px;border:1px solid var(--dzs-ln);border-radius:22px;background:#FFFFFF;transition:transform .5s var(--dzs-e),box-shadow .5s,border-color .5s}
.dzs .dzs-step:hover{transform:translateY(-5px);box-shadow:0 24px 50px rgba(2,37,41,.08);border-color:rgba(0,199,87,.4)}
.dzs .dzs-ring{display:block;flex:none;width:84px;height:84px}
.dzs .dzs-step h3{margin:0;font-family:var(--dzs-fh);font-weight:400;font-size:24px;line-height:1.25;letter-spacing:0;color:var(--dzs-p)}
.dzs .dzs-step p{margin:0;font-size:15px;line-height:1.65;color:var(--dzs-g)}

/* services */
.dzs .dzs-band{background:var(--dzs-ice);border-top:1px solid var(--dzs-ln);border-bottom:1px solid var(--dzs-ln)}
.dzs .dzs-specs{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(2,37,41,.16)}
.dzs .dzs-spec{position:relative;display:flex;flex-direction:column;gap:12px;margin:0;padding:30px 26px 34px 0;border-bottom:1px solid rgba(2,37,41,.16)}
.dzs .dzs-spec-n{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 12px;margin:0;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:12px;line-height:1.5;letter-spacing:.06em;color:var(--dzs-vt)}
.dzs .dzs-spec-tag{color:var(--dzs-g)}
.dzs .dzs-spec h3{margin:0;font-family:var(--dzs-fh);font-weight:300;font-size:28px;line-height:1.2;letter-spacing:-.01em;color:var(--dzs-p)}
.dzs .dzs-spec h3 a{color:inherit;text-decoration:none;transition:color .25s}
.dzs .dzs-spec h3 a::after{content:"";position:absolute;inset:0}
.dzs .dzs-spec--link:hover h3 a{color:var(--dzs-vt)}
.dzs .dzs-spec-d{margin:0;max-width:300px;font-size:15px;line-height:1.65;color:var(--dzs-g)}
.dzs .dzs-spec-f{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:auto 0 0;padding-top:4px}
.dzs .dzs-spec-f small{font-size:12px;font-weight:700;line-height:1.4;letter-spacing:.12em;text-transform:uppercase;color:var(--dzs-p)}
.dzs .dzs-arrow{flex:none;display:block;color:var(--dzs-vt);transition:transform .35s var(--dzs-e)}
.dzs .dzs-spec--link:hover .dzs-arrow{transform:translateX(4px)}
.dzs .dzs-specs-note{margin:30px 0 0;max-width:760px;font-size:15px;line-height:1.65;color:var(--dzs-g)}

/* FAQ */
.dzs .dzs-faq-g{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:56px;align-items:start}
.dzs .dzs-faq-sub{margin:22px 0 0;font-size:16px;line-height:1.6;color:var(--dzs-g)}
.dzs .dzs-faq-sub a{font-weight:700}
.dzs .dzs-faq-l{border-top:1px solid var(--dzs-ln)}
.dzs .dzs-q{margin:0;border-bottom:1px solid var(--dzs-ln)}
.dzs .dzs-q summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;font-family:var(--dzs-fh);font-size:20px;font-weight:400;line-height:1.35;color:var(--dzs-p);cursor:pointer;list-style:none;transition:color .25s}
.dzs .dzs-q summary::-webkit-details-marker{display:none}
.dzs .dzs-q summary:hover{color:var(--dzs-vt)}
.dzs .dzs-q summary:focus-visible{outline:2px solid var(--dzs-v);outline-offset:4px;border-radius:6px}
.dzs .dzs-q summary i{position:relative;flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--dzs-ln);background:#FFFFFF;transition:transform .35s var(--dzs-e),background-color .3s,border-color .3s}
.dzs .dzs-q summary i::before,.dzs .dzs-q summary i::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.5px;margin:-.75px 0 0 -5.5px;border-radius:1px;background:var(--dzs-vt)}
.dzs .dzs-q summary i::after{transform:rotate(90deg)}
.dzs .dzs-q[open] summary i{transform:rotate(45deg);background:var(--dzs-m);border-color:var(--dzs-m)}
.dzs .dzs-q p{margin:0;padding:0 48px 24px 0;font-size:16px;line-height:1.7;color:var(--dzs-g)}

/* closing call to action */
.dzs .dzs-cta{padding:110px 0;text-align:center;color:var(--dzs-w);background:radial-gradient(60% 90% at 50% 0%,rgba(0,199,87,.22),rgba(2,37,41,0) 70%),var(--dzs-p)}
.dzs .dzs-medal{width:120px;height:120px;margin:0 auto;border-radius:50%;overflow:hidden;box-shadow:0 0 0 8px rgba(180,234,194,.08),0 0 0 1px rgba(180,234,194,.25),0 30px 60px rgba(0,0,0,.4)}
.dzs .dzs-medal svg{display:block;width:100%;height:100%;max-width:none}
.dzs .dzs-cta h2{margin:38px auto 0;max-width:820px;font-family:var(--dzs-fh);font-weight:200;font-size:clamp(40px,5vw,70px);line-height:1.04;letter-spacing:-.025em;color:var(--dzs-w);overflow-wrap:break-word}
.dzs .dzs-cta h2 em{font-family:var(--dzs-fa);font-style:italic;font-weight:300;color:var(--dzs-v)}
.dzs .dzs-cta p{margin:20px auto 0;max-width:520px;font-size:17px;line-height:1.65;color:#C9E3D3}
.dzs .dzs-cta .dzs-ctas{justify-content:center}

/* the calculator as a sales-page section (EN, IT) */
.dzs-sx{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:64px;align-items:center}
.dzs-sx .f-p{max-width:520px}
.dzs-sx-i{position:relative;display:flex;justify-content:center;min-width:0}
.dzs-sx-i::before{content:"";position:absolute;left:-8%;right:-8%;top:-10%;bottom:30%;background:radial-gradient(closest-side,rgba(180,234,194,.55),rgba(180,234,194,0));pointer-events:none}

/* reveal on scroll (hidden states only under .dzs-mo, added by the script) */
.dzs-mo [data-dzs-rv]{opacity:0;translate:0 40px;transition:opacity .8s var(--dzs-e) var(--d,0s),translate .8s var(--dzs-e) var(--d,0s)}
.dzs-mo [data-dzs-rv].is-in{opacity:1;translate:none}
.dzs-mo .dzs-step[data-dzs-rv]{transition:opacity .8s var(--dzs-e) var(--d,0s),translate .8s var(--dzs-e) var(--d,0s),transform .5s var(--dzs-e),box-shadow .5s,border-color .5s}
.dzs-mo .dzs-ring-a{stroke-dasharray:0 100;transition:stroke-dasharray .8s var(--dzs-e) calc(var(--d,0s) + .1s)}
.dzs-mo .is-in .dzs-ring-a{stroke-dasharray:var(--fill) 100}

@media (max-width:1100px){
  .dzs .dzs-steps,.dzs .dzs-specs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dzs .dzs-spec:nth-child(odd){padding-right:36px}
  .dzs .dzs-spec-d{max-width:380px}
}
@media (max-width:1000px){
  .dzs-sx{grid-template-columns:minmax(0,1fr);gap:48px}
}
@media (max-width:980px){
  .dzs .dzs-hero-g{grid-template-columns:minmax(0,1fr);gap:56px;padding-top:48px;padding-bottom:80px}
  .dzs .dzs-faq-g{grid-template-columns:minmax(0,1fr);gap:36px}
}
@media (max-width:640px){
  .dzs .dzs-steps,.dzs .dzs-specs{grid-template-columns:minmax(0,1fr)}
  .dzs .dzs-spec:nth-child(odd){padding-right:0}
}
@media (max-width:560px){
  .dzs-calc .dzs-panel{grid-template-columns:minmax(0,1fr);padding:20px}
  .dzs .dzs-hero-g{gap:44px;padding-top:36px;padding-bottom:64px}
  .dzs .dzs-sec{padding:84px 0}
  .dzs .dzs-cta{padding:84px 0}
  .dzs .dzs-steps{margin-top:44px}
  .dzs .dzs-specs{margin-top:44px}
  .dzs .dzs-spec{padding-right:0}
  .dzs .dzs-spec-d{max-width:none}
  .dzs .dzs-q summary{font-size:18px}
  .dzs .dzs-q p{padding-right:0}
}
@media (prefers-reduced-motion:reduce){
  .dzs *,.dzs *::before,.dzs *::after,.dzs-calc *,.dzs-calc *::before,.dzs-calc *::after{animation:none!important;transition:none!important}
  .dzs-mo [data-dzs-rv]{opacity:1;translate:none}
  .dzs-mo .dzs-ring-a{stroke-dasharray:var(--fill) 100}
}