/* TEZ ERP — Manufacturing (redesign)
   Idea: follow the material. Every stage carries its material-state colour.
   Scroll depth: sticky section nav + progress line, tabs, accordions and short sections.
   --mf-top is the height of the site header that the section nav sits under. */
.mfPage{--ink:#0A1B33;--body:#48586b;--az:#1E5BD8;--az2:#0F3FA8;--mist:#EEF3FA;--line:#D3DDEA;--flag:#D9531E;--mf-top:76px;
  --rm:#5B6B7F;--sh:#C62A22;--av:#0B7F77;--wip:#E8A317;--sfg:#2F6FE0;--fg:#238042;--rej:#8B1A1A;--ext:var(--ink);
  --fd:var(--font-display,sans-serif);
  font:400 16.5px/1.6 var(--font-body,sans-serif);color:var(--ink);background:#fff;overflow-x:clip}
.mfPage *{box-sizing:border-box}
.mfPage h1,.mfPage h2,.mfPage h3{font-family:var(--fd);margin:0;letter-spacing:-.03em;line-height:1.06}
.mfPage h2{font-size:clamp(27px,3.3vw,42px);font-weight:600;max-width:24ch;margin-bottom:16px}
.mfPage h3{font-size:clamp(20px,2vw,25px);font-weight:600;margin:34px 0 12px}
.mfPage p{margin:0 0 14px;max-width:64ch;color:var(--body)}
.mf-wrap{max-width:1300px;margin:0 auto;padding:0 clamp(20px,2.5vw,36px)}
.mf-sec{padding:clamp(40px,5vw,68px) 0;scroll-margin-top:calc(var(--mf-top) + 52px)}
.mf-band{background:var(--mist)}
.mfPage a:focus-visible,.mfPage button:focus-visible,.mfPage summary:focus-visible,.mfPage input:focus-visible{outline:3px solid var(--flag);outline-offset:3px}

/* material-state colours, used the same way everywhere */
.c-rm{--c:var(--rm)}.c-sh{--c:var(--sh)}.c-av{--c:var(--av)}.c-wip{--c:var(--wip);--t:var(--ink)}.c-sfg{--c:var(--sfg)}.c-fg{--c:var(--fg)}.c-rej{--c:var(--rej)}.c-ext{--c:var(--ext)}
.mf-leg,.mf-stat,.mf-xs .mf-st{list-style:none}
.mf-leg{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 0;padding:0}
.mf-leg li,.mf-st,.mf-stat li{background:var(--c);color:var(--t,#fff);font-size:12.5px;font-weight:600;padding:4px 10px;border-radius:5px;display:inline-block}

/* hero */
.mf-hero{padding:clamp(36px,5vw,72px) 0 clamp(32px,4vw,52px);background:linear-gradient(180deg,var(--mist),#fff)}
.mf-hg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.18fr);gap:clamp(24px,3.5vw,48px);align-items:center}
.mf-k{font-weight:600;font-size:14px;color:var(--az2)!important;margin-bottom:14px!important}
.mfPage h1{font-size:clamp(38px,5.6vw,76px);font-weight:700;letter-spacing:-.05em;line-height:.96}
.mfPage h1 span{display:block;color:var(--az)}
.mfPage .mf-lead{font:600 clamp(19px,2vw,24px)/1.3 var(--fd);letter-spacing:-.02em;color:var(--ink);margin:20px 0 12px}
.mf-keys{font-size:13px;color:#6b7a8c!important;margin-top:20px!important}
.mf-fig{margin:0;border:1.5px solid var(--ink);border-radius:12px;box-shadow:8px 8px 0 var(--ink);overflow:hidden;background:var(--mist)}
.mf-fig img{display:block;width:100%;height:clamp(320px,40vw,540px);object-fit:cover;object-position:center top}
.mf-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.mf-btn{display:inline-flex;padding:14px 24px;border-radius:6px;background:var(--az);color:#fff!important;font-weight:600;font-size:15px;text-decoration:none;transition:background .2s}
.mf-btn:hover{background:var(--az2)}
.mf-btn--g{background:transparent;color:var(--ink)!important;box-shadow:inset 0 0 0 1.5px var(--ink)}.mf-btn--g:hover{background:var(--ink);color:#fff!important}
.mf-btn--w{background:#fff;color:var(--ink)!important}.mf-btn--w:hover{background:var(--mist)}
.mf-btn--l{background:transparent;box-shadow:inset 0 0 0 1.5px #fff}.mf-btn--l:hover{background:rgba(255,255,255,.14)}

/* sticky section nav with progress line */
.mf-nav{position:sticky;top:var(--mf-top);z-index:20;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(6px)}
.mf-navin{display:flex;justify-content:center;gap:2px;overflow-x:auto;scrollbar-width:none;max-width:1300px;margin:0 auto;padding:0 clamp(16px,2.5vw,36px)}
.mf-navin::-webkit-scrollbar{display:none}
.mf-navin a{flex:0 0 auto;padding:14px 13px;font-size:14px;font-weight:500;color:var(--body);text-decoration:none;border-bottom:3px solid transparent;margin-bottom:-1px}
.mf-navin a:hover{color:var(--ink)}
.mf-navin a.on{color:var(--ink);font-weight:600;border-color:var(--az)}
.mf-bar{position:absolute;left:0;bottom:-1px;height:3px;width:100%;background:var(--flag);transform:scaleX(0);transform-origin:0 50%}
@media(max-width:1100px){.mf-navin{justify-content:flex-start}}

/* lists, chips, cards */
.mf-q{list-style:none;margin:0;padding:0;columns:2;column-gap:40px}
.mf-q li{break-inside:avoid;padding:11px 0 11px 30px;border-bottom:1px solid var(--line);font:500 18px/1.3 var(--fd);letter-spacing:-.015em;position:relative}
.mf-q li::before{content:"?";position:absolute;left:0;top:11px;width:20px;height:20px;border-radius:50%;background:var(--az);color:#fff;font:700 12px/20px var(--fd);text-align:center}
.mf-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
.mf-two h3{margin-top:0}
.mfPage .mf-cap{font-weight:600;color:var(--ink);margin:22px 0 10px}
.mf-chips{display:flex;flex-wrap:wrap;gap:7px;list-style:none;margin:0 0 12px;padding:0}
.mf-chips li{background:#fff;border:1px solid var(--line);border-radius:6px;padding:5px 11px;font-size:14px}
.mf-band .mf-chips li{border-color:#c3d0e2}
.mf-chips--grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 10px}
.mf-chips--grid li{margin:0;display:flex;align-items:center;line-height:1.35;padding:8px 12px}
.mf-sh li{border-left:3px solid var(--sh)}.mf-ex li{border-left:3px solid var(--ext)}
.mf-stat li,.mf-chips.mf-stat li{display:inline-block;font-size:13px;font-weight:600;padding:5px 12px;border-radius:6px;border:none}
.mf-stat li.c-sh,.mf-chips.mf-stat li.c-sh{background:var(--sh);color:#fff}
.mf-stat li.c-wip,.mf-chips.mf-stat li.c-wip{background:var(--wip);color:var(--ink)}
.mf-stat li.c-fg,.mf-chips.mf-stat li.c-fg{background:var(--fg);color:#fff}
.mf-dl{margin:14px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.mf-dl>div{padding:13px 0;border-top:1px solid var(--line)}
.mf-dl>.mf-dl-pad,
.mf-dl:not(.mf-4):not(.mf-3):has(> div:last-child:nth-child(odd))::after{content:"";display:block;border-top:1px solid var(--line);height:0;padding:0;align-self:start}
.mf-dl dt{font:600 18px/1.2 var(--fd);letter-spacing:-.02em;margin-bottom:4px}
.mf-dl dd{margin:0;color:var(--body);font-size:15px}
.mf-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:0 22px}.mf-3{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 22px}
.mf-4>div,.mf-3>div{border-top:3px solid var(--az)}
.mfPage .mf-pull{font:600 clamp(19px,2vw,24px)/1.25 var(--fd);letter-spacing:-.02em;color:var(--ink);border-left:3px solid var(--az);padding-left:16px;margin:22px 0}
.mfPage .mf-note{font-style:italic;font-size:14.5px}
.mf-call{margin:28px 0 8px;padding:20px 24px;background:#fff;border:1.5px solid var(--ink);border-radius:10px}
.mf-call h3{margin:0 0 10px;font-size:22px}
.mfPage .mf-h4{font:600 20px var(--fd);color:var(--ink)}

/* accordion */
.mf-acc{border-top:1.5px solid var(--ink);margin-top:14px}
.mf-acc:last-of-type{border-bottom:1.5px solid var(--ink)}
.mf-acc summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;padding:16px 0;font:600 clamp(18px,2vw,23px)/1.2 var(--fd);letter-spacing:-.02em}
.mf-acc summary::-webkit-details-marker{display:none}
.mf-acc summary::after{content:"+";color:var(--az);font-size:26px;line-height:1;transition:transform .2s}
.mf-acc[open] summary::after{transform:rotate(45deg)}
.mf-in{padding:0 0 18px}

/* tables */
.mf-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:#fff;margin:12px 0 10px}
.mfPage table{width:100%;min-width:640px;border-collapse:collapse;font-size:14.5px}
.mfPage th{background:var(--ink);color:#fff;text-align:left;padding:12px 16px;font-weight:600}
.mfPage td{padding:11px 16px;border-top:1px solid var(--line);color:var(--body);vertical-align:top}
.mfPage td:first-child{font-weight:600;color:var(--ink)}
.mf-cmp td:nth-child(2){border-left:3px solid var(--az)}.mf-cmp td:nth-child(3){border-left:3px solid var(--sfg)}
.mfPage.js .mf-cmp tr.x{display:none}.mfPage.js .mf-wrap.open .mf-cmp tr.x{display:table-row}
.mf-more{font:600 14.5px sans-serif;padding:10px 18px;border-radius:6px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.mf-more:hover{background:var(--ink);color:#fff}
.mfPage:not(.js) .mf-more{display:none}

/* tabs */
.mf-tabs{margin-top:16px;border:1.5px solid var(--ink);border-radius:12px;background:#fff;overflow:hidden}
.mf-tl{display:flex;overflow-x:auto;border-bottom:1.5px solid var(--ink);scrollbar-width:none}
.mf-tl button{flex:1 0 auto;font:600 15px sans-serif;padding:14px 20px;border:0;border-right:1px solid var(--line);background:transparent;color:var(--body);cursor:pointer;white-space:nowrap}
.mf-tl button:last-child{border-right:0}.mf-tl button:hover{background:var(--mist)}
.mf-tl button[aria-selected=true]{background:var(--ink);color:#fff}
.mf-tp{padding:clamp(18px,3vw,32px)}.mf-tp h3:first-child{margin-top:0}
.mfPage.js .mf-pn{display:none}.mfPage.js .mf-pn.on{display:block}
.mf-ext .mf-tl button[aria-selected=true]{background:var(--ext)}.mf-ext{border-color:var(--ext)}.mf-ext .mf-tl{border-color:var(--ext)}
.mf-tog{border-radius:10px}

/* chains and flow strip */
.mf-ch{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-wrap:wrap;align-items:center;row-gap:10px}
.mf-ch li{position:relative;background:var(--ink);color:#fff;border-radius:6px;padding:6px 14px;font-size:13.5px;font-weight:600;margin-right:26px;line-height:1.4}
.mf-ch li:last-child{margin-right:0}
.mf-ch li:not(:last-child)::after{content:"→";position:absolute;right:-21px;top:50%;transform:translateY(-50%);width:18px;text-align:center;color:var(--body);font:600 15px sans-serif;pointer-events:none}
.mf-ch.c-seq li{background:var(--ink)}
.mf-flow{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.mf-flow li a{display:block;padding:7px 14px;border-radius:99px;font:600 14px var(--fd);color:var(--body);text-decoration:none;box-shadow:inset 0 0 0 1.5px var(--line)}
.mf-flow li:not(:last-child)::after{content:"→";color:var(--body);margin-left:8px;font-weight:600}
.mf-flow li{display:flex;align-items:center}
.mf-flow li.on a{background:var(--ink);color:#fff;box-shadow:none}

/* material transformation */
.mf-xf{margin:14px 0 6px}
.mf-xr{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.mf-xr i{font-style:normal;color:var(--body);font-weight:600}
.mf-xr button{font:600 15px var(--fd);padding:12px 18px;border-radius:8px;border:2px solid var(--c);background:#fff;color:var(--c);cursor:pointer;transition:background .25s,color .25s}
.mf-xr button.c-wip{color:#8a5b00}
.mf-xr button.done{background:var(--c);color:var(--t,#fff);opacity:.72}
.mf-xr button.on{background:var(--c);color:var(--t,#fff);opacity:1;box-shadow:0 0 0 4px rgba(10,27,51,.12)}
.mf-xb{margin:14px 0 10px;padding:16px 20px;border-left:5px solid var(--c);background:#fff;border-radius:0 10px 10px 0;display:flex;flex-direction:column;gap:4px;min-height:132px}
.mf-xb b{font:600 20px var(--fd);letter-spacing:-.02em}.mf-xb span{color:var(--body);font-size:15.5px}
.mfPage .mf-xs{font-size:13.5px;max-width:none}.mf-xs .mf-st{margin:0 4px 4px 0}

/* traceability */
.mf-tr{list-style:none;margin:20px 0 6px;padding:0;display:grid;grid-template-columns:repeat(7,1fr);gap:0}
.mf-tr li{position:relative;padding:16px 8px;text-align:center;background:var(--c);color:var(--t,#fff);font:600 14px/1.2 var(--fd);margin-left:-1px;border-left:1px solid rgba(255,255,255,.5)}
.mf-tr li:first-child{border-radius:10px 0 0 10px;margin-left:0;border-left:0}.mf-tr li:last-child{border-radius:0 10px 10px 0}

/* cost bridge */
.mf-br{list-style:none;margin:20px 0 18px;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:b}
.mf-br li{position:relative;padding:18px 16px 18px 20px;border:1.5px solid var(--ink);margin-left:-1.5px;background:#fff}
.mf-br li:first-child{border-radius:10px 0 0 10px;margin-left:0}.mf-br li:last-child{border-radius:0 10px 10px 0;background:var(--ink);color:#fff}
.mf-br li:nth-child(3){border-color:var(--flag);background:#fff3ec}
.mf-br b{display:block;font:600 19px var(--fd);letter-spacing:-.02em;margin-bottom:6px}
.mf-br span{font-size:14px;color:var(--body)}.mf-br li:last-child span{color:#b9c6d8}
.mf-calc{display:grid;grid-template-columns:repeat(3,1fr) 1.3fr;gap:12px;padding:18px;background:#fff;border:1.5px solid var(--ink);border-radius:12px;box-shadow:6px 6px 0 var(--ink);margin-bottom:26px}
.mf-calc label{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:600;color:var(--body)}
.mf-calc input{font:600 22px var(--fd);padding:10px 12px;border:1.5px solid var(--line);border-radius:8px;width:100%;background:var(--mist);color:var(--ink)}
.mf-out{display:flex;flex-direction:column;background:var(--ink);color:#fff;border-radius:10px;padding:12px 16px}
.mf-out span{font-size:13px;color:#b9c6d8}.mf-out strong{font:700 40px/1 var(--fd);letter-spacing:-.03em;color:#7fb0ff}
.mf-out.over strong{color:#ffb08f}.mf-out small{font-size:12.5px;color:#b9c6d8}
.mfPage .mf-fine{grid-column:1/-1;margin:0;font-size:12.5px;color:#6b7a8c}

/* related + closing */
.mf-rel{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0 10px}
.mf-rc{display:flex;flex-direction:column;gap:6px;padding:18px 20px;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--ink);transition:border-color .15s}
.mf-rc:hover{border-color:var(--ink)}.mf-rc b{font:600 19px var(--fd);letter-spacing:-.02em}
.mf-rc span{font-size:14px;color:var(--body)}.mf-rc em{margin-top:auto;font-style:normal;font-weight:600;font-size:14px;color:var(--az2);text-decoration:underline;text-underline-offset:3px}
.mf-final{background:var(--az);color:#fff;padding:clamp(52px,7vw,92px) 0}
.mf-final h2{color:#fff;font-size:clamp(34px,5vw,62px);font-weight:700;letter-spacing:-.045em;line-height:.98;max-width:16ch;margin-bottom:10px}
.mfPage .mf-final p{color:#dbe7ff}.mfPage .mf-fl{font:600 clamp(20px,2.4vw,28px)/1.25 var(--fd);color:#fff;margin-bottom:28px}
.mf-final .mf-two{grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:clamp(24px,3.5vw,52px)}
.mf-final h3{color:#fff;font-size:20px;margin:0 0 10px}
.mf-bl{list-style:none;margin:0;padding:0}
.mf-bl li{border-top:1.5px solid rgba(255,255,255,.35);padding:9px 0 9px 28px;font:500 15.5px/1.35 var(--fd);position:relative;color:#fff}
.mf-bl li::before{content:"";position:absolute;left:0;top:10px;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3.5 8.5 6.5 11.5 12.5 4.5'/%3E%3C/svg%3E") no-repeat center/10px;border:1px solid rgba(255,255,255,.35)}
.mf-bl--two{columns:2;column-gap:clamp(20px,2.5vw,36px)}
.mf-bl--two li{break-inside:avoid}
.mf-final-cta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:clamp(24px,3.5vw,52px);align-items:center;margin-top:clamp(34px,4.5vw,56px)}
.mfPage .mf-final-cta .mf-end{font:700 clamp(22px,3vw,36px)/1.1 var(--fd);letter-spacing:-.03em;color:#fff;max-width:24ch;margin:0}
.mf-final-cta .mf-btns{margin:0;display:flex;flex-wrap:wrap;gap:12px}

@media(max-width:1000px){
  .mf-hg,.mf-two,.mf-final .mf-two,.mf-final-cta{grid-template-columns:1fr}
  .mf-final-cta{gap:20px}
  .mf-4{grid-template-columns:repeat(2,1fr)}.mf-3{grid-template-columns:1fr}
  .mf-rel{grid-template-columns:repeat(2,1fr)}
  .mf-tr{grid-template-columns:1fr}
  .mf-tr li,.mf-tr li:first-child,.mf-tr li:last-child{border-radius:0;margin:0;border-left:0;border-top:1px solid rgba(255,255,255,.5);text-align:left;padding:12px 16px}
  .mf-tr li:first-child{border-radius:10px 10px 0 0;border-top:0}.mf-tr li:last-child{border-radius:0 0 10px 10px}
  .mf-br{grid-template-columns:repeat(2,1fr)}
  .mf-br li,.mf-br li:first-child,.mf-br li:last-child{border-radius:0;margin:0 0 -1.5px}
  .mf-calc{grid-template-columns:repeat(3,1fr)}.mf-out{grid-column:1/-1}
}
@media(max-width:640px){
  .mfPage{font-size:16px;--mf-top:64px}
  .mf-q,.mf-bl--two{columns:1}
  .mf-dl,.mf-4,.mf-rel,.mf-chips--grid{grid-template-columns:1fr}
  .mf-dl>.mf-dl-pad,.mf-dl:has(> div:last-child:nth-child(odd))::after{display:none}
  .mf-br{grid-template-columns:1fr}.mf-calc{grid-template-columns:1fr 1fr}
  .mf-btns{flex-direction:column}.mf-btn{justify-content:center}
  .mf-fig{box-shadow:5px 5px 0 var(--ink)}
  .mf-xr i{display:none}.mf-xr button{flex:1 1 45%}
}
@media(prefers-reduced-motion:reduce){.mfPage *{transition:none!important}}