/* ============================================================
   Partner logos — shared, owned by the `website` domain app.

   The same three third-party marks appear in two places that are
   owned by two different nested apps:
     home "Wir" strip → website_about/_wir.html      (+ wir.css)
     Vernetzen nodes  → website_services_connect/…   (+ page.css)
   Neither app may reach into the other, and the treatment must be
   identical on both pages, so the shared rules live here — in the
   common parent — and each consuming page adds the <link>.
   The assets are global, under static/img/partners/ — third-party
   trademarks, kept out of Kachelbunt's own static/img/ brand files
   and copied byte-for-byte from the handover (never re-optimised).

   TREATMENT — original colours, full opacity. DO NOT RESTYLE.
   These are third-party registered marks and must be reproduced as
   their owners publish them: no filter, no grayscale/monochrome, no
   opacity below 1, no recolouring to match a section's palette. A
   trademark licence covers faithful reproduction, not a tinted
   variant — so the visual pull of Cybertec's cyan, movinglayers'
   aubergine and Directus' navy is a constraint here, not an
   oversight. Size is the only thing this file normalises (uniform
   scaling leaves a mark intact). The host context sets
   --partner-logo-h and, if it needs it, the surrounding rhythm.
   ============================================================ */

.partner-logo {
  /* Default; every host context overrides this. */
  --partner-logo-h: 2rem;
  /* Per-logo optical correction, see the modifiers below. */
  --partner-logo-scale: 1;

  display: block;
  height: calc(var(--partner-logo-h) * var(--partner-logo-scale));
  width: auto;
  /* Pin the ratio from the asset's own viewBox. Not a design value —
     it is the file's intrinsic geometry. Required because
     movinglayers.svg ships without width/height attributes, which
     makes some browsers fall back to the 300×150 default ratio when
     it is used as an <img>. An explicit aspect-ratio wins over any
     intrinsic ratio, so the box is deterministic everywhere. */
  aspect-ratio: var(--partner-logo-ar);
  /* Safety net for very narrow viewports: base.css caps every image
     at max-width 100%. If that ever clamps the width, contain keeps
     the mark undistorted instead of squashing it. */
  max-width: 100%;
  object-fit: contain;
  object-position: left center;
}

/* ---- The mark as a link to the partner ---------------------
   Wraps a bare <img>, so two globals need neutralising: the link
   colour is irrelevant (no text node) but `a:hover` in base.css
   would draw an underline across the bottom of the image box.
   The hover affordance is the same 2px lift the .ve-node cards
   use — deliberately NOT an opacity or filter change, because the
   marks must stay faithfully reproduced (see the header above).
   Focus is left to the global :focus-visible ring, which wraps
   the inline-flex box tightly around the mark.
   ------------------------------------------------------------ */
.partner-logo-link {
  display: inline-flex;
  text-decoration: none;
  transition: transform var(--dur-2) var(--ease-snap);
}
.partner-logo-link:hover { text-decoration: none; transform: translateY(-2px); }

/* ---- Per-logo geometry + optical weight --------------------
   All three are "mark + wordmark" lockups whose mark fills the full
   box height, so equal box height is the right baseline; the scales
   are the optical corrections on top of it. Normalised so the
   largest is 1 — the host context can then use --partner-logo-h
   directly as the row/band height, no logo ever exceeds it.
     directus      1.00  reference; its wordmark is the smallest
                         share of its box (ascender ≈ 0.58 of height)
     cybertec      0.96  the widest lockup (5.66:1) and ~19% of its
                         box is the small strapline
     movinglayers  0.88  heaviest mark (solid bars) and the only
                         two-line wordmark → reads oversized at par
   ------------------------------------------------------------ */
.partner-logo--cybertec     { --partner-logo-ar: 1466 / 259.2; --partner-logo-scale: 0.96; }
.partner-logo--movinglayers { --partner-logo-ar: 1920 / 382.5; --partner-logo-scale: 0.88; }
.partner-logo--directus     { --partner-logo-ar: 173 / 36;     --partner-logo-scale: 1; }