/* ==========================================================================
   88-pages — inner content pages (Quality, Technology, Sustainability,
   Company, Applications).

   Deliberately small. The two new blocks reuse surfaces the theme already
   owns — .card inside .g2 for the document library, .ab-spec for the
   stability rows — so this sheet only supplies the rhythm those surfaces do
   not already carry. No !important anywhere; the zip sheets load after the
   core sheets, so equal specificity is enough.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Quality — documentation library
   -------------------------------------------------------------------------- */

/* The section already opens with a heading, a lede and the editorial image.
   The sub-heading needs air above it so the four cards read as a second
   movement rather than as a caption to the picture.

   C3: the hook moved from the heading itself to a wrapper, because the heading
   is now en_section_head( '', …, 'h3' ) — the same sub-head component
   en_compliance() uses in .certs-hd one section down. .hd already owns the gap
   beneath it, so only the space above is set here. */
.doclib-hd{margin-top:var(--s-7)}

.doclib-top{
  display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-3);
}

/* The code badge now carries the document type's icon. .doc is inline-block
   site-wide and is not restyled — only the badges inside this component become
   a flex row, so the glyph and the code sit on one baseline-centred line.
   Scoped by .doclib-i so no other .doc on the site is touched. */
.doclib-i .doc{display:inline-flex;align-items:center;gap:var(--s-1)}
.doclib-icon{display:inline-flex;align-items:center;justify-content:center}
.doclib-icon .en-icon{width:var(--s-4);height:var(--s-4)}

/* Matches the h3 scale rather than introducing a fifth heading size: inside a
   card these are peers of every other card title on the site, and only sit at
   h4 because the section heading above them is an h2. */
.doclib-t{
  font-family:var(--display);font-size:var(--fs-h3);line-height:var(--lh-h3);
  font-weight:var(--fw-sub);letter-spacing:var(--ls-display);
  margin:var(--s-4) 0 var(--s-2);
}

/* .card p carries a trailing margin for cards that end in a link. These end
   in the paragraph itself. */
.doclib-p{margin-bottom:0}

.doclib-n{margin-top:var(--s-5)}

/* --------------------------------------------------------------------------
   Quality — stability and shelf life

   Four labelled parameters, all outstanding. Held to a measure rather than
   run to the full container: a two-column band of empty rows across 1200px
   reads as a broken table, and the point of the block is that the fields are
   named, not that they are wide.
   -------------------------------------------------------------------------- */
.stab-l{max-width:680px}

/* The rows carry the per-cell evidence mark rather than a chip apiece, so the
   value column no longer sets its own width from a 147px nowrap chip. Hold the
   mark against the label the way every other marked cell on the site does. */
.stab-l .ab-spec-r dd{display:flex;align-items:center;min-height:var(--s-5)}

/* --------------------------------------------------------------------------
   Quality — the four pillars

   .qbox is the theme's box for a named claim carrying an evidence state, and
   it is unchanged: the icon is an addition inside the existing h3, not a
   second card style. .qbox--icon exists so only the boxes that opt in get the
   flex heading — en_compliance()'s boxes on the same page keep their plain
   heading until someone who owns inc/sections.php decides otherwise.
   -------------------------------------------------------------------------- */
.qbox--icon .qbox-h{display:flex;align-items:center;gap:var(--s-3)}
.qbox-icon{display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto;color:var(--sage)}
.qbox-icon .en-icon{width:var(--s-5);height:var(--s-5)}

/* --------------------------------------------------------------------------
   Company — hero fact strip

   .page-visual-intro bottom-aligns its two columns, which is right when the
   picture column holds only a picture. Company's picture column now also holds
   the four outstanding company facts, so the columns top-align instead and the
   strip hangs under the image.
   -------------------------------------------------------------------------- */
.pg-intro--top{align-items:start}
.page-visual-media .ab-facts{margin-top:var(--s-6)}

/* --------------------------------------------------------------------------
   Company — team cards without a portrait

   .ab-card was built photo-on-top; with the image gone the body is the whole
   card and needs the border the photo used to provide underneath its own
   header row.
   -------------------------------------------------------------------------- */
.pg-team .ab-card-t{
  padding-bottom:var(--s-4);border-bottom:1px solid var(--line);
  margin-bottom:0;
}
.pg-team .ab-fields{border-top:0}
