/* =========================================================
   TechCare Médical — Fiches produit · système partagé v2
   Aligné sur la plaquette TCM 2026
   Poppins + JetBrains Mono · navy #0E2240 / teal #03A58F
   A4 portrait, recto (cover navy) / verso (light)
   ========================================================= */
:root{
  --blue:#0B5394;
  --blue-deep:#08385F;
  --blue-bright:#3E70DB;
  --night:#0E2240;
  --teal:#03A58F;
  --teal-deep:#017A68;
  --teal-soft:#E6F6F3;
  --ink:#1A2433;
  --ink-2:#4A5568;
  --ink-3:#6B7280;
  --line:#E5E9F0;
  --line-2:#EEF2F7;
  --cream:#F7FAFC;
  --cloud:#F4F8FB;
  --paper:#fff;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{background:#e9ecf2;color:var(--ink);font-family:'Poppins',sans-serif;font-weight:400;-webkit-font-smoothing:antialiased;}
body{padding:28px 0 60px;}
.viewer-banner-wrap,.page,.viewer-banner{margin-left:auto;margin-right:auto;}

.viewer-banner{
  width:210mm;font-family:'JetBrains Mono',monospace;font-size:8pt;
  color:var(--ink-3);letter-spacing:.18em;text-transform:uppercase;
  display:flex;justify-content:space-between;align-items:center;padding:0 4mm;margin-bottom:8px;
}
.viewer-banner .dot{color:var(--teal);}
@media print{.viewer-banner{display:none;}}

.page{
  width:210mm !important;height:297mm !important;background:var(--paper);
  position:relative;overflow:hidden;flex:none;display:block;
  margin:0 auto 22px;
  box-shadow:0 30px 60px -30px rgba(8,56,95,.25), 0 8px 20px -10px rgba(8,56,95,.12);
  color:var(--ink);
}
h1,h2,h3,h4{font-weight:700;letter-spacing:-.02em;color:var(--blue-deep);}

.page-num{
  position:absolute;right:12mm;bottom:8mm;
  font-family:'JetBrains Mono',monospace;font-size:7.5pt;letter-spacing:.18em;color:var(--ink-3);text-transform:uppercase;z-index:50;
  background:rgba(255,255,255,.92);padding:3px 8px;border-radius:2px;border:1px solid var(--line);
}
.page-num.on-dark{color:rgba(255,255,255,.8);background:rgba(11,34,64,.5);border-color:rgba(255,255,255,.18);}

/* =========================================================
   RECTO — COVER (navy, full bleed)
   ========================================================= */
.fcover{
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(3,165,143,.18), transparent 55%),
    linear-gradient(180deg, var(--night) 0%, #0a1d3a 60%, #08172e 100%);
  color:#fff;position:relative;
  display:grid;grid-template-rows:auto 1fr auto;
  padding:15mm 15mm 13mm;padding-right:101mm;height:100%;
}

/* top bar */
.fcover .top{display:flex;flex-direction:column;align-items:flex-start;gap:3.5mm;}
.fcover .top .brand{height:28px;width:auto;display:block;filter:brightness(0) invert(1);}
.fcover .top .top-meta{
  font-size:7pt;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5);line-height:1.7;
}
.fcover .top .top-meta b{color:rgba(255,255,255,.85);font-weight:500;}
.fcover .top .top-meta br{display:block;content:"";}

/* hero */
.fcover .hero{
  display:grid;grid-template-columns:1fr;
  padding:6mm 0 4mm;align-content:center;
}
.fcover .eyebrow-w{
  font-family:'JetBrains Mono',monospace;font-size:8pt;letter-spacing:.28em;text-transform:uppercase;
  color:var(--teal);font-weight:500;display:flex;align-items:center;gap:10px;
}
.fcover .eyebrow-w::before{content:"";width:24px;height:1px;background:var(--teal);}

.fcover h1.title{
  font-size:50pt;line-height:.98;letter-spacing:-.035em;font-weight:700;color:#fff;margin-top:7mm;
}
.fcover h1.title .accent{color:#fff;}
.fcover h1.title .em{
  background:linear-gradient(120deg,var(--teal) 0%, #38c7b0 60%, var(--blue-bright) 130%);
  -webkit-background-clip:text;background-clip:text;color:transparent;font-style:italic;font-weight:600;
}
.fcover .tagline{
  margin-top:7mm;font-size:12.5pt;line-height:1.4;color:rgba(255,255,255,.92);font-weight:300;
  max-width:80mm;font-style:italic;
}
.fcover .tagline strong{color:#fff;font-weight:500;font-style:normal;}

.fcover .chips{margin-top:7mm;display:flex;flex-wrap:wrap;gap:5px;max-width:80mm;}
.fcover .chip{
  font-family:'JetBrains Mono',monospace;font-size:6.8pt;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,.85);border:1px solid rgba(255,255,255,.22);padding:5px 9px;border-radius:2px;
}
.fcover .chip.teal{border-color:var(--teal);color:var(--teal);}

.fcover .keyfacts{
  margin-top:9mm;display:flex;gap:9mm;padding-top:7mm;border-top:1px solid rgba(255,255,255,.12);max-width:80mm;
}
.fcover .kf .n{
  font-size:23pt;font-weight:700;letter-spacing:-.03em;line-height:1;
  background:linear-gradient(120deg,var(--teal),#5cd9c4);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.fcover .kf .n .u{font-size:12pt;font-weight:500;-webkit-text-fill-color:rgba(255,255,255,.65);margin-left:1.5mm;}
.fcover .kf .l{margin-top:2.5mm;font-family:'JetBrains Mono',monospace;font-size:6.6pt;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);}

/* device — full-height studio panel on the right; identical on every fiche, product never cropped */
.fcover .hero-device{
  position:absolute;top:0;right:0;bottom:0;width:100mm;
  background:radial-gradient(72% 56% at 50% 42%, #ffffff 0%, #dde8f3 100%);
  border-radius:0;border:none;border-left:1px solid rgba(255,255,255,.10);
  box-shadow:-34px 0 70px -34px rgba(0,0,0,.55);
  display:flex;align-items:center;justify-content:center;
  padding:8mm 3mm;z-index:2;
}
.fcover .hero-device::after{
  content:"";position:absolute;left:18%;right:18%;bottom:26mm;height:7mm;
  background:radial-gradient(50% 50% at 50% 50%, rgba(8,40,70,.20), transparent 72%);
  filter:blur(3px);z-index:0;
}
.fcover .hero-device img{
  position:relative;z-index:1;
  max-width:100%;max-height:100%;object-fit:contain;display:block;
}
.fcover .hero-device.photo{background:radial-gradient(72% 56% at 50% 42%, #ffffff 0%, #dde8f3 100%);}
.fcover .hero-device.dark{
  background:radial-gradient(72% 56% at 50% 42%, #ffffff 0%, #dde8f3 100%);
  border-left:1px solid rgba(255,255,255,.10);
  box-shadow:-34px 0 70px -34px rgba(0,0,0,.55);padding:8mm 3mm;
}
.fcover .hero-device.dark::after{
  display:block;background:radial-gradient(50% 50% at 50% 50%, rgba(0,0,0,.45), transparent 72%);
}
.fcover .hero-device.dark img{max-width:100%;max-height:100%;object-fit:contain;}
.fcover .hero-device .ptag{
  position:absolute;bottom:5mm;left:0;right:0;text-align:center;z-index:2;
  font-family:'JetBrains Mono',monospace;
  font-size:6.5pt;letter-spacing:.18em;color:var(--ink-3);text-transform:uppercase;
}

/* why band */
.fcover .why{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8mm;
  padding-top:8mm;border-top:1px solid rgba(255,255,255,.14);
}
.fcover .why .col{display:flex;flex-direction:column;gap:0;}
.fcover .why .top-row{display:flex;align-items:center;justify-content:space-between;}
.fcover .why .n{font-family:'JetBrains Mono',monospace;font-size:7.5pt;letter-spacing:.22em;color:var(--teal);font-weight:500;}
.fcover .why .ico{width:9mm;height:9mm;border-radius:50%;border:1px solid rgba(3,165,143,.45);display:flex;align-items:center;justify-content:center;}
.fcover .why .ico svg{width:5mm;height:5mm;}
.fcover .why h4{font-size:11pt;line-height:1.2;color:#fff;margin-top:4mm;letter-spacing:-.01em;}
.fcover .why p{font-size:8pt;line-height:1.5;color:rgba(255,255,255,.7);margin-top:2.5mm;font-weight:300;}
.fcover .why p strong{color:#fff;font-weight:500;}

/* =========================================================
   VERSO — light page
   ========================================================= */
.fverso{padding:14mm 14mm 13mm;height:100%;display:flex;flex-direction:column;}

.fverso .page-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:5mm;border-bottom:1px solid var(--line);
}
.fverso .page-head .brand{height:20px;width:auto;display:block;}
.fverso .page-head .crumb{
  font-family:'JetBrains Mono',monospace;font-size:7.5pt;letter-spacing:.18em;color:var(--ink-3);text-transform:uppercase;
  display:flex;align-items:center;gap:7px;
}
.fverso .page-head .crumb .sep{color:var(--teal);}
.fverso .page-head .crumb .cur{color:var(--blue-deep);font-weight:600;}

.fverso .eyebrow{font-family:'JetBrains Mono',monospace;font-size:8pt;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);font-weight:500;}

.fverso .h-title{font-size:24pt;line-height:1.1;letter-spacing:-.025em;font-weight:700;color:var(--blue-deep);}
.fverso .h-title .em{color:var(--teal);}

.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:6mm;margin-top:8mm;}
.sec-head .hint{font-family:'JetBrains Mono',monospace;font-size:7.5pt;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);}

/* specs */
.specs{margin-top:6mm;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.specs .grp{padding:5mm 4mm 5mm 0;border-right:1px solid var(--line);}
.specs .grp:last-child{border-right:none;padding-right:0;}
.specs .grp:not(:first-child){padding-left:4mm;}
.specs .grp .gh{font-family:'JetBrains Mono',monospace;font-size:7.5pt;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);font-weight:500;margin-bottom:3.5mm;}
.specs .grp .row{display:flex;flex-direction:column;gap:.5mm;padding:2mm 0;border-bottom:1px dashed var(--line);}
.specs .grp .row:last-child{border-bottom:none;}
.specs .grp .k{font-size:7.5pt;color:var(--ink-3);line-height:1.3;}
.specs .grp .v{font-size:9pt;color:var(--blue-deep);font-weight:600;line-height:1.25;}

/* indications + ccam */
.indic{margin-top:8mm;display:grid;grid-template-columns:1fr 78mm;gap:9mm;align-items:start;}
.indic .list{list-style:none;display:flex;flex-direction:column;}
.indic .list li{padding:3mm 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:auto 1fr;gap:3mm;align-items:baseline;}
.indic .list li:first-child{padding-top:0;}
.indic .list li:last-child{border-bottom:none;}
.indic .list li .mk{font-family:'JetBrains Mono',monospace;font-size:8pt;color:var(--teal);font-weight:600;}
.indic .list li .tx{font-size:9pt;line-height:1.45;color:var(--ink-2);}
.indic .list li .tx strong{color:var(--blue-deep);font-weight:600;display:block;margin-bottom:.5mm;}

.ccam{background:var(--cream);border-radius:3px;padding:6mm 6mm;border-left:3px solid var(--teal);}
.ccam .ch{font-family:'JetBrains Mono',monospace;font-size:7.5pt;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);font-weight:500;margin-bottom:4mm;}
.ccam table{width:100%;border-collapse:collapse;}
.ccam td{padding:2.5mm 0;border-bottom:1px solid var(--line);vertical-align:top;}
.ccam tr:last-child td{border-bottom:none;}
.ccam .code{font-family:'JetBrains Mono',monospace;font-size:9pt;font-weight:600;color:var(--blue-deep);white-space:nowrap;padding-right:4mm;}
.ccam .lib{font-size:8pt;color:var(--ink-2);line-height:1.35;}
.ccam .rb{font-family:'JetBrains Mono',monospace;font-size:6.6pt;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-deep);text-align:right;white-space:nowrap;padding-left:3mm;}
.ccam .note{margin-top:4mm;font-size:7.5pt;line-height:1.45;color:var(--ink-3);}

/* comparison (electrolib) */
.compare{margin-top:6mm;border:1px solid var(--line);border-radius:3px;overflow:hidden;}
.compare table{width:100%;border-collapse:collapse;}
.compare th,.compare td{padding:3mm 4mm;text-align:left;font-size:8.5pt;border-bottom:1px solid var(--line);}
.compare thead th{background:var(--night);color:#fff;font-family:'JetBrains Mono',monospace;font-size:7.5pt;letter-spacing:.1em;text-transform:uppercase;font-weight:500;vertical-align:bottom;}
.compare thead th span{display:block;font-weight:400;text-transform:none;letter-spacing:0;opacity:.6;font-size:6.8pt;margin-top:1.5mm;}
.compare thead th:first-child{background:#08172e;}
.compare tbody .crit{font-family:'JetBrains Mono',monospace;font-size:7.5pt;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-weight:500;}
.compare tbody td{color:var(--blue-deep);font-weight:500;}
.compare tbody tr:nth-child(even){background:#fafbfc;}
.compare tbody tr:last-child td{border-bottom:none;}
.compare .yes{color:var(--teal-deep);font-weight:700;}
.compare .no{color:var(--ink-3);}
.compare .hl{color:var(--teal-deep);font-weight:700;}

/* finance band (dark) */
.finance{
  margin-top:auto;
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(3,165,143,.16), transparent 55%),
    linear-gradient(180deg, var(--night) 0%, #0a1d3a 60%, #08172e 100%);
  color:#fff;border-radius:3px;padding:7mm 8mm;
  display:grid;grid-template-columns:1fr 60mm;gap:8mm;align-items:center;
}
.finance .eyebrow-w{font-family:'JetBrains Mono',monospace;font-size:7pt;letter-spacing:.24em;text-transform:uppercase;color:var(--teal);font-weight:500;}
.finance .h3{font-size:15.5pt;line-height:1.15;font-weight:700;color:#fff;letter-spacing:-.015em;margin-top:3mm;}
.finance .h3 .em{color:var(--teal);}
.finance .sub{margin-top:3mm;font-size:8.5pt;line-height:1.55;color:rgba(255,255,255,.8);font-weight:300;max-width:95mm;}
.finance .sub strong{font-weight:500;color:#fff;}
.finance .quote-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:2px;padding:5mm;}
.finance .quote-card .q-l{font-family:'JetBrains Mono',monospace;font-size:6.5pt;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6);}
.finance .quote-card .q-v{font-size:15pt;font-weight:700;color:#fff;margin-top:2mm;letter-spacing:-.01em;}
.finance .quote-card .q-m{font-size:6.8pt;color:rgba(255,255,255,.65);margin-top:2mm;line-height:1.4;font-family:'JetBrains Mono',monospace;letter-spacing:.04em;}

/* footer */
.fverso .foot{
  margin-top:auto;padding-top:5mm;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:end;
  font-family:'JetBrains Mono',monospace;font-size:7.5pt;letter-spacing:.16em;color:var(--ink-3);text-transform:uppercase;
}
.fverso .foot .tag{color:var(--blue-deep);font-weight:500;letter-spacing:.08em;}
.fverso .foot .tag em{color:var(--teal);font-style:normal;}

/* print */
@media print{
  @page{size:A4 portrait;margin:0;}
  html,body{background:#fff;padding:0;gap:0;margin:0;}
  body{display:block;}
  .viewer-banner{display:none;}
  .page{box-shadow:none;border-radius:0;page-break-after:always;break-after:page;}
  .page:last-child{page-break-after:auto;break-after:auto;}
  *{-webkit-print-color-adjust:exact !important;print-color-adjust:exact !important;color-adjust:exact !important;}
}

/* Download button — viewer banner */
.viewer-banner__dl{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 13px;border-radius:6px;
  background:var(--teal);color:#fff;
  font-family:'Poppins',sans-serif;font-size:7.5pt;font-weight:600;letter-spacing:.04em;text-transform:none;
  text-decoration:none;border:none;cursor:pointer;
  transition:background .15s;
}
.viewer-banner__dl:hover{background:var(--teal-deep);}
.viewer-banner__dl svg{flex:none;}
@media print{.viewer-banner__dl{display:none;}}