/* TextInk — shared styles
   Palette is drawn from process printing: cyan and magenta separations
   on stock white, with ink-black text. */

:root{
  --ink:#16181C;
  --ink-soft:#4A5058;
  --stock:#FBFBF9;
  --stock-warm:#F1EFE9;
  --cyan:#0A7FBF;
  --magenta:#C41E6B;
  --rule:#D9D6CE;
  --maxw:68rem;
}

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{animation:none !important;transition:none !important;}
}

body{
  margin:0;
  background:var(--stock);
  color:var(--ink);
  font-family:"Source Serif 4",Georgia,serif;
  font-size:1.0625rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,nav,.btn,.kicker,footer .meta{
  font-family:Archivo,"Helvetica Neue",Arial,sans-serif;
}

a{color:var(--cyan);text-decoration-thickness:1px;text-underline-offset:2px;}
a:hover{color:var(--magenta);}
a:focus-visible,button:focus-visible{
  outline:2px solid var(--magenta);
  outline-offset:3px;
}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 1.5rem;}

/* ---------- header ---------- */
header.site{
  border-bottom:1px solid var(--rule);
  background:var(--stock);
  position:sticky;top:0;z-index:20;
}
header.site .wrap{
  display:flex;align-items:center;justify-content:space-between;
  gap:1.5rem;padding-top:1rem;padding-bottom:1rem;flex-wrap:wrap;
}
.brand{
  font-family:Archivo,sans-serif;font-weight:700;font-size:1.35rem;
  letter-spacing:-.02em;color:var(--ink);text-decoration:none;
  display:inline-flex;align-items:baseline;gap:.1em;
}
.brand .t2{color:var(--cyan);}
nav.site ul{
  list-style:none;display:flex;gap:1.4rem;margin:0;padding:0;
  font-size:.95rem;font-weight:500;flex-wrap:wrap;
}
nav.site a{color:var(--ink-soft);text-decoration:none;}
nav.site a:hover,nav.site a[aria-current="page"]{color:var(--magenta);}

/* ---------- hero ---------- */
.hero{padding:4.5rem 0 3rem;border-bottom:1px solid var(--rule);}
.hero h1{
  font-size:clamp(2.4rem,6.5vw,4.25rem);
  line-height:1.03;margin:0 0 1.25rem;font-weight:700;letter-spacing:-.03em;
  max-width:16ch;
}
/* Misregistration motif: the cyan and magenta separations sitting
   a hair off the black, the way a press looks before it is dialled in. */
.sep{position:relative;display:inline-block;}
.sep::before,.sep::after{
  content:attr(data-word);
  position:absolute;left:0;top:0;z-index:-1;
}
.sep::before{color:var(--cyan);transform:translate(-.018em,.012em);}
.sep::after{color:var(--magenta);transform:translate(.016em,-.01em);}

.hero p.lead{
  font-size:1.2rem;max-width:60ch;color:var(--ink-soft);margin:0 0 2rem;
}
.btnrow{display:flex;gap:.9rem;flex-wrap:wrap;}
.btn{
  display:inline-block;padding:.75rem 1.4rem;border-radius:2px;
  font-weight:600;font-size:.98rem;text-decoration:none;
}
.btn.primary{background:var(--ink);color:var(--stock);}
.btn.primary:hover{background:var(--cyan);color:#fff;}
.btn.ghost{border:1.5px solid var(--ink);color:var(--ink);}
.btn.ghost:hover{border-color:var(--magenta);color:var(--magenta);}

/* ---------- disclosure strip ---------- */
.disclosure{
  background:var(--stock-warm);border-bottom:1px solid var(--rule);
  font-size:.9rem;color:var(--ink-soft);
}
.disclosure .wrap{padding-top:.7rem;padding-bottom:.7rem;}

/* ---------- sections ---------- */
section{padding:3.5rem 0;border-bottom:1px solid var(--rule);}
section h2{
  font-size:clamp(1.5rem,3vw,2rem);margin:0 0 .6rem;
  letter-spacing:-.02em;font-weight:700;
}
section > .wrap > p{max-width:65ch;}

.cols{display:grid;gap:2.5rem;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));margin-top:2rem;}
.col h3{font-size:1.1rem;margin:0 0 .4rem;}
.col p{margin:0;color:var(--ink-soft);font-size:1rem;}
/* the three process colours mark the three equipment families */
.col{border-top:3px solid var(--rule);padding-top:1rem;}
.col.c1{border-top-color:var(--cyan);}
.col.c2{border-top-color:var(--magenta);}
.col.c3{border-top-color:#E8B517;}
.col.c4{border-top-color:#2E9E6B;}
.col h3 a{color:var(--ink);text-decoration:none;}
.col h3 a:hover{color:var(--magenta);}

dl.facts{margin:1.5rem 0 0;display:grid;gap:1.1rem;}
dl.facts dt{font-family:Archivo,sans-serif;font-weight:600;font-size:1rem;}
dl.facts dd{margin:.15rem 0 0;color:var(--ink-soft);max-width:62ch;}

/* ---------- footer ---------- */
footer.site{padding:2.5rem 0 3.5rem;font-size:.92rem;color:var(--ink-soft);}
footer.site p{margin:.45rem 0;max-width:70ch;}
footer.site a{color:var(--ink-soft);}
footer.site .meta{font-size:.86rem;margin-top:1.4rem;}
