:root{
  --danger:#b3261e;
  --paper:#fafbfc;--surface:#fff;--ink:#10161f;--ink-2:#4a5565;--line:#d9dee5;
  --cyan:#0096c7;--magenta:#d81e78;--yellow:#f5b700;
  --radius:6px;--wrap:1120px;
  --font:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--paper:#0e131a;--surface:#151b24;--ink:#eef2f6;--ink-2:#a8b3c2;--line:#2a3340;--danger:#ff8a80}
}
:root[data-theme="dark"]{--paper:#0e131a;--surface:#151b24;--ink:#eef2f6;--ink-2:#a8b3c2;--line:#2a3340;--danger:#ff8a80}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1rem/1.6 var(--font)}
img,svg{max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--ink);color:var(--paper);padding:8px 12px;z-index:10}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
h1,h2,h3{line-height:1.12;letter-spacing:-.02em;margin:0 0 .5em}
h1{font-size:clamp(2.4rem,7vw,4.4rem);font-weight:800}
h2{font-size:clamp(1.6rem,3.5vw,2.2rem);font-weight:750}
h3{font-size:1.1rem;font-weight:700}
p{margin:0 0 1em;max-width:62ch}
.muted{color:var(--ink-2)}

/* header */
.site-header{border-bottom:1px solid var(--line);background:var(--surface)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;text-decoration:none;letter-spacing:-.01em}
.cmyk{display:grid;grid-template-columns:1fr 1fr;gap:2px;width:22px;height:22px}
.cmyk i{display:block;border-radius:2px}
.cmyk i:nth-child(1){background:var(--cyan)}.cmyk i:nth-child(2){background:var(--magenta)}
.cmyk i:nth-child(3){background:var(--yellow)}.cmyk i:nth-child(4){background:var(--ink)}
.nav{display:flex;gap:20px;flex-wrap:wrap;align-items:center}
.nav a{text-decoration:none;color:var(--ink-2);font-weight:600;padding:8px 0}
.nav a:hover{color:var(--ink)}
.btn{display:inline-block;background:var(--ink);color:var(--paper);padding:12px 20px;border-radius:var(--radius);font-weight:700;text-decoration:none;border:2px solid var(--ink);min-height:44px}
.btn:hover{opacity:.9}
.btn.alt{background:transparent;color:var(--ink)}
.nav a.btn{color:var(--paper)}

/* hero */
.hero{padding:56px 0 64px}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.hero p.lead{font-size:1.2rem;color:var(--ink-2)}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.sheet{position:relative;aspect-ratio:3/4;max-width:380px;margin:0 auto;width:100%;background:var(--surface);border:1px solid var(--line);padding:34px}
.sheet::before,.sheet::after{content:"";position:absolute;width:18px;height:18px;border:2px solid var(--ink)}
.sheet::before{left:-10px;top:-10px;border-right:0;border-bottom:0}
.sheet::after{right:-10px;bottom:-10px;border-left:0;border-top:0}
.reg{width:86px;height:86px;border-radius:50%;margin:0 auto 28px;
  background:
   linear-gradient(var(--ink),var(--ink)) center/2px 100% no-repeat,
   linear-gradient(var(--ink),var(--ink)) center/100% 2px no-repeat,
   radial-gradient(circle,transparent 0 30%,var(--ink) 30% 33%,transparent 33% 62%,var(--ink) 62% 65%,transparent 65%)}
.sheet .lines span{display:block;height:10px;background:var(--line);margin-bottom:12px;border-radius:2px}
.sheet .lines span:nth-child(2){width:80%}.sheet .lines span:nth-child(3){width:60%}
.bars{position:absolute;left:34px;right:34px;bottom:34px;display:grid;grid-template-columns:repeat(4,1fr);height:22px}
.bars i:nth-child(1){background:var(--cyan)}.bars i:nth-child(2){background:var(--magenta)}
.bars i:nth-child(3){background:var(--yellow)}.bars i:nth-child(4){background:var(--ink)}

/* sections */
.section{padding:56px 0;border-top:1px solid var(--line)}
.steps{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:s}
.steps li{counter-increment:s;border-top:3px solid var(--ink);padding-top:12px}
.steps li::before{content:counter(s);display:block;font-weight:800;color:var(--ink-2);margin-bottom:4px}
.cats{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);column-gap:32px}
.cats li{padding:12px 0;border-bottom:1px solid var(--line);font-weight:600}
.rows{margin-top:24px}
.row{display:grid;grid-template-columns:1fr 2fr auto;gap:20px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}
.row p{margin:0}
details{border-bottom:1px solid var(--line);padding:14px 0}
summary{font-weight:700;cursor:pointer;min-height:32px}
details p{margin:10px 0 0}

/* footer */
.site-footer{border-top:1px solid var(--line);background:var(--surface);padding:32px 0;color:var(--ink-2);font-size:.95rem}
.site-footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ver{font-variant-numeric:tabular-nums}

/* content pages */
.page{padding:48px 0;max-width:760px}

@media (max-width:820px){
  .hero .wrap{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .cats{grid-template-columns:1fr 1fr}
  .row{grid-template-columns:1fr}
}
@media (max-width:480px){.steps,.cats{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* plugin pages: shop, order status, printer portal, printer application */
.mpn-wide .wrap.page{max-width:var(--wrap)}
.page h1{font-size:clamp(1.8rem,5vw,2.6rem)}
body .mpn-err{color:var(--danger)}
body .mpn-cfg input,body .mpn-cfg select,body .mpn-cfg textarea,.mpn-quote input,.mpn-quote textarea,.mpn-quote select{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;min-height:44px;max-width:100%}
body .mpn-cfg input[type="checkbox"],.mpn-quote input[type="checkbox"]{min-height:auto}
body .mpn-cfg input[type="file"],.mpn-quote input[type="file"]{padding:8px}
body .mpn-cfg button,.mpn-quote button{font:inherit;font-weight:700;color:var(--paper);background:var(--ink);border:2px solid var(--ink);border-radius:var(--radius);padding:10px 18px;min-height:44px;cursor:pointer}
body .mpn-cfg button:hover,.mpn-quote button:hover{opacity:.9}
.mpn-quote{border-radius:var(--radius)}
.mpn-quote h2,.mpn-quote h3,.mpn-quote h4{margin-top:0}
.mpn-quote table{width:100%;border-collapse:collapse}
.mpn-quote td{padding:8px 0;border-bottom:1px solid var(--line);vertical-align:top}
.mpn-quote td:last-child{text-align:right}
.mpn-quote form{margin:8px 0}
.mpn-quote label{font-weight:600}
.page table{max-width:100%}

/* printing an order page: keep only the content */
@media print{
  .site-header,.site-footer,.skip{display:none}
  body{background:#fff;color:#000}
  .mpn-quote{border:0;padding:0}
  .mpn-quote button,.mpn-quote form{display:none}
}