/* ──────────────────────────────────────────────────────────────
   Le Kit de Nettoyage Maurisson
   Mode d'emploi imprimable A4 portrait, recto seul.
   Style : DNA Chez Maurisson en version claire.
   ────────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..900;1,9..144,300..900&family=Inter:wght@100..900&display=swap');

:root {
  /* Palette claire — fond blanc (éco-encre), accents ember conservés */
  --bg:       #ffffff;
  --bg-tone:  #f5efe6;
  --bg-warm:  #fdf8ee;
  --ink:      #120f0c;
  --ink-soft: #241f19;
  --ink-muted:#4a4038;
  --ink-faint:#6d6158;
  --ember:        #c56a2a;
  --ember-deep:   #7a3a14;
  --ember-bright: #e08a44;
  --ember-light:  #edaa6a;
  --ember-pale:   #fde4c0;

  /* Verts — laurier noble, microfibres "nature" */
  --moss:       #5a7360;
  --moss-deep:  #3a4f40;
  --moss-pale:  #e3ebe1;

  /* Rouge — alertes, exclusions */
  --crit:       #a8331a;
  --crit-pale:  #fbe5dd;

  --line:        rgba(18,15,12,.14);
  --line-strong: rgba(18,15,12,.28);

  --font-display: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

@page { size: A4 portrait; margin: 0; }

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 10.5pt;
  line-height: 1.55;
  font-weight: 300;
  letter-spacing: -.005em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  color-adjust: exact;
}

img, svg { display: block; max-width: 100%; }

/* ── Page (A4 portrait) ─────────────────────────────────────── */
.page {
  width: 210mm; height: 297mm;
  position: relative; overflow: hidden;
  page-break-after: always;
  padding: 22mm 20mm 18mm 20mm;
  background: var(--bg);
}
.page:last-child { page-break-after: auto; }

/* ── Page footer (folio + tagline) ──────────────────────────── */
.foot {
  position: absolute;
  bottom: 10mm; left: 20mm; right: 20mm;
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 7.5pt; letter-spacing: .2em; text-transform: uppercase;
  color: var(--ink-faint);
}
.foot .num {
  font-family: var(--font-display); font-style: italic; font-weight: 300;
  font-size: 10pt; letter-spacing: 0; text-transform: none; color: var(--ember);
}
.foot .brand {
  font-family: var(--font-display); font-weight: 400; font-style: italic;
  font-size: 9pt; letter-spacing: .03em; text-transform: none; color: var(--ink-faint);
}

/* ── Eyebrow ────────────────────────────────────────────────── */
.eyebrow {
  display: inline-flex; align-items: center; gap: .55em;
  font-family: var(--font-body); font-size: 8pt; font-weight: 500;
  letter-spacing: .22em; text-transform: uppercase; color: var(--ember-deep);
  margin-bottom: 6mm;
}
.eyebrow::before {
  content:''; display:inline-block; width: 22pt; height: 1px;
  background: currentColor; opacity: .55;
}
.eyebrow.moss { color: var(--moss-deep); }
.eyebrow.crit { color: var(--crit); }

/* ── Display & headings ─────────────────────────────────────── */
h1.section-title {
  font-family: var(--font-display); font-weight: 300;
  font-size: 32pt; line-height: 1.02; letter-spacing: -.025em;
  color: var(--ink); margin-bottom: 4mm;
  max-width: 18ch;
}
h1.section-title em {
  font-style: italic; font-weight: 300; color: var(--ember-deep);
}
h1.section-title.moss em { color: var(--moss-deep); }
h1.section-title.crit em { color: var(--crit); }

p.lead {
  font-family: var(--font-display); font-weight: 300;
  font-size: 13.5pt; line-height: 1.35; letter-spacing: -.01em;
  color: var(--ink-soft); max-width: 26em;
  margin-bottom: 8mm;
}

.body { color: var(--ink-soft); max-width: 32em; }
.body p { margin-bottom: 3.2mm; }
.body p:last-child { margin-bottom: 0; }
.body strong { font-weight: 500; color: var(--ink); }
.body em { font-style: italic; color: var(--ember-deep); font-family: var(--font-display); }

/* ── Callout (encadré "astuce" / "essai") ───────────────────── */
.callout {
  border: .8pt solid var(--line-strong);
  border-left: 3pt solid var(--ember);
  background: var(--bg-warm);
  padding: 3mm 5mm;
  margin-top: 4mm;
  border-radius: 1.5mm;
}
.callout.moss { border-left-color: var(--moss); background: var(--moss-pale); }
.callout.crit { border-left-color: var(--crit); background: var(--crit-pale); }
.callout .callout-label {
  font-family: var(--font-body); font-size: 7.5pt; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--ember-deep); margin-bottom: 1.5mm;
}
.callout.moss .callout-label { color: var(--moss-deep); }
.callout.crit .callout-label { color: var(--crit); }
.callout p { color: var(--ink-soft); font-size: 10pt; line-height: 1.5; }

/* ── Cover page — refonte éditoriale ─────────────────────────── */
.cover {
  display: grid;
  grid-template-rows: auto 1fr auto auto;
  padding: 18mm 20mm 16mm 20mm;
  gap: 0;
}

.cover-bar {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-bottom: 5mm;
  border-bottom: .6pt solid var(--ink);
  font-family: var(--font-body); font-size: 8pt; font-weight: 500;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--ink);
}
.cover-bar .roman {
  font-family: var(--font-display); font-style: italic; font-weight: 400;
  font-size: 11pt; letter-spacing: .04em; text-transform: none;
  color: var(--ember-deep);
}

.cover-body {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 10mm;
  align-items: stretch;
  padding: 10mm 0 6mm 0;
}

.cover-flacon {
  display: flex; align-items: center; justify-content: center;
  position: relative;
}
.cover-flacon::before {
  content: 'CH₃COOH';
  position: absolute;
  top: 4mm; left: 0; right: 0;
  text-align: center;
  font-family: var(--font-display);
  font-size: 8pt; font-style: italic; font-weight: 300;
  color: var(--ink-faint);
  letter-spacing: .08em;
  opacity: .55;
}
.cover-flacon::after {
  content: '500 ml · spray verre · v1';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  text-align: center;
  font-family: var(--font-body); font-size: 7pt; font-weight: 500;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--ink-faint);
}
.cover-flacon svg { width: 75mm; height: auto; }
.cover-flacon img {
  width: 100%;
  max-width: 85mm;
  height: 175mm;
  object-fit: cover;
  object-position: center;
  border-radius: 2mm;
  display: block;
}

/* ── Photo bands ────────────────────────────────────────────── */
.hero-img {
  width: 100%;
  height: 48mm;
  object-fit: cover;
  border-radius: 2mm;
  margin: 4mm 0 6mm 0;
  display: block;
}
.hero-img.tall { height: 65mm; }
.hero-img.short { height: 36mm; }

.split-hero {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 6mm;
  margin: 4mm 0 5mm 0;
  align-items: stretch;
}
.split-hero img {
  width: 100%; height: 100%;
  min-height: 42mm;
  object-fit: cover;
  border-radius: 2mm;
}
.split-hero.compact img { min-height: 32mm; }
.split-hero.compact { margin: 3mm 0 4mm 0; }
.split-hero .split-text {
  display: flex; flex-direction: column; justify-content: center;
}

.cover-title-block {
  display: flex; flex-direction: column; justify-content: center;
  position: relative;
}
.cover-eyebrow {
  font-family: var(--font-body); font-size: 7.5pt; font-weight: 600;
  letter-spacing: .25em; text-transform: uppercase;
  color: var(--ember-deep);
  margin-bottom: 4mm;
  display: inline-flex; align-items: center; gap: 3mm;
}
.cover-eyebrow::after {
  content:''; display:inline-block;
  flex: 1; height: 1px;
  background: var(--line-strong);
}
.cover-title-block .t1 {
  display: block;
  font-family: var(--font-display); font-weight: 300; font-style: italic;
  font-size: 28pt; line-height: .98; letter-spacing: -.02em;
  color: var(--ink-soft);
}
.cover-title-block .t2 {
  display: block;
  font-family: var(--font-display); font-weight: 300; font-style: italic;
  font-size: 28pt; line-height: .98; letter-spacing: -.02em;
  color: var(--ink-soft);
  margin-bottom: 2mm;
}
.cover-title-block .t3 {
  display: block;
  font-family: var(--font-display); font-weight: 300; font-style: italic;
  font-size: 64pt; line-height: .88; letter-spacing: -.04em;
  background: linear-gradient(95deg, var(--ember-deep) 0%, var(--ember) 55%, var(--ember-bright) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

.cover-sub {
  font-family: var(--font-display); font-weight: 300; font-style: italic;
  font-size: 13.5pt; line-height: 1.32; letter-spacing: -.005em;
  color: var(--ink-soft);
  margin-top: 8mm; max-width: 28em;
  padding-top: 5mm; border-top: .4pt solid var(--line);
}

.cover-formula {
  margin-top: 5mm;
  font-family: var(--font-body); font-size: 8.5pt; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-muted);
  line-height: 1.6;
}
.cover-formula .num {
  font-family: var(--font-display); font-style: italic; font-weight: 400;
  font-size: 11pt; color: var(--ember); letter-spacing: 0;
  text-transform: none;
}

.cover-toc {
  padding: 5mm 0 5mm 0;
  border-top: .6pt solid var(--ink);
  border-bottom: .6pt solid var(--ink);
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 12mm;
  row-gap: 1.5mm;
}
.cover-toc .toc-row {
  display: grid;
  grid-template-columns: 14mm 1fr 8mm;
  align-items: baseline;
  gap: 3mm;
  font-size: 9.5pt;
  border-bottom: .25pt dotted var(--line);
  padding-bottom: 1mm;
}
.cover-toc .toc-row:nth-last-child(-n+2) { border-bottom: 0; }
.cover-toc .toc-num {
  font-family: var(--font-display); font-weight: 400; font-style: italic;
  color: var(--ember); font-size: 10pt; letter-spacing: .02em;
}
.cover-toc .toc-name {
  color: var(--ink-soft); font-family: var(--font-display); font-weight: 400;
  font-size: 10.5pt; letter-spacing: -.01em;
}
.cover-toc .toc-page {
  font-family: var(--font-body); font-size: 8pt; font-weight: 500;
  color: var(--ink-faint); text-align: right;
}

.cover-foot {
  padding-top: 4mm;
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--font-body); font-weight: 500; font-size: 7.5pt;
  letter-spacing: .22em; text-transform: uppercase; color: var(--ink-faint);
}
.cover-foot .stamp {
  display: inline-flex; align-items: center; gap: 2mm;
  font-family: var(--font-display); font-style: italic; font-weight: 400;
  font-size: 9.5pt; letter-spacing: 0; text-transform: none;
  color: var(--ember-deep);
  padding: 1.5mm 4mm;
  border: .6pt solid var(--ember-deep);
  border-radius: 999px;
}

/* ── Two-column layouts ─────────────────────────────────────── */
.two-col {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 12mm;
  margin-top: 6mm;
  align-items: start;
}
.two-col.flip { grid-template-columns: 0.95fr 1.05fr; }
.two-col .visual {
  background: var(--bg-tone);
  border: .6pt solid var(--line);
  border-radius: 2mm;
  padding: 6mm;
  display: flex; align-items: center; justify-content: center;
}

/* ── Dosage chips (formulation page) ────────────────────────── */
.dosage-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4mm;
  margin: 6mm 0 8mm 0;
}
.dchip {
  border: .6pt solid var(--line-strong);
  border-radius: 2mm;
  padding: 4mm 3mm;
  background: var(--bg-warm);
  text-align: center;
}
.dchip .dchip-big {
  font-family: var(--font-display); font-weight: 300; font-style: italic;
  font-size: 32pt; line-height: 1; color: var(--ember);
  letter-spacing: -.03em;
}
.dchip .dchip-unit {
  font-family: var(--font-body); font-size: 8pt; font-weight: 500;
  letter-spacing: .18em; text-transform: uppercase; color: var(--ink-faint);
  margin-top: 1.5mm;
}
.dchip .dchip-label {
  font-family: var(--font-display); font-style: italic; font-weight: 300;
  font-size: 10pt; color: var(--ink-soft); margin-top: 1mm;
  line-height: 1.2;
}

/* ── Logic dosage list (bascules de seuils) ─────────────────── */
.threshold-list {
  list-style: none;
  display: flex; flex-direction: column; gap: 2.5mm;
  margin-top: 3mm;
}
.threshold-list li {
  display: grid;
  grid-template-columns: 22mm 1fr;
  gap: 4mm;
  align-items: baseline;
  padding-bottom: 2mm;
  border-bottom: .4pt solid var(--line);
}
.threshold-list li:last-child { border-bottom: 0; }
.threshold-list .th-mark {
  font-family: var(--font-display); font-weight: 400; font-style: italic;
  font-size: 11pt; color: var(--ember); letter-spacing: -.01em;
  white-space: nowrap;
}
.threshold-list .th-mark.bad { color: var(--crit); }
.threshold-list .th-mark.good { color: var(--moss-deep); }
.threshold-list .th-text { font-size: 9.5pt; color: var(--ink-soft); line-height: 1.45; }

/* ── Steps (méthode + protocole) ────────────────────────────── */
.steps {
  list-style: none; counter-reset: step;
  display: flex; flex-direction: column; gap: 4mm;
  margin-top: 4mm;
}
.steps li {
  counter-increment: step;
  display: grid;
  grid-template-columns: 12mm 1fr;
  gap: 4mm;
  padding-bottom: 4mm;
  border-bottom: .4pt solid var(--line);
}
.steps li:last-child { border-bottom: 0; padding-bottom: 0; }
.steps li::before {
  content: counter(step);
  font-family: var(--font-display); font-weight: 300; font-style: italic;
  color: var(--ember); font-size: 28pt; line-height: 1;
  letter-spacing: -.03em;
}
.steps .step-title {
  font-family: var(--font-display); font-weight: 400; font-style: italic;
  font-size: 13pt; color: var(--ink); letter-spacing: -.01em;
  margin-bottom: 1mm;
}
.steps .step-body {
  font-size: 9.5pt; color: var(--ink-soft); line-height: 1.5;
}

/* ── Microfiber cards ───────────────────────────────────────── */
.fiber-stack {
  display: flex; flex-direction: column; gap: 3mm;
  margin-top: 3mm;
}
.fiber {
  border: .6pt solid var(--line-strong);
  border-radius: 2mm;
  padding: 3.5mm 4.5mm;
  background: var(--bg-warm);
  display: grid;
  grid-template-columns: 22mm 1fr;
  gap: 4.5mm;
  align-items: start;
}
.fiber .fiber-swatch {
  height: 22mm;
  border-radius: 1.5mm;
  background: var(--bg-tone);
  border: .4pt solid var(--line);
  display: flex; align-items: center; justify-content: center;
}
.fiber .fiber-swatch svg { width: 100%; height: 100%; }
.fiber .fiber-name {
  font-family: var(--font-display); font-weight: 400;
  font-size: 13pt; color: var(--ink); margin-bottom: .5mm; letter-spacing: -.01em;
}
.fiber .fiber-role {
  font-family: var(--font-body); font-size: 7.5pt; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--ember-deep); margin-bottom: 2mm;
}
.fiber .fiber-desc {
  font-size: 9.5pt; color: var(--ink-soft); line-height: 1.5;
}

/* ── Do / Don't list (zones d'usage) ────────────────────────── */
.zone-list {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5mm 8mm;
  margin-top: 4mm;
}
.zone-list li {
  font-size: 9.5pt; color: var(--ink-soft); line-height: 1.4;
  padding-left: 6mm; position: relative;
}
.zone-list li::before {
  position: absolute; left: 0; top: 0;
  font-family: var(--font-display); font-weight: 500;
  font-size: 11pt; line-height: 1.3;
}
.zone-list.do li::before { content:'✓'; color: var(--moss-deep); }
.zone-list.dont li::before { content:'✗'; color: var(--crit); }
.zone-list.single { grid-template-columns: 1fr; }

/* ── Pliage diagram ─────────────────────────────────────────── */
.pliage-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3mm;
  margin: 6mm 0;
}
.pliage-step {
  border: .6pt solid var(--line);
  border-radius: 2mm;
  padding: 3mm;
  background: var(--bg-warm);
  display: flex; flex-direction: column; align-items: center; gap: 2mm;
}
.pliage-step .ps-num {
  font-family: var(--font-display); font-weight: 500; font-style: italic;
  color: var(--ember); font-size: 11pt;
}
.pliage-step .ps-svg { width: 100%; height: 22mm; }
.pliage-step .ps-caption {
  font-family: var(--font-display); font-style: italic; font-weight: 300;
  font-size: 8.5pt; color: var(--ink-soft); text-align: center; line-height: 1.25;
}

/* ── Recipe / formula card ──────────────────────────────────── */
.formula-card {
  border: .8pt solid var(--line-strong);
  border-radius: 2mm;
  padding: 5mm 6mm;
  background: var(--bg-warm);
  margin-top: 4mm;
}
.formula-title {
  font-family: var(--font-display); font-weight: 400; font-style: italic;
  font-size: 12pt; color: var(--ember-deep); margin-bottom: 3mm;
  letter-spacing: -.01em;
}
.formula-list {
  list-style: none;
  display: flex; flex-direction: column; gap: 1.8mm;
  font-size: 9.5pt; color: var(--ink-soft);
}
.formula-list li {
  padding-left: 5mm; position: relative; line-height: 1.45;
}
.formula-list li::before {
  content:'—'; position: absolute; left: 0; color: var(--ember);
  font-family: var(--font-display);
}

/* ── Farewell page ──────────────────────────────────────────── */
.farewell {
  margin-top: 8mm;
  padding: 6mm 6mm;
  border-top: .8pt solid var(--ember);
}
.farewell-title {
  font-family: var(--font-display); font-weight: 300;
  font-size: 22pt; letter-spacing: -.025em; color: var(--ink);
  margin-bottom: 4mm;
}
.farewell p { font-size: 10pt; color: var(--ink-soft); margin-bottom: 3mm; max-width: 32em; }
.farewell .sign {
  margin-top: 6mm;
  font-family: var(--font-display); font-style: italic; font-weight: 300;
  font-size: 14pt; color: var(--ember-deep);
}

/* ── Tip cards (astuces page) ───────────────────────────────── */
.tips-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4mm;
  margin-top: 4mm;
}
.tip {
  border: .6pt solid var(--line-strong);
  border-radius: 2mm;
  padding: 4mm 4.5mm 4mm 4.5mm;
  background: var(--bg-warm);
  position: relative;
  display: flex; flex-direction: column;
}
.tip.span2 { grid-column: span 2; }
.tip .tip-num {
  position: absolute;
  top: 3mm; right: 4mm;
  font-family: var(--font-display); font-weight: 300; font-style: italic;
  font-size: 28pt; line-height: 1; color: var(--ember-pale);
  letter-spacing: -.04em;
  z-index: 0;
}
.tip .tip-head {
  display: flex; align-items: baseline; gap: 3mm;
  margin-bottom: 2mm;
  position: relative; z-index: 1;
}
.tip .tip-roman {
  font-family: var(--font-display); font-weight: 500; font-style: italic;
  color: var(--ember); font-size: 10pt;
  letter-spacing: .02em;
}
.tip .tip-name {
  font-family: var(--font-display); font-weight: 400;
  font-size: 12.5pt; color: var(--ink); letter-spacing: -.01em;
  line-height: 1.05;
}
.tip .tip-body {
  font-size: 9.5pt; color: var(--ink-soft); line-height: 1.5;
  position: relative; z-index: 1;
}
.tip .tip-body strong { color: var(--ink); font-weight: 500; }
.tip .tip-tag {
  margin-top: auto;
  padding-top: 2.5mm;
  font-family: var(--font-body); font-size: 7pt; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--ember-deep);
}

/* ── Section divider (entre titres + corps) ─────────────────── */
.divider {
  display: flex; align-items: center; gap: 3mm;
  margin: 5mm 0 5mm 0;
  font-family: var(--font-body); font-size: 7.5pt; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase; color: var(--ember-deep);
}
.divider::before, .divider::after {
  content:''; flex: 1; height: .4pt; background: var(--line-strong);
}
.divider.moss { color: var(--moss-deep); }
.divider.crit { color: var(--crit); }

/* ── Sidenote / fact-box (annotations marge) ────────────────── */
.fact-box {
  margin-top: 5mm;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 3mm;
}
.fact {
  border-top: 1pt solid var(--ink);
  padding-top: 2.5mm;
}
.fact .fact-num {
  font-family: var(--font-display); font-weight: 300; font-style: italic;
  font-size: 22pt; line-height: 1; color: var(--ember);
  letter-spacing: -.02em; margin-bottom: 1mm;
}
.fact .fact-label {
  font-family: var(--font-body); font-size: 7pt; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase; color: var(--ink-faint);
  margin-bottom: 1mm;
}
.fact .fact-text {
  font-size: 8.5pt; color: var(--ink-soft); line-height: 1.4;
}

/* ── Molecule chips (page laurier) ──────────────────────────── */
.molecules {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2mm 4mm;
  margin-top: 3mm;
}
.molecule {
  display: grid;
  grid-template-columns: 18mm 1fr;
  gap: 2mm;
  font-size: 9pt;
  padding-bottom: 1.8mm;
  border-bottom: .3pt dotted var(--line);
  align-items: baseline;
}
.molecule .m-pct {
  font-family: var(--font-display); font-weight: 400; font-style: italic;
  color: var(--moss-deep); font-size: 10pt;
}
.molecule .m-name { color: var(--ink-soft); }
.molecule .m-name strong { font-weight: 500; color: var(--ink); }

/* ── Pull-quote (citations interstitielles) ─────────────────── */
.pullquote {
  margin: 4mm 0 4mm 0;
  padding: 3mm 6mm;
  border-left: 3pt solid var(--ember);
  font-family: var(--font-display); font-style: italic; font-weight: 300;
  font-size: 12.5pt; line-height: 1.35; letter-spacing: -.01em;
  color: var(--ink-soft);
  max-width: 32em;
}
.pullquote::before {
  content: '“';
  font-family: var(--font-display); font-style: italic; font-weight: 400;
  font-size: 22pt; line-height: 0;
  color: var(--ember);
  vertical-align: -10pt;
  margin-right: 2mm;
}

/* ── Specs table (microfibres) ──────────────────────────────── */
.specs-row {
  display: flex; gap: 4mm; margin-top: 3mm;
  font-family: var(--font-body); font-size: 7.5pt;
}
.specs-row .spec {
  flex: 1;
  border-top: .4pt solid var(--line-strong);
  padding-top: 1.5mm;
}
.specs-row .spec-label {
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--ink-faint); font-weight: 500;
  margin-bottom: .5mm;
}
.specs-row .spec-val {
  font-family: var(--font-display); font-weight: 400;
  font-size: 10.5pt; color: var(--ink-soft); letter-spacing: -.01em;
  line-height: 1.1;
}

/* prevent ugly orphan widows in body text */
p { orphans: 2; widows: 2; }