/* ===============================================================
   Shared equipment layout — CMS flow port of the static .equip__*
   template (home-html/equipamento-01.html is the canonical source).
   The static pages position every block by absolute canvas-px; with
   variable CMS content that can't hold, so this is a FLOW/stacked
   rebuild that keeps the same visual: title band on top, then one
   .equip__block per equipamento — pill on top, photo + bullets in the
   LEFT column, specs/description in the RIGHT column.

   Decorative art (U8): the page background is a FLAT teal COLOR so it
   fills ANY content height (no black gap / no clipping). The PSD
   decorative pieces — geometric squares (left edge) + fluorescence
   micrographs — are layered on .page as positioned background images.
   Micrographs are SCREEN-blended in the PSD, so their black background
   must drop out: we give them background-blend-mode:screen against the
   teal base. Positions (rem) come from the U7 extraction manifest,
   anchored flow-relative (not dead canvas-y) so they track the
   variable content instead of overshooting it.
   Loaded on all categoria_equipamento pages (see inc/enqueue.php).
   =============================================================== */

/* Flat page green sampled from every equipment PSD (~rgb(21,129,111)).
   Fills the whole .page regardless of content height — kills the black gap. */
:root { --equip-green: #1B8E7B; }   /* design page teal measured from the JPG at 8 clean spots = ~rgb(27,142,123); the flat PSD "Rectangle 15" base (#158070) renders brighter in the artwork, so match the JPG, not the raw shape */

.equip { background: transparent; position: relative; }

/* Large faded concentric "C" arcs sweeping from the top-left of every equipment
   page — a brand header graphic present in each PSD (Imagens e Grafismos/Vector
   Smart Object, MULTIPLY 0.5; the huge shape's curved edges cross the upper-left
   canvas). The site had only the small geo squares, never these arcs — the
   client's "grafismo enorme que falta". Baked (arc ⊗ teal @50%, opaque, seamless
   with --equip-green) into equip-decor-arc.png, cropped to the visible band below
   the 465px header (design y465→977 = 1800x512px = full-width x 32rem) and pinned
   to the .equip top. Sits BEHIND the title/blocks (z-index:1). */
.equip::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 32rem;
  /* v3 (client QA 27/08 "ícone desfocado"): band recomposited from the PSD itself
     (dropdown/title layers hidden) — crisp edges + grain, replacing the soft bake. */
  /* v4 (client QA 02/09 item 2): bottom 220px of the band graded into the flat
     --equip-green so the art-to-page transition reads continuous (the PSD page is
     a gradient, the live page is flat — the hard edge at the band's end showed). */
  background: url('../../img/equip-decor-arc.webp?v=4') left top / 100% auto no-repeat;
  pointer-events: none;
  z-index: 0;
}

/* Base: flat teal color on .page for every equipment term (no image → no gap). */
.term-apotome    .page,
.term-tirf       .page,
.term-confocal   .page,
.term-cytation   .page,
.term-scanner    .page,
.term-invivo     .page,
.term-lightsheet .page {
  background: var(--equip-green);
}

/* --- Decorative art layers (per term) ---------------------------------
   Layer order = paint order: FIRST listed paints on top.
   Micrographs get background-blend-mode:screen (black drops out); the geo
   squares are flat teal on transparent → multiply keeps them faithful.

   DESIGN RULE (from the equipment PSDs, confirmed against the client's QA
   model): each micrograph is a BOTTOM-of-page EDGE-BLEED accent — anchored
   to the page bottom, pushed mostly off the LEFT or RIGHT canvas edge so
   only a corner sliver shows, and kept BELOW the spec/description text. It
   must NEVER climb into the right-hand text column or sit behind a pill.
   Earlier revs anchored these mid-page (top N / bottom 30rem+) at full width,
   so they overlapped the paragraphs — the whole HK 154/156/163/164/181-184/
   191/193/203/208/211/212 batch. We pin them low + off-edge instead.
   Sizes are in rem (1rem ≈ 12.8px on this theme). geo squares stay on the
   left gutter (multiply); the reviewer never flagged them. */

.term-apotome .page {
  /* Geo squares only on the page bg; the microscopy tissue image is now a
     per-block element resting on the next pill bar (see .equip__block::before).
     The asset is cropped to the squares cluster and painted ONCE (no repeat-y):
     tiling its long left bar drew a dark strip down the whole left edge —
     the "faixa verde escuro" the client flagged beside the pills (QA 26/08). */
  background-image: url('../../img/equip-01-decor-geo.png?v=2');
  background-repeat: no-repeat;
  background-position: left 0 top 20rem;
  background-size: 30.375rem auto;
  background-blend-mode: multiply;
}

/* Tissue micrograph rests on the pill bar of the block below it (design/client
   #154/#155): a decorative element at the top-right of each block after the
   first, sitting just above its own pill, over the right column. screen blend
   drops the asset's black background against the teal page. */
.term-apotome .equip__block:not(:first-of-type)::before {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  /* QA 26/08: enlarged and pulled down so the tissue sits ON the pill bar
     ("aumentar a figura… colocando ela colada na faixa") — the extra overlap
     tucks the asset's dark bottom fade behind the pill, killing the teal gap. */
  transform: translateY(-86%);
  width: 54rem;
  height: 26rem;                  /* clips to just the dome (top of the tall asset) */
  /* Blend the asset's black bg against the page teal WITHIN the element (the box
     becomes seamless teal, the green dome shows) — same trick as the .page decor. */
  background:
    url('../../img/equip-01-decor-microscopy.png') no-repeat right top / 54rem auto,
    var(--equip-green);
  background-blend-mode: screen;
  pointer-events: none;
  z-index: 0;
}

.term-tirf .page {
  background-image:
    url('../../img/equip-02-decor-microscopy.png'),
    url('../../img/equip-02-decor-geo.png?v=2');
  background-repeat: no-repeat, no-repeat;
  /* QA 26/08: micrograph raised from a 7.5rem sliver ("aumentar gravura no canto
     direito inferior") — still bottom-right so it stays clear of the text column.
     Geo squares dropped to the bottom-left corner ("descer ícone… evitar
     sobreposição com texto"). */
  background-position:
    right 0 bottom 0,
    left 0 bottom 2rem;
  background-size:
    20rem auto,
    19.625rem auto;
  background-blend-mode: screen, multiply;
}

.term-confocal .page {
  /* Design (EQUIPAMENTOS_03) has THREE micrographs at distinct block-tied heights,
     not one bottom band. Extracted from the PSD (all SCREEN blend, canvas 6489px):
       - cluster (WA0012, green/orange): l0 t878 r502 b1565 = 502x687px, top-left,
         bleeds off the left edge → top-anchored (design y878/16 = 54.875rem).
       - fibers (Imagem Letícia Spinning Disk, green): l958 t1876 r1800 b3268 =
         842px wide, mid-page right edge → top-anchored (y1876/16 = 117.25rem).
       - mosquito (blue): l0 t5699 r888 b6348 = 888x649px, near the footer, bleeds
         left → bottom-anchored ((6489-6348)/16 = 8.8rem above the page bottom). */
  /* v3 (client QA 27/08): cluster/mosquito/fibers re-extracted from the PSD layers —
     kills the denoise patches on the LSM880 sphere (item 4) and drops the baked
     "500 µm" scale bar + caption from the mosquito (item 7, mosquito kept). */
  /* geo v3 (client QA 02/09 item 3): full PSD layer WITH the long vertical bar under
     the squares (the modelo shows it; the earlier crop kept only the cluster).
     Confocal-only — on other pages the client asked for the bar to be removed. */
  background-image:
    url('../../img/equip-03-decor-cluster.png?v=3'),
    url('../../img/equip-03-decor-microscopy-1.png?v=3'),
    url('../../img/equip-03-decor-mosquito.png?v=3'),
    url('../../img/equip-03-decor-geo.png?v=3');
  /* geo painted once (asset cropped to the squares cluster) — repeat-y tiled its
     long bar into the left-edge dark strip flagged beside LSM 880/910 (QA 26/08) */
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
  background-position:
    left 0 top 54.875rem,
    /* fibers pushed 6rem off the right edge (QA 02/09 item 3): the fern's bright
       body started at x1454, under the right text column (ends ~x1520) */
    right -6rem top 117.25rem,
    left 0 bottom 8.8rem,
    /* geo squares belong beside the SPINNING DISK block (PSD layer y2400), not the
       hero — client QA 27/08 item 5: "falta ícone no canto esquerdo" */
    left 0 top 150rem;
  background-size:
    31.375rem auto,
    52.625rem auto,
    64rem auto,   /* mosquito raised from 55.5rem — client: "realçar figura do mosquito" */
    30.375rem auto;
  background-blend-mode: screen, screen, screen, multiply;
  background-color: var(--equip-green);
}

.term-cytation .page {
  background-image:
    url('../../img/equip-04-decor-microscopy.png'),
    url('../../img/equip-04-decor-geo.png?v=2');
  background-repeat: no-repeat, no-repeat;
  /* Design (EQUIPAMENTOS_04, layer IMG-...WA0014): the orange neuron micrograph is
     a large bottom-right band anchored to the page's bottom-right corner (PSD
     l344 t1748 r1800 b2637 = 1456x889px = 91x55.5rem). Its bottom ~21rem sits
     BEHIND the opaque footer; the top ~34rem shows above it, exactly like the JPG. */
  background-position:
    right 0 bottom 0,
    left 0 bottom 20rem;
  background-size:
    91rem auto,
    24.125rem auto;
  background-blend-mode: screen, multiply;
}

.term-scanner .page {
  background-image:
    url('../../img/equip-06-decor-microscopy.png'),
    url('../../img/equip-06-decor-geo.png?v=2');
  background-repeat: no-repeat, no-repeat;
  /* Design (EQUIPAMENTOS_06, layer "02 copy 3"): large purple tissue band anchored
     to the bottom-right corner (PSD l377 t1242 r1800 b2572 = 1423x1330px = 88.9x83.1rem),
     bleeding right. Bottom ~21rem behind the footer; the rest shows above it. */
  background-position:
    right 0 bottom 0,
    left 0 bottom 20rem;
  background-size:
    88.9rem auto,
    19.625rem auto;
  background-blend-mode: screen, multiply;
}

.term-invivo .page {
  background-image:
    url('../../img/equip-07-decor-microscopy.png'),
    url('../../img/equip-07-decor-geo.png?v=2');
  background-repeat: no-repeat, no-repeat;
  /* Design (EQUIPAMENTOS_07, layer "imagem"): large holographic spectrum graphic
     spanning almost the full width, anchored bottom-right corner (PSD l44 t1150
     r1800 b2571 = 1756x1421px = 109.75x88.8rem), bleeding far off the right edge.
     Bottom ~21rem behind the footer; the rest shows above it. */
  background-position:
    right 0 bottom 0,
    left 0 bottom 20rem;
  background-size:
    109.75rem auto,
    19.625rem auto;
  background-blend-mode: screen, multiply;
}

.term-lightsheet .page {
  background-image:
    url('../../img/equip-08-decor-microscopy.png'),
    url('../../img/equip-08-decor-geo.png?v=2');
  background-repeat: no-repeat, no-repeat;
  /* Design (EQUIPAMENTOS_08, layer WA0020): the light-sheet "fish" micrograph, a
     tall narrow image anchored to the right edge, its bottom ~10rem above the page
     bottom (PSD l1401 t1493 r1800 b2418 in a 2576px canvas = 399x925px = 24.94x57.8rem),
     bleeding slightly off the right. Its lower part tucks behind the footer top. */
  background-position:
    right 0 bottom 9.875rem,
    left 0 bottom 20rem;
  background-size:
    24.9375rem auto,
    18.375rem auto;
  background-blend-mode: screen, multiply;
}

/* criostatos (05): the baked equipamento-05-fundo.webp bakes the green-cell
   micrograph near its own bottom (canvas y~2593), but the CMS page is ~700px
   shorter than the 3542px design canvas, so top-anchoring the webp clips that
   micrograph away (it renders below the footer / off the .page box) — that's why
   the client saw it "missing". Fix: keep the webp top-anchored for the top geo
   squares, and paint the micrograph (extracted from EQUIPAMENTOS_05 PSD, layer
   WA0022: l547 t2593 r1800 b3542 = 1253x949px = 78.3x59.3rem) as a SEPARATE layer
   anchored to the bottom-right corner, so it lands above the footer like the JPG. */
.term-criostatos .page {
  background-image:
    url('../../img/equip-05-decor-microscopy.png'),
    /* v4 (client QA 27/08 item 9): recomposited full-height from the PSD — the old
       2780px-tall crop ended mid-page and the flat background-color below read as a
       lighter green band ("faixa verde") behind the LM1850S. */
    url('../../img/equipamento-05-fundo.webp?v=4');
  background-repeat: no-repeat, no-repeat;
  background-position:
    right 0 bottom 0,
    top center;
  background-size:
    78.3rem auto,
    100% auto;
  background-blend-mode: screen, normal;
  background-color: var(--equip-green);
}

/* ===== Head band: page title ===== */
.equip__head {
  position: relative;
  /* Reserve the head band so the first block starts at the design y (~y1121):
     656px from the head top (page-y465) = 41rem. The title is absolutely centered
     inside it (below), so its line-count no longer shifts the blocks. */
  min-height: 41rem;
  padding: 0 var(--container-px, 14.4%);
}

/* Faded CAPI "C" fragment — bleeds in from the top-left, sits BEHIND the title
   (design: large soft arc in the empty left half of the head band). */
/* The design's top-left "C"/arcs are near-invisible background texture, NOT a
   distinct element — the previous bold "C" read as a stray graphic. Hidden. */
.equip__head-c {
  display: none;
}

/* --- Sidebar category list (kept for any markup that still renders it) --- */
.equip__sidebar {
  flex: 0 0 clamp(11rem, 20%, 19.0625rem);
  background: #278465;
  border-radius: 0 0 0.75rem 0.75rem;
  list-style: none;
  margin: 0;
  padding: 0;
  align-self: flex-start;
  overflow: hidden;
}
.equip__sidebar-link {
  display: flex;
  align-items: center;
  min-height: 3rem;
  padding: 0.55rem 1.125rem;
  font-family: var(--font);
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.2;
  color: #fff;
  text-decoration: none;
  letter-spacing: var(--track);
}
.equip__sidebar li + li .equip__sidebar-link { border-top: 1px solid rgba(255, 255, 255, 0.45); }
.equip__sidebar-link--active { color: var(--gold); font-style: italic; }
.equip__sidebar-link em { font-style: italic; }

/* --- Page title (current category) — design metrics: DIN Bold 46px --- */
.equip__title {
  /* Absolutely centered on the design title point (x902, y852). The design
     centers every category title on the same vertical midline (~y852), so 1-line
     titles sit lower and 3-line titles higher — matching by centering, not by a
     fixed top. top = 852-465 = 387px = 24.1875rem; left = 902/1800 = 50.1%. */
  position: absolute;
  z-index: 1;   /* above the header arc */
  top: 24.1875rem;
  left: 50.1%;
  transform: translateY(-50%);
  /* Natural width — line breaks come from the CMS content (nl2br), reproducing the
     design's manual breaks exactly (apotome 3 lines, confocal 2 lines, the rest 1).
     max-content sizes the box to the longest line so no line auto-wraps. */
  width: max-content;
  max-width: 40rem;
  font-family: var(--font);
  font-weight: 700;
  font-size: 2.4525rem;   /* PSD 39.24px */
  line-height: 1.1;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: var(--track);
}

/* ===== Content blocks ===== */
/* Near-full-width composition like the static (photo x≈12.75rem, text to the
   right edge). Small right margin; larger left inset so the photo column sits
   at the design x-position. Narrow left inset keeps photo+text on ONE row. */
.equip__block {
  position: relative;
  z-index: 1;                                 /* content above the decorative bg */
  /* Design composition (equipment PSDs): a wide title PILL bar on TOP (bleeds off
     the right edge), then a ROW of [photo LEFT (big) | specs/description RIGHT]
     below it, with the acquisition bullets under the photo. Measured for scanner:
     pill x746→1887 y1121; photo x129 w828 y1228; text x901 y1347; bullets x261 y2021. */
  margin-bottom: clamp(3rem, 6vw, 6rem);
}

/* Title pill — wide dark bar at the TOP of the block, starting at design x746 and
   bleeding off the right canvas edge (rounded left corners, flat right). */
.equip__pill {
  position: relative;
  z-index: 1;   /* acima dos decors de bloco (o dome ::before encosta por trás, como no design) */
  display: flex;
  align-items: center;
  min-height: 6.8125rem;   /* 109px */
  margin: 0 0 0 46.625rem;   /* left x746; flat right edge flush to the page edge (design bleeds off-canvas; clipping at the edge looks identical, no h-overflow). Row starts at the pill bottom (design photo y1228 ≈ pill bottom y1230) */
  background: #365358;
  border-radius: 0.9375rem 0 0 0.9375rem;
  /* Asymmetric top/bottom padding nudges the all-caps text ~6px DOWN so its cap
     height is optically centered like the design (align-items:center centers the
     line box, but caps sit high in it — the font reserves unused descender space).
     Left/right inset 4.9375rem → design text x825. */
  padding: 1.375rem 4.9375rem 0.625rem;
  font-family: var(--font);
  font-weight: 700;
  font-style: italic;
  font-size: 2.4525rem;   /* PSD 39.24px */
  line-height: 1.5;
  color: #fff;
  letter-spacing: var(--track);
}

/* Row below the pill: photo LEFT + text RIGHT. */
.equip__row {
  display: flex;
  align-items: flex-start;
  column-gap: 0.25rem;
  padding-left: 8.0625rem;   /* photo left edge → design x129 */
}

/* LEFT column — photo on top, bullets below. The column is 48.25rem (772px); the
   photo fills it and is CLIPPED to it (no overflow) so it ends exactly where the
   text column starts (design x901) and never covers the text. (An earlier rev let
   the photo overflow 56px to mimic the design's transparent-edge tuck, but on
   equipment with a wide/centered body — e.g. the Apotome upright — that edge is
   NOT transparent and the microscope covered the description text.) */
.equip__media {
  flex: 0 0 48.25rem;
  max-width: 48.25rem;
  position: relative;
}
.equip__photo {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
}

/* Bullets live in the LEFT column, under the photo (design x≈261). */
.equip__bullets {
  font-family: var(--font);
  font-weight: 400;
  font-size: 1.65375rem;   /* PSD 26.46px */
  line-height: 1.42;   /* raised with specs/desc (QA 26/08 readability pass) */
  color: #fff;
  letter-spacing: var(--track);
  list-style: none;
  padding: 0;
  margin: clamp(1.5rem, 2.4vw, 2.5rem) 0 0 8.25rem;   /* ~x261 relative to the photo column left (x129) */
}

/* RIGHT column — specs (bold) + description (light italic). Starts lower than the
   photo top, per the design (scanner description at y1347 vs photo top y1228). */
.equip__text {
  min-width: 0;
  max-width: 38.3rem;   /* design text column ~613px */
  margin-top: 7.4rem;   /* ~119px below the row top → design description y-start */
}
.equip__specs,
.equip__desc {
  font-family: var(--font);
  font-size: 1.65375rem;   /* PSD 26.46px */
  color: #fff;
  letter-spacing: var(--track);
  margin: 0 0 2.3125rem;
}
/* Leading raised from the PSD-measured 1.28/1.21 (client: text reads squeezed —
   "aumentar espaçamento entre linhas… gerando leitura", QA 26/08). */
.equip__specs { font-weight: 700; line-height: 1.42; }
.equip__desc { font-weight: 300; font-style: italic; line-height: 1.38; }
.equip__desc p { margin: 0; }
.equip__desc p + p { margin-top: 1.333em; }

/* "EM BREVE" circle badge over coming-soon photos (Ellipse 282px, gold 46px). */
.equip__badge {
  position: absolute;
  top: 8%;
  left: 8%;
  width: 17.625rem;
  height: 17.625rem;
  border-radius: 50%;
  background: #365358;
  box-shadow: 0 0.0625rem 1.125rem rgba(6, 0, 7, 0.43);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font);
  font-weight: 700;
  font-size: 2.876rem;
  line-height: 1;
  color: var(--gold);
  letter-spacing: var(--track);
}

/* Client QA 27/08 item 10: the Flamingo Light Sheet is coming soon — same "EM BREVE"
   circle used on the LSM 990/Viluma (design Ellipse 282px, gold 46px type), drawn
   CSS-only over the photo since the detail template has no badge slot. */
.term-lightsheet .equip__media::after {
  content: "EM BREVE";
  position: absolute;
  /* QA 02/09 item 5: nudged up+left so more of the Flamingo body shows */
  top: 0;
  left: -4.5%;
  width: 17.625rem;
  height: 17.625rem;
  border-radius: 50%;
  background: #365358;
  box-shadow: 0 0.0625rem 1.125rem rgba(6, 0, 7, 0.43);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font);
  font-weight: 700;
  font-size: 2.876rem;
  line-height: 1;
  color: var(--gold);
  letter-spacing: var(--track);
  z-index: 2;
}

/* ===== Responsive — fluid reflow below 60rem (mobile) ===== */
@media (max-width: 60rem) {
  .equip::before { display: none; }   /* header arc is a desktop-layout graphic */
  /* mobile QA 02/09: the tissue micrograph tied to the desktop pill geometry landed
     as a stray band mid-page on the stacked layout — desktop-only decor */
  .term-apotome .equip__block:not(:first-of-type)::before { display: none; }
  /* EM BREVE circle scaled to the mobile photo (was covering most of the machine) */
  .term-lightsheet .equip__media::after {
    width: 8rem; height: 8rem; font-size: 1.3rem; top: 0; left: 0;
  }
  .equip__head { min-height: 0; padding-top: 2rem; }
  /* Collapse the desktop grid to a single-column stack (pill → photo → text)
     and drop the large left inset so blocks aren't crammed into a narrow screen. */
  .equip__block { display: block; padding: 0 var(--container-px, 1.25rem); }
  .equip__row { display: block; padding-left: 0; }
  .equip__sidebar { flex-basis: auto; width: 100%; border-radius: 0.75rem; margin-bottom: 2.5rem; }
  .equip__title { position: static; transform: none; top: auto; left: auto; width: auto; font-size: clamp(1.8rem, 7vw, 2.88rem); }
  .equip__head-c { width: 8rem; opacity: 0.5; }   /* small, out of the way on mobile */
  .equip__pill { width: 100%; min-width: 0; margin: 0 0 1.5rem; min-height: 0; padding: 1rem 2rem; border-radius: 0.9375rem; font-size: clamp(1.6rem, 6vw, 2.88rem); }
  .equip__media { width: 100%; max-width: 26rem; margin: 0 auto; }
  .equip__photo { display: block; width: auto; max-width: 100%; max-height: 32rem; margin: 0 auto; }  /* tall cutouts (Spinning Disk, IVIS) filled a whole phone screen */
  .equip__bullets { margin-left: 0; font-size: clamp(0.95rem, 3.4vw, 1.5625rem); }
  .equip__text { width: 100%; max-width: 100%; margin-top: 2rem; padding-right: 0; }
  /* design's manual line breaks are for the 1800px layout — reflow on mobile */
  .equip__desc br { display: none; }
  .equip__specs, .equip__desc { font-size: clamp(0.95rem, 3.4vw, 1.5625rem); }
  .equip__badge { width: 12rem; height: 12rem; font-size: clamp(1.5rem, 6vw, 2.876rem); }

  /* Drop the canvas-scaled decorative micrographs/squares on narrow viewports —
     they are tuned to the 1800px artboard and only clutter mobile. Flat teal stays. */
  .term-apotome .page, .term-tirf .page, .term-confocal .page,
  .term-cytation .page, .term-scanner .page, .term-invivo .page,
  .term-lightsheet .page { background-image: none; }
  .term-criostatos .page { background: var(--equip-green); }
}

@media (min-width: 60.0625rem) {

/* ===== PSD-exact per-term geometry (generated from the prototype measurements) ===== */
.equip__row{display:block;padding-left:56.25rem}
.equip__text{position:relative;z-index:1;max-width:38.6875rem;margin-top:7.25rem}
.equip__text:has(.equip__specs){margin-top:3.5625rem}
.equip__media{position:absolute;flex:none;max-width:none;z-index:0}
.equip__photo{width:100%}
.term-apotome .equip__block:nth-of-type(1) .equip__pill{margin-left:52.9375rem}
.term-apotome .equip__block:nth-of-type(1) .equip__media{left:12.75rem;top:2rem;width:40rem}
.term-apotome .equip__block:nth-of-type(1) .equip__bullets{position:absolute;margin:0;left:3.5625rem;top:54.25rem;width:38.5625rem}
.term-apotome .equip__block:nth-of-type(1){min-height:70rem}
.term-apotome .equip__block:nth-of-type(2) .equip__pill{margin-left:52.9375rem}
.term-apotome .equip__block:nth-of-type(2) .equip__media{left:17rem;top:15.6875rem;width:32.375rem}
.term-apotome .equip__block:nth-of-type(2) .equip__bullets{position:absolute;margin:0;left:-0.6875rem;top:40.4375rem;width:38.5625rem}
.term-apotome .equip__block:nth-of-type(2){min-height:82.8125rem}
.term-tirf .equip__block:nth-of-type(1) .equip__pill{margin-left:52.9375rem}
.term-tirf .equip__block:nth-of-type(1) .equip__media{left:0rem;top:10.125rem;width:65.125rem}
.term-tirf .equip__block:nth-of-type(1) .equip__bullets{position:absolute;margin:0;left:16.3125rem;top:46.0625rem;width:31.25rem}
.term-tirf .equip__block:nth-of-type(1){min-height:111.4375rem}
.term-confocal .equip__block:nth-of-type(1) .equip__pill{margin-left:52.9375rem}
.term-confocal .equip__block:nth-of-type(1) .equip__media{left:8.75rem;top:15.0625rem;width:54.9375rem}
.term-confocal .equip__block:nth-of-type(1) .equip__bullets{position:absolute;margin:0;left:7.5625rem;top:41.0625rem;width:37.375rem}
.term-confocal .equip__block:nth-of-type(1){min-height:77.5625rem}
.term-confocal .equip__block:nth-of-type(2) .equip__pill{margin-left:52.9375rem}
.term-confocal .equip__block:nth-of-type(2) .equip__media{left:9.875rem;top:-8.4375rem;width:51.0625rem}
.term-confocal .equip__block:nth-of-type(2) .equip__bullets{position:absolute;margin:0;left:6.4375rem;top:64.6875rem;width:34.125rem}
.term-confocal .equip__block:nth-of-type(2){min-height:73.5rem}
.term-confocal .equip__block:nth-of-type(3) .equip__pill{margin-left:54.8125rem}
.term-confocal .equip__block:nth-of-type(3) .equip__media{left:6.9375rem;top:-0.125rem;width:53.5rem}
.term-confocal .equip__block:nth-of-type(3){min-height:63rem}
.term-confocal .equip__block:nth-of-type(4) .equip__pill{margin-left:52.9375rem}
.term-confocal .equip__block:nth-of-type(4) .equip__media{left:3.0625rem;top:2.9375rem;width:60.125rem}
.term-confocal .equip__block:nth-of-type(4){min-height:68.3125rem}
.term-cytation .equip__block:nth-of-type(1) .equip__pill{margin-left:49.125rem}
.term-cytation .equip__block:nth-of-type(1) .equip__media{left:14.8125rem;top:0.9375rem;width:35.1875rem}
.term-cytation .equip__block:nth-of-type(1) .equip__bullets{position:absolute;margin:0;left:1.5rem;top:55.125rem;width:28.9375rem}
.term-cytation .equip__block:nth-of-type(1){min-height:71.1875rem}
.term-criostatos .equip__block:nth-of-type(1) .equip__pill{margin-left:52.9375rem}
.term-criostatos .equip__block:nth-of-type(1) .equip__media{left:6.4375rem;top:3.75rem;width:51.3125rem}
.term-criostatos .equip__block:nth-of-type(1) .equip__bullets{position:absolute;margin:0;left:9.9375rem;top:52.375rem;width:35.875rem}
.term-criostatos .equip__block:nth-of-type(1){min-height:65.4375rem}
.term-criostatos .equip__block:nth-of-type(2) .equip__pill{margin-left:52.9375rem}
.term-criostatos .equip__block:nth-of-type(2) .equip__media{left:15.6875rem;top:-0.25rem;width:41.1875rem}
/* The design had no acquisition bullets on the LM1850S, so none were positioned:
   when an editor fills "Dados de aquisição" the bullets took the base static spot
   under a tall photo and spilled onto the footer (client QA 18/09). Place them
   below the photo and grow the block so the footer clears them. */
.term-criostatos .equip__block:nth-of-type(2) .equip__bullets{position:absolute;margin:0;left:3rem;top:59.5rem;width:34rem}
.term-criostatos .equip__block:nth-of-type(2){min-height:70rem}
.term-scanner .equip__block:nth-of-type(1) .equip__pill{margin-left:46.625rem}
.term-scanner .equip__block:nth-of-type(1) .equip__media{left:8.0625rem;top:6.75rem;width:51.75rem}
.term-scanner .equip__block:nth-of-type(1){min-height:63.4375rem} /* footer do proto em y2232 */
.term-invivo .equip__block:nth-of-type(1) .equip__pill{margin-left:46.625rem}
.term-invivo .equip__block:nth-of-type(1) .equip__media{left:21rem;top:-2.75rem;width:28rem}
.term-invivo .equip__block:nth-of-type(1){min-height:67.0625rem}
.term-lightsheet .equip__block:nth-of-type(1) .equip__pill{margin-left:46.625rem}
.term-lightsheet .equip__block:nth-of-type(1) .equip__media{left:19.5625rem;top:5.875rem;width:32.875rem}
.term-lightsheet .equip__block:nth-of-type(1){min-height:66.875rem}

}

/* ===== Ajustes pontuais (report 21/08) — escopados, sem tocar no que funciona ===== */
@media (min-width: 60.0625rem) {
  /* apotome: quebras do título como o protótipo (MICROSCOPIA DE / FLUORESCÊNCIA / WIDEFIELD),
     ignorando as quebras manuais do CMS que vêm em outra posição */
  .term-apotome .equip__title br { display: none; }
  .term-apotome .equip__title { width: 23rem; max-width: 23rem; }

  /* confocal: as fotos da media library não têm a borda transparente dos recortes do PSD —
     limita a largura à coluna da foto (até x~890) e a altura à do design, sem sobrepor o texto */
  .term-confocal .equip__block:nth-of-type(1) .equip__media { width: 46.875rem; }
  .term-confocal .equip__block:nth-of-type(2) .equip__media { width: 45.75rem; }
  .term-confocal .equip__block:nth-of-type(3) .equip__media { width: 48.6875rem; }
  .term-confocal .equip__block:nth-of-type(4) .equip__media { width: 52.5625rem; }
  .term-confocal .equip__media .equip__photo { max-height: 64.625rem; object-fit: contain; object-position: left top; }

  /* criostatos LM1850S: foto abaixo do pill com respiro (a arte do PSD encostava por transparência;
     a foto real é opaca e invadia o título) */
  .term-criostatos .equip__block:nth-of-type(2) .equip__media { top: 8.5rem; }
}